Bu JavaScript / jQuery sözdizimi nasıl çalışır: (function (window, undefined) {}) (window)?

Hiç jQuery 1.4 kaynak kodundaki başlık altına bir göz attınız ve aşağıdaki şekilde nasıl kapsüllendiğini fark ettiniz mi :

(function( window, undefined ) {

  //All the JQuery code here 
  ...

})(window);

JavaScript Ad Alanı ile ilgili bir makale ve " Önemli Bir Ebeveyn Parçası " başlıklı bir makale okudum , bu yüzden burada neler olduğu hakkında bir şeyler biliyorum.

Ama bu sözdizimini daha önce hiç görmedim. Orada ne undefinedyapıyor? Ve neden windowgeçilmeli ve daha sonra tekrar ortaya çıkmalı?

Undefined normal bir değişkendir ve ile kolayca değiştirilebilir undefined = "new value";. Böylece jQuery, GERÇEKTEN tanımsız olan bir yerel "tanımsız" değişken oluşturur.

Window değişkeni performans nedenleriyle yerel yapılır. Çünkü JavaScript bir değişkeni ararken değişken adını bulana kadar yerel değişkenlerden geçer. Bulunamadığı zaman, JavaScript genel değişkenleri filtreleyene kadar bir sonraki kapsamdan geçer. Dolayısıyla, pencere değişkeni yerel hale getirilirse, JavaScript bunu daha hızlı arayabilir. Daha fazla bilgi: JavaScript'inizi Hızlandırın - Nicholas C. Zakas

Tanımsız

undefinedBir argüman olarak ilan etmek , ama asla ona bir değer iletmemek, küresel kapsamda üzerine yazılabilecek bir değişken olduğu için her zaman tanımsız olmasını sağlar. Bu, birkaç karakter kazandıran a === undefinedgüvenli bir alternatif yapar typeof a == 'undefined'. Belge bununla birlikte kod daha minifier dostu yapar undefinediçin kısaltılabilir ubirkaç karakter tasarrufu, mesela.

pencere

windowBağımsız değişken olarak iletmek , performansı etkileyen yerel kapsamda bir kopya tutar: http://jsperf.com/short-scope . windowArtık tüm erişimlerin kapsam zincirinde bir seviye daha az seyahat etmesi gerekecek. Olduğu gibi undefined, yerel bir kopya daha agresif bir küçültmeye izin verir.

Kenar notu:

Bu, jQuery geliştiricilerinin niyeti olmasa da window, içeri aktarma , kütüphanenin sunucu tarafı Javascript ortamlarına, örneğin node.js'ye - global bir windownesnenin olmadığı daha kolay entegre edilmesine izin verir . Böyle bir durumda, windownesneyi başka bir tanesiyle değiştirmek için yalnızca bir satırın değiştirilmesi gerekir . JQuery durumunda, windowHTML kazıma amacıyla bir sahte nesne oluşturulabilir ve iletilebilir ( jsdom gibi bir kütüphane bunu yapabilir).

Diğerleri açıkladı undefined. undefinedherhangi bir değere yeniden tanımlanabilen global bir değişken gibidir. Bu teknik, eğer birisi bir undefined = 10yerlerde , bir yerlerde bir şey yazdıysa, tanımlanmamış tüm kontrollerin kırılmasını önlemektir . Asla iletilmeyen bir argümanın undefined, değişkenin değerine bakılmaksızın gerçek olduğu garanti edilir undefined.

Pencereyi geçme nedeni aşağıdaki örnekle gösterilebilir.

(function() {
   console.log(window);
   ...
   ...
   ...
   var window = 10;
})();

Konsol ne kaydeder? windowNesnenin değeri doğru mu? Yanlış! 10? Yanlış! Günlüğe kaydeder undefined. Javascript yorumlayıcısı (veya JIT derleyicisi) bu şekilde yeniden yazar -

(function() {
   var window; //and every other var in this function

   console.log(window);
   ...
   ...
   ...
   window = 10;

})();

Ancak, windowdeğişkeni bir argüman olarak alırsanız, var ve dolayısıyla sürpriz yoktur.

JQuery'nin bunu yapıp yapmadığını bilmiyorum, ancak windowyerel değişkeni herhangi bir nedenle işlevinizin herhangi bir yerinde yeniden tanımıyorsanız , küresel kapsamdan ödünç almak iyi bir fikirdir.

windowbirisinin IE'de pencere nesnesini yeniden tanımlamaya karar vermesi undefineddurumunda, daha sonra bir şekilde yeniden atanması durumunda , aynısını varsayıyorum .

Bu windowkomut dosyasındaki en üstte sadece "window" argümanı, global windowreferanstan daha yerel olan bir argüman ve bu kapanıştaki kodun kullanacağı isimlendiriliyor . windowSonunda aslında bu durumda, ilk argüman şu anki anlamını geçirmek için ne belirttiğini windowumut sen berbat değil ise ... windowbundan önce.

Bu eklenti, jQuery kullanılan en tipik durum göstererek düşünmek daha kolay olabilir .noConflict()bu yüzden kullanmaya devam edebilirsiniz kod çoğunluğu için, işleme $bir anlamı bile diğer daha jQuerybu kapsamı dışında:

(function($) {
  //inside here, $ == jQuery, it was passed as the first argument
})(jQuery);

1000000 yineleme ile test edilmiştir. Bu tür yerelleştirmenin performans üzerinde hiçbir etkisi olmamıştır. 1000000 yinelemede tek bir milisaniye bile değil. Bu işe yaramaz.