Question

可能重复：
  Javascript closure inside loops - simple practical example
  Javascript infamous Loop problem?

我有一个基本功能，我想控制最终像“bumpbox”的东西。我的目标是实例化这个的多个实例，并为每个声明的变量提供一个自定义配置。

该对象如下所示：

Project.Modules.bumpbox = function(in_trigger, container) {

    var config = {

        'speed': 500,
        'easing' : false,//will 
        'in_callback': false,
        'out_callback' : false,
        'visible': false,
        'out_trigger' : $('#bumpbox_out_trigger'),//this is set by default only change if you know what you are doing!
    };

    this.test = function() {

        //this should be the default function. 

    };

然后，从另一个文件，我想实例化一个像New Project.Modules.Bumpbox（）的实例并覆盖测试函数。

var bumpbox_controllers = {

            "map" : new Project.Modules.bumpbox($('#navigation_top li.map'), $('.bumpbox.map')),
            "contact" : new Project.Modules.bumpbox($('#navigation_top li.contact'), $('.bumpbox.contact')),
            "about" : new Project.Modules.bumpbox($('#navigation_left li.about'), $('.bumpbox.about')),
            "team" : new Project.Modules.bumpbox($('#navigation_left li.team'), $('.bumpbox.team')),
            "careers" : new Project.Modules.bumpbox($('#navigation_left li.careers'), $('.bumpbox.careers')),
            "services" : new Project.Modules.bumpbox($('#navigation_left li.services'), $('.bumpbox.services'))
        };

然后我想遍历每一个并在每个中设置一个自定义test（）函数：

    bumpbox_controllers[i]['test'] = function() {

        alert(i);
    }

但是当我运行这段代码时，它会将所有元素切换到最后一个被调用的值，在本例中为“service”，而不是给每个元素一个唯一元素。

Answer 1

您的循环似乎需要closure：

for (var controller in bumpbox_controllers) {
    bumpbox_controllers[controller] = (function(i) {
        // creating a new context for i
        return function() {
            alert(i); // access the i in scope, not the controller
        }
    })(controller);
}

Answer 2

要允许每个test()拥有自己唯一的i，请尝试：

bumpbox_controllers[i]['test'] = (function (i) {
    return function () {
        alert(i);
    };
}(i));

Javascript对象自定义函数

2 个答案: