2011-08-18 39 views
8

Jquery in Action adlı kitabına sahibim ve bu üç işlevi, diğer kitaplıklar ile çakışmayı kaldırma hakkında konuşurken bahseder. Ancak, aralarındaki farkın ne olduğunu bilmiyorum ve kitabın açıklamasını anlamıyorum.Bu işlevler arasındaki fark nedir?

jQuery(function($) { 
    alert('I"m ready!'); 
}); 

var $ = 'Hi!'; 
jQuery(function() { 
    alert('$ = ' + $); 
}); 

var $ = 'Hi!'; 
jQuery(function($) { 
    alert('$ = ' + $); 
}); 

Farkın ne olduğunu bilen var mı? Teşekkürler.

cevap

2

Basitleştirilmiş bir sürüm alırsanız daha anlaşılır olabilir. İlk hazır fonksiyon uyarıdan çok fazla şey yapmıyor. Diğer ikisi ilginç.

İşlevlerin kapsamı vardır; bu, bir değişkeni içte kullandığınızda, hiyerarşide bulunana kadar gider.

İkinci hazır işlevinizde, , Hi! numaralı telefona kadar çıkacak ve işlev içinde çalışmaya başlarsanız, başka bir $ olacaktır. Bir değişken (function($) {) olarak geçirilir - bir daha yakın olan bir tanıma sahiptir, çünkü

Ancak, üçüncü hazır bloğunda $Hi! gitmeyecek. Bu $, jQuery'nin hazır özelliği nasıl uygulandığından jQuery işlevi (yani $ == jQuery numaralı işlevde) olacaktır.

Yani:

var $ = 'Hi!'; 

jQuery(function() { 
    alert('$ = ' + $); // in this scope, $ will refer to the 'Hi!' 
}); 

jQuery(function($) { // the $ here will 'shadow' the $ defined as 'Hi!' 
    alert('$ = ' + $); // in this scope, $ will refer to jQuery 
}); 

Şimdi soru diğer kütüphaneler ile çatışma hakkındadır. Diğer kütüphaneler (örneğin prototip) ayrıca kütüphaneyi çağırmanın uygun bir kısayolu olduğu için $ sembolünü kullanır. Sağladığınız son hazır fonksiyonunu kullanırsanız, emin olabilirsiniz, bu fonksiyonun içinde $ jQuery, jQuery kendisini bu işleve (ilk argüman olarak) aktardığı için başvuracaktır.

İkinci hazır işlevde, $ da örneğin Prototip olarak ayarlanmış olabilir ve jQuery'yi $ ile aradığınızdan emin değilsiniz. Örneğinizde, Hi! ve jQuery değil. Prototip olması durumunda aynı şeydir. Düşünün: Öte yandan

// Prototype is loaded here, $ is referring to Prototype 

jQuery(function() { 
    $('selector').addClass('something'); // Oops - you're calling Prototype with $! 
}); 

:

// Prototype is loaded here, $ is referring to Prototype 

jQuery(function($) { // this $ is shadowing Prototype's $, this $ is jQuery 
    $('selector').addClass('something'); // Yay - you're calling jQuery with $ 
}); 
1

Eğer $ basitçe jQuery nesnesine bir diğer adıdır jQuery(function ($) { ... yazarken. Aslında $ yerine herhangi bir yasal tanımlayıcı kullanabilirdiniz ve bu hala jQuery nesnesinin bir takma adı olur.

İkinci örnekte, uyarı '$ = Merhaba!' çünkü bu durumda $, işlevin hemen üstünde bildirilen varlığa işaret ediyor.

Üçüncü örnek, $ $ işlevinin içinde jQuery nesnesine çözüleceğinden, işlev üzerinde bildirilen $ değeri etkin bir şekilde maskeler.

Umarım bu sizin için mantıklıdır.

+0

@ Beefyhalo - Eğer '$', jQuery() 'işleyicisi içinde zaten varsa özel bir anlam kazanıyor mu? Yani, argüman 'jQuery (function (argüman) {...}) içinden geçmiş mi? (Hala) etkin bir şekilde" $ "ile aynı şeyi çözüyor mu? – dopatraman

+2

jQuery kendini jQuery işleyicisindeki ilk bağımsız değişkene atar. İlk argümanın adı ne olursa olsun, jQuery buna atanacaktır. Yani jQuery (function (argüman) {... ',' jQuery (function ($) {... 've' jQuery (function (someOtherArgument) {... ', hepsi anlamındadır. argüman === $ === someOtherArgument' – beefyhalo

+0

@ Beefyhalo - teşekkürler, bu açık şeyler yardımcı oldu – dopatraman

1

İlk kod bloğu, DOM tamamen yüklendikten sonra yürütülen hazır işleyiciyi bildirir. Sadece bir uyarı kutusu üretir.

jQuery(function($) { 
    alert('I"m ready!'); 
}); 

İkinci kod bloğu da hazır bir işleyiciyi bildirir, ancak bir çakışma olduğunu gösterir. $ değişkeni kasten bir dizeye ayarlanmıştır (bu, çakışan bir js kütüphanesinden oluşabilir) ve bu nedenle jQuery nesnesi olarak kullanılamaz. İşleyici işlevi kapsamında dize $ atanır ve uyarı $ = Hi! görüntüler.

var $ = 'Hi!'; 
jQuery(function() { 
    alert('$ = ' + $); 
}); 

üçüncü kod bloğu da hazır işleyicisi bildiriyor, ancak yerel bir $ parametreyi beyan eder. JQuery nesnesi ilk parametre olarak hazır işleyiciye geçer ve bu nedenle işlev kapsamı içinde, $ jQuery nesnesine başvurur ve uyarı , ... jQuery nesnesinin bir temsilidir.

var $ = 'Hi!'; 
jQuery(function($) { 
    alert('$ = ' + $); 
});