JavaScript'teki alıcılar ve ayarlayıcılar kavramı, anlamanız gereken şeylerden sadece biridir. JQuery'de güzeller çünkü API o kadar tutarlı ki bir kez aldığınızda, çeşitli yöntemler için nasıl çalışacağını hemen hemen tahmin edebilirsiniz. En temel düzeyde…
Setters yapmak bir şey.
Getters bir değer döndürür .
Genellikle tek bir yöntem her iki şekilde de kullanılabilir. Örneğin yükseklik yöntemini ele alalım.
// Used as a "setter" - will set the height $("#example").height(100); // Used as a "getter" - will return a value var theHeight = $("#example").height();Farkı gör? Ayarlayıcı , yöntem kullanıldığında bir parametre geçirir . Alıcı hiçbir şey geçmez . JQuery bu şekilde ne yapacağını bilir. Sadece bir parametre olup olmadığını test eder. Değilse, alıcı gibi davranır. Eğer oradaysa, pasör gibi davranır. GetHeight ve setHeight gibi ayrı yöntemlere sahip olmaktan ziyade, yalnızca güzel bir API kolaylığıdır.
Tek başına kullanılan bir alıcının hiçbir şey yapmadığını belirtmek gerekir.
// Useless $("#example").height();Ve bir ayarlayıcı kullanarak bir değişkenin değerini ayarlarsanız, döndürülen jQuery nesnesini alırsınız.
// x will be a jQuery object containing #example var x = $("#example").height(100);Bu kafa karıştırıcı olabilir, ancak aynı zamanda kodu kurtarmak için küçük bir numara olabilir. Bu jQuery nesnesini hem önbelleğe almanız hem de yüksekliğini ayarlamanız gerektiğini biliyorsanız, bunu tek bir kod satırında da yapabilirsiniz.
CodePen'de Chris Coyier (@chriscoyier) tarafından hazırlanan Pen 8ff68485673396d452f650bfb437fb2a'yı görün
Ayrıca makalede bahsedilmektedir box-sizing: border-box;. Kutu boyutlandırma süper kullanışlı bir CSS özelliğidir. Bunu tüm unsurlara koymanın büyük bir savunucusuyum, örneğin:
* ( box-sizing: border-box; )Videoda belirtildiği gibi, bu aynı zamanda height()jQuery'yi biraz daha öngörülebilir ve tutarlı kılar . Kenarlık kutusu kümesi olmadan height(), CSS'deki yükseklik özelliğine veya öğenin doğal olarak yüksekliği ne olursa olsun, dolgu ve kenarlık eksiğine eşittir. İle border-boxseti, height()eleman dolgu ve sınırın dahil ekranında, yukarı alır tam olarak ne kadar yüksekliğidir. border-boxAyar yapmadan , bunu elde etmek için outerHeight()jQuery'de kullanmanız gerekir .