استفاده از متد each در جی کوئری

مسئله

ما می خواهیم بر روی تمام عناصر درون یک آرایه یا ویژگی های  یک آبجکت، تکرار یا حلقه ایجاد کنیم.

راه حل

(function($) {
  $(document).ready(function() {
    var months = [ 'January', 'February', 'March', 'April', 'May','June', 'July', 'August', 'September', 'October','November', 'December'];
    $.each(months, function(index, value) {
      $('#months').append('<li>' + value + '</li>');
    });
    var days = { Sunday: 0, Monday: 1, Tuesday: 2, Wednesday: 3,Thursday: 4, Friday: 5, Saturday: 6 };
    $.each(days, function(key, value) {
      $('#days').append('<li>' + key + ' (' + value + ')</li>');
    });
  });
})(jQuery);

 توضیحات

در این کدها، ما بر روی یک آرایه و بر روی یک آبجکت با استفاده از دستور $.each() حلقه ایجاد می کنیم. اولین آرگومان متد each() یک آرایه یا آبجکت است که تکرار بر روی آن انجام می شود و آرگومان دوم یک متد callback (پاسخ دهنده ) است که برای هر عنصر تکرار می شود. توجه کنید که این کار کمی با دستور $('div').each() که آرگومان اول آن یک تابع callback است، تفاوت دارد.

وقتی که تابع callback  که توسط برنامه نویس تعریف شده است، اجرا می شود، متغیر this برابر با مقدار عنصری می گردد که در حال حاضر تکرار بر روی آن انجام می شود. بنابراین کدهای بالا را می توانیم به صورت زیر بنویسیم:

(function($) {
   $(document).ready(function() {
     var months = [ 'January', 'February', 'March', 'April', 'May','June', 'July', 'August', 'September', 'October','November', 'December'];
     $.each(months, function() {
       $('#months').append('<li>' + this + '</li>');
     });
     var days = { Sunday: 0, Monday: 1, Tuesday: 2, Wednesday: 3,Thursday: 4, Friday: 5, Saturday: 6 };
     $.each(days, function(key) {
       $('#days').append('<li>' + key + ' (' + this + ')</li>');
     });
  });
})(jQuery);

  {module کمک نقدی به نویسنده}