jQuery插件中的私有变量答案

【问题标题】：private variable in jQuery pluginjQuery插件中的私有变量
【发布时间】：2016-03-24 02:02:44
【问题描述】：

我正在制作一个 jQuery 插件，其中每个元素都应该有自己的变量。我认为正确的做法是：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<div>test 1</div>
<div>test 2</div>
<script language="javascript">
$.fn.menu = function(options) {
    var defaults = {i : 0};
    this.each(function(){
        var parameters = $.extend(defaults, options); 
        $(this).on("click", function(event){parameters.i++;alert(parameters.i);});
    });
};
$("div").menu();
</script>

但它不起作用：参数对象是全局的，因此在调用插件的所有元素之间共享。

这个例子有什么问题？

【问题讨论】：

它不是全球性的，但您正面临关闭问题...
为什么要在这里使用闭包？这不是一个循环，与您链接的已回答问题无关！此外，目标是显示 i 的最后一个值......这与闭包的含义相反。
each 是循环方法
你的观点。但是，参数是在 each() 中定义的。您能否删除“已经在其他地方回答”？问题不同，给出的答案没有回答这个问题。
@Comode 你是对的，你的问题是关于你扩展同一个对象，使用：var parameters = $.extend({}, defaults, options);

标签： javascript jquery plugins global-variables private

【解决方案1】：

使用var parameters = $.extend(defaults, options);，parameters 引用（扩展）defaults 对象。

请记住，目标对象（第一个参数）将被修改，并且也会从 $.extend() 返回。

您需要创建一个新的对象引用，将空的一个传递给 jQuery extend() 方法：

var parameters = $.extend({}, defaults, options);

这相当于：

var parameters = $.extend(JSON.parse(JSON.stringify(defaults)), options);

【讨论】：