编写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对象作为参数传递吗？

回答

相关问题