編寫JavaScript函數 - 我應該將jQuery對象作爲參數傳遞嗎？

我對錶現和「最佳實踐」的立場感到好奇。我在JavaScript中使用了很多jQuery，並且經常發現自己將jQuery對象作爲參數傳遞到我正在編寫的函數中。傳遞選擇器字符串而不是實際的jQuery對象作爲參數會更有效率嗎？這只是一種風格上的差異，還是有什麼好的理由使用一種方法而不是另一種？編寫JavaScript函數 - 我應該將jQuery對象作爲參數傳遞嗎？

使用jQuery對象參數：

function updateSelectOptions(optionsData, $selectElement) { 

    // function code 

}

或者使用選擇的字符串作爲參數：

function updateSelectOptions(optionsData, selectorString) { 

    var $selectElement = $(selectorString); 
    // function code 

}

來源

2014-12-03 Josh KG

據我所知，jQuery並沒有對選擇器結果進行緩存，所以我建議不要這樣做。它也不提供靈活性，允許您傳遞未添加到DOM的元素。 – 2014-12-03 00:25:13

JavaScript通過引用傳遞對象（不是真的，通過共享調用，但足夠接近）。傳遞引用意味着我不必重新輸入jquery來定位元素並構建一個對象，就像您在傳遞選擇器時所做的那樣。第一個會更快。 – 2014-12-03 00:37:53

第二種方法除去對對象的任何參考後的功能完成時執行。第一個允許您保持對該對象的引用，以便在該函數的範圍之外對其進行操作。

來源

2014-12-03 00:26:19 Verhaeren

您應該接受任何jQuery構造函數可以提供最大的靈活性。

重新包裝一個jQuery集合不炸燬，所以我經常使用類似...

var fn = function(elems) { 
    var $elems = $(elems); 
};

這樣的話，你能接受一個jQuery集合，選擇字符串或引用本地DOM元素（S）。

來源

2014-12-03 00:26:44 alex

靈活性的好處！ – 2014-12-03 00:32:13

雖然最大限度地提高了靈活性，但如果將jQuery對象傳遞給此函數，它看起來會實際創建一個克隆：http://api.jquery.com/jquery/#cloning-jquery-objects（導致性能下降） – 2014-12-03 00:57:23

@JoshKG也許，但如果你發現它是你的應用程序的瓶頸，我會很驚訝。 – alex 2014-12-03 01:51:40

在我看來，傳遞對象很好，對性能會更好。

爲什麼？

大多數情況下，使用函數的原因是重用代碼。因此，如果你把這個字符串（選擇），如updateSelectOptions(optionsData, selectorString) 調用函數，然後使用該字符串每次選擇元素：

var $selectElement = $(selectorString);

這將消耗更多的內存，因爲該元素將不得不被搜索每一個函數調用。

如果您通過緩存對象此元素將僅被選中並僅搜索一次。

來源

2014-12-03 00:33:37

如果您發現自己希望編寫一個將jQuery對象作爲參數的函數，那麼爲什麼不只是讓您的函數成爲jQuery插件呢？這很容易，它使得該函數適用於其餘的jQuery代碼。取而代之的

function something(jq) { 
    jq.css("color", "red"); 
});

你會寫

$.fn.something = function something() { 
    this.each(function() { 
    $(this).css("color", "red"); 
    }); 
    return this; 
};

現在，當你想打開紅色的東西，你就可以說

$(".whatever").something();

的this的價值jQuery插件是沿鏈傳遞的jQuery對象。您不必用$(this)包裝它。除非你的函數是返回一些值的東西，否則返回傳入的東西是很好的，這樣你就可以在虛線鏈中使用你自己的插件。

來源

2014-12-03 00:57:59 Pointy

編寫JavaScript函數 - 我應該將jQuery對象作爲參數傳遞嗎？

回答

相關問題