مسئله

فرض کنید که ما یک رشته ی(chain) جی کوئری بلند داریم که حاوی متدهایی مثل .children() و .end() برای کار کردن برروی چند گروه از عناصر مرتبط  است. اما برای ما سخت است که متوجه شویم کدام دستور بر روی کدام عنصر اعمال می شود:

$('#box').addClass('contentBox').children(':header')
  .addClass('contentTitle').click(function() {
    $(this).siblings('.contentBody').toggle();
  }).end().children(':not(.contentTitle)')
.addClass('contentBody').end()
.append('<div class="contentFooter"></div>')
.children('.contentFooter').text('generated content');

راه حل

باید هر متد را در خط مربوط به خود قرار دهیم و علمگر های نقطه(.) را در ابتدای هر خط قرار دهیم. سپس باید برای هر بخش از رشته(chain)، تو رفتگی ایجاد کنیم تا تا کدهای این بخش ها را مشخص کنیم.بنابراین  وقتی که از متدهایی مثل .children() یا .siblings() استفاده می کنید، تورفتگی را افزایش دهید و وقتی که متد .end() را فراخوانی می کنید، تورفتگی را کاهش دهید و به سر خط برگردید.اگر در جی کوئری تازه کار هستید، می توانید بخش های پایه  مربوط به رشته(chaining) و متد .end() را در فصل 1 مشاهده کنید.

$('#box')
  .addClass('contentBox')
  .children(':header')
    .addClass('contentTitle')
    .click(function() {
      $(this).siblings('.contentBody').toggle();
    })
.end()
.children(':not(.contentTitle)')
  .addClass('contentBody')
.end()
.append('<div class="contentFooter"></div>')
.children('.contentFooter')
  .text('generated content');

توضیحات

بخش زیر بررسی شود:

با شکستن هر متد در خط مربوط به خود، مشاهده ی آنها بهتر خواهد شد و مشاهده می کنیم که چه اتفاقی در آنها رخ داده است.

اگر از تو رفتگی ها استفاده کنیم، موقعی که داریم کدها را اصلاح می کنیم، انجام این کار ساده می شود و کمک می کند تا پی گیری کنیم که چه موقع عملیات تخریبی(destructive operations ) اتفاق می افتند و از طریق .end() لغو می شوند. این سبک تورفتگی باعث می‌شود که هر فراخوانی برای هر مجموعه معینی از عناصر همیشه در یک ردیف قرار گیرد، حتی اگر متوالی نباشند.

 بعنوان مثال، واضح  است که بسته بندی <div> یک عنصر قبل و یک عنصر بعد از خود دارد، با اینکه عملیاتی بر روی عناصر بین آنها انجام شود.

 قرار دادن عملگرهای نقطه(.) در ابتدای خط ها، به جای پایان خط ها، یک نوع فوت کوزه گری محسوب می شود: این کار یک نوع یادآور محسوب می شود که این کدها متد هستند و تابع های معمولی نیستند.

 نکته:

آیا جی کوئری رشته بندی(chaining) را اختراع کرده است؟ نه. جی کوئری به خوبی از رشته بندی متدها(method chaining)  استفاده می کند، اما این رشته بندی از اولین روزها، در جاوا اسکریپت وجود داشته است. بعنوان مثال، در زیر، یک کاربرد مشهور از رشته بندی با یک آبجکت رشته(string object) را مشاهده می کنید:

function htmlEscape( text ) {
return text
.replace( '&', '&' )
.replace( '<', '&lt;' )
.replace( '>', '&gt;' );
}

• بعدی
• قبلی