jQuery性能變量

Question

幾個問題，我想知道何時應該使用變量，如果選擇器將調用多次，那么我應該對那個選擇器進行變量設置？

1. 局部變量還是全局變量？ 例如

var $body = $('body');

如果我有100個jquery函數，則每個函數都需要$('body')選擇器，本地100次或全局一次變量會更快？

2. 如果像下面的功能

   $('.link').on('click', function() { var $this =$(this); $this.addClass('a'); });

函數完成，僅調用$ this一次，我需要$this嗎？ 或者只是使用$(this) ？ 哪一個更快？

3. 可變非選擇器

   $('one').addClass('a').removeClass('b').html('abcd'); $('two').addClass('a').removeClass('b').html('abcd');

如果我創建一個變量var job = addClass('a').removeClass('b').html('abcd');

`$('one').job;
$('two').job;`

會更快嗎？ 還是沒用？

4. 調整功能變量的大小，以使全高div，哪個會更快？

   $('#full-height').css({'height' : ($(window).height() + 'px')}); //without variable
var vH = $(window).height(); $('#full-height').css({'height' : vH + 'px'}); //with variable
var vH = $(window).height(); $('#full-height').height(vH + 'px'); //with variable and use height() method

以上所有函數都在$(window).on('resize', function() {} ，因此每次重新調整大小函數都將運行時，變量代碼會更快嗎？

當我需要改變非選擇器？

非常感謝

Answer 1

如果您多次使用元素，則將其保存在變量（元素的指針）中肯定會提高性能，因為就像您說的是一個查詢一樣 ，jQuery會獲取所有DOM來查找所需的元素，因此保存查詢變量的結果會更快，這是個好習慣。

因此，使用$this代替$(this)也會提高性能。

*對於問題3

您無法執行job = addClass...因為addClass 不是全局函數！ 這是一個jQuery對象方法！ 因此您只能將其與jQuery對象/元素$jqObject.addClass...

*問題4

就像我說過的，如果您在同一個函數中多次使用方法的結果，則應將其放在變量中，但在您的示例中，您將使用$(window).height(); 只有一次，因此將其放入變量中是沒有用的，但這是編寫干凈代碼的好習慣。 並且不會影響性能。

簡而言之：如果在同一個上下文中多次使用方法的結果，則將其保存在變量中將提高性能。