javascript - 为什么在对象内部调用函数需要 "this"

Question

var a = {
    text : 3,
    logText : function () {
        console.log(this.text);
    },
    callLogText : function() {
        logText();
    }
};
a.callLogText();

这将生成一个 ReferenceError: logText is not defined 错误消息。

相反，您在 logText() 方法前加上 this 前缀，就可以了。不会弹出错误消息。

var a = {
    text : 3,
    logText : function () {
        console.log(this.text);
    },
    callLogText : function() {
        this.logText();
    }
};

我实在想不通。

Answer 1

您需要学习 JavaScript 范围规则。 This blog post gives a good introduction .

简而言之，当您使用变量名时，JavaScript 遵循一些规则(出于本解释的目的，函数定义非常类似于变量声明)。

可能让您感到困惑的是:

var a = { b: ...};
var a = function() { var b = ... }

在这两种情况下，您都会得到一个新变量a。在第一种情况下，它是一个具有属性 b 的对象。在第二种情况下，它是一个具有嵌套作用域 的函数，其中定义了一个新变量 b。

JavaScript 将在当前和所有父作用域中查找变量。但是对象定义不是作用域。就 JavaScript 而言，属性 b 是不可见的，除非您使用始终引用“当前”对象的特殊变量 this 使其可见(在您的示例中，那是 a).

由于对象 a 的属性不在“范围内”，JavaScript 无法找到 logText() 除非您告诉它在 this 中查找。如果你什么都不说，JavaScript 会先查看当前作用域(函数 callLogText 的主体)，然后是父作用域(定义了 a)，然后然后在它的任何父范围内。