Javascript：自己键的函数中的对象文字引用而不是“this”答案

【问题标题】：Javascript: Object Literal reference in own key's function instead of 'this'Javascript：自己键的函数中的对象文字引用而不是“this”
【发布时间】：2012-05-29 11:27:14
【问题描述】：

在一个函数中引用一个对象文字是否有问题，该函数是该文字的一部分？它似乎工作得很好，但我想确保没有其他影响。

下面是我所说的一个例子：

代替：

var obj = {
    key1: "it",
    key2: function(){return this.key1 + " works!"}
};
alert(obj.key2());

使用：

var obj = {
    key1: "it",
    key2: function(){return obj.key1 + " works!"}
};
alert(obj.key2());

【问题讨论】：

标签： javascript object

【解决方案1】：

两者都可能有问题。

var obj = {
    key1: "it",
    key2: function(){ return this.key1 + " works!" }
};
var func = obj.key2;
alert(func()); // error

当func 不作为obj 的方法调用时，this 可以引用其他内容（此处：全局对象“window”）。

var obj = {
    key1: "it",
    key2: function(){ return obj.key1 + " works!" }
};
var newref = obj;
obj = { key1: "something else"; };
alert(newref.key2()); // "something else works"

在这里，我们从另一个引用访问对象，尽管函数中的 obj 现在可能指向其他对象。

因此，您将不得不选择哪种情况更有可能。如果你真的想让它安全，请防止obj被交换：

// ES6 - use `const`:
const obj = {
    key1: "it",
    key2: function(){ return obj.key1 + " works always!" }
};

// ES5: use a closure where the `obj` is stored in a local-scoped variable:
var obj = (function(){
    var local = {
        key1: "it",
        key2: function(){ return local.key1 + " works always!" }
    };
    return local;
})();

或者你bind()对象的函数：

var obj = {
    key1: "it",
    key2: function(){ return this.key1 + " works always!" }
}
obj.key2 = obj.key2.bind(obj);

【讨论】：

【解决方案2】：

视情况而定，可能会应用这两种技术中的一种或两种。

函数中this 的值取决于函数的调用方式。如果你像这样调用一个函数作为对象的属性：

obj.key2();
//or
obj["key2"]();

那么this 就是那个对象。对象是通过对象字面量还是其他方式创建的并不相关。

但您可以使用.call() 或.apply() 调用函数并将this 显式设置为其他对象。

同时考虑：

var obj = {
    key1: "it",
    key2: function(){return this.key1 + " works!"}
};
alert(obj.key2()); // alerts "it works!"

var func = obj.key2;
alert(func());     // alerts "undefined works!"

我正在设置 func 以引用与 obj.key2 相同的函数，但将其称为 func() 确实不将 this 设置为 obj。

欲了解更多信息，请查看what MDN has to say about this。

【讨论】：

【解决方案3】：

如果你不使用原型对象，你可以这样。因为您的对象的所有实例都将返回 obj 实例的值...

【讨论】：

【解决方案4】：

变量范围绑定会有所不同。如果后面修改obj，会修改key2的返回值：

var newobj = obj;
obj = { key1: "new" };
alert(newobj.key2());

现在它会提示“新作品！”，因为即使您在原始对象（现在是 newobj）上调用 key2()，对 obj.key1 的引用现在也会绑定到新 @987654326 的值@ 实例。使用this 可以防止这种情况发生。

演示：http://jsfiddle.net/m6CU3/

【讨论】：

【解决方案5】：

我不认为有任何影响。只要确保您在任何时候都不会意外这样做：

var obj = {
    key1: "it",
    key2: key1 + " works!"
}

因为这会导致错误。除此之外，你应该很高兴！

【讨论】：