javascript - Javascript 'this' 与对象名称

Question

this一个由好奇心引发的问题，如果我有以下代码，那么通过而不是user在方法中调用属性有什么好处（不仅仅是简单性）show_name？

var user = {

    name : 'John Doe',

    show_name : function(){

        alert(this.name);

        // OR

        alert(user.name);
    }
};

Answer 1

如果你看一下这个例子，区别就很明显了。它创建第二个对象并相应地设置原型。

var user = {

    name : 'John Doe',

    show_name : function(){

        alert(this.name);

        // OR

        alert(user.name);
    }
};

user2 = Object.create( user );
user2.name = "someone else";

user2.show_name();

这里this.name指的是当前对象的name属性，而user.name总是指原始name属性。

Answer 2

通过使用this，您可以确保在更改变量名称后，例如 fromuser到something您的代码仍然有效。

除此之外，我想（在某些浏览器上）可能还会有一些性能提升，因为user.name浏览器必须在您的函数之外的上下文中查找，同时使用this.name当前上下文。

---

示例代码

var user = {
    name : 'John Doe',
    show_name : function(){
        alert(user.name);
    }
};

var something = user; // Passing the object to another variable
user = null;          // Make the user variable point to something else

something.show_name();

如果您运行上面的代码，您将在以下行中遇到错误：

alert(user.name); // <-- user is null, so this will produce the following Error:

未捕获的类型错误：无法读取 null 的属性“名称”

现在，如果我们切换到this而不是user，我们的代码将起作用：

var user = {
    name : 'John Doe',
    show_name : function(){
        alert(this.name);
    }
};

var something = user; // Passing the object to another variable
user = null;          // Make the user variable point to something else

something.show_name();

上面的代码将起作用，因为this它将指向执行该show_name函数的对象（这可以在 . 点方法符号的左侧找到，它是 指向的对象something）。

---

参考：

要了解有关执行上下文（在我们的示例中为对象）如何影响 this 绑定的更多信息，请阅读Kyle Simpson的精彩书籍You Don't Know JS的这段摘录。

以下章节详细解释了this在各种情况下的行为方式（但整个系列都值得一读！）：

第一章：这个还是那个？

第 2 章：这一切现在都说得通了！

Answer 3

您可以在多个地方使用相同的功能，并使其具有上下文相关性。

function foo() {
  alert(this.name);
}

var a = { alert: foo, name: "A" };
var b = { alert: foo, name: "B" };
a.alert();
b.alert();

Answer 4

是使用this还是函数名取决于函数的调用方式。

函数的this值由函数的调用方式或bind设置，所以如果函数总是作为合适对象的方法调用，请使用this. 但是，如果它可以以任何其他方式调用，或者this应该只引用特定对象，请使用bind或对象名称。

例如，给定 OP 示例，请考虑：

var x = user.showName;
x();

在上面，showName在没有设置它的情况下调用它this，所以它默认为全局对象，并且this.name在函数内可能不会是预期的。

鉴于文本编辑器中相当强大的搜索和替换功能的可用性，更改函数名称并不是一个特别繁重的问题。

顺便说一句，这个问题经常被问到。没有“正确”的答案，只有在某些情况下如何做出选择的建议。

Answer 5

如果要制作对象的多个副本，则需要this引用当前对象。使用名称将引用默认对象，而不是您正在使用的副本。

Answer 6

this这里指定对象是当前名称空间的一部分，并且可以在对象内部访问..假设您的对象名称从 更改user为newUser将没有任何依赖关系并消除任何耦合问题..

Answer 7

如果使用 jQuerythis引用 jQuery 对象。所以，我的选择是根本不使用this。

var user = {

name : 'John Doe',

alertName : function(){

    //  alert(this.name); //never

     alert(user.name);
  }
};
showName : function(){
    $('#show').click(function(){
        //this here references jQuery object 
        $('#username').val(user.name);
    });

};

此外，对象字面量通常不应该用于创建多个对象，因此，使用this内部对象字面量与使用对象变量名相比没有任何好处。