javascript - Javascript 中的 init 函数和对象

Question

我有以下(简化的)代码:

var Foo = (function () {
    var data = {},
        settings = {
            // default settings here
        };

    function bar(callback) { // bar is an asynchronous function
        var result = null;
        // fiddle around until you get a result
        if (callback) {
            callback(result);
        }
    }

    return {
        init: function (options, callback) {
            var kallback = callback;
            $.extend(settings, options);
            bar(function () {
                if (kallback) {
                    kallback(WHAT_GOES_HERE);
                }
            });
        },
        debug: function () {
            return {
                settings: settings,
                data: data
            };
        },
        set: function (k, v) {
            settings[k] = v;
        },
        get: function (k) {
            return settings[k];
        }
    };
}());

上面的代码位于 js 文件中，然后位于相关页面的页脚中:

<script type="text/javascript">
    Foo.init({ option1: "value", option2: "value" }, function (obj) {
        console.log("The object was ", obj);
    });
</script>

基本上，这就是我想要做的事情:

1. 创建一个对象(带有一组可选参数，但对于这个问题并不重要)
2. 在对象的创建阶段，让它调用异步函数
3. 当异步函数完成后，我应该能够触发回调，并且回调的参数应该是初始化的对象

我认为this适用于上面的WHAT_GOES_HERE，但事实证明，至少当我测试它时，this是DOM 窗口对象。

首先，我是否正确构建了这个对象？或者有更好的方法来创建它吗？

其次，假设我这样做是正确的，那么 WHAT_GOES_HERE 中应该包含什么内容，以便当 console.log("The object was ", foo); 运行时， obj 的值是创建的 Foo 对象？

Answer 1

是的，在以这种方式调用的匿名函数中，this将引用窗口对象。要从 init 方法引用 this 引用，您必须将该引用存储在另一个变量中:

var kallback = callback, self = this;
$.extend(settings, options);
bar(function () {
    if (kallback) {
        kallback(self);
    }
});

只要您只想拥有一个 foo 对象，您构建对象的方式就有效。