Node.js和浏览器中'this'的不同处理方式

Question

我在本地安装了Node.js v8.10.0。我写了一个简单的脚本来玩"这个"：

var x = 1;
var fn = function (a) {
var x = a;
console.log(`local x = ${x}`);
console.log(`global x = ${this.x}`);
}
fn(10);

当我通过Node.js执行脚本时，我得到以下结果：

local x = 10
global x = undefined

当我在Chrome中执行脚本时，我得到以下结果：

local x = 10
global x = 1

你能解释一下Node.js为什么在全局范围内看不到x吗？

Answer 1

你能解释一下为什么Node.js在全局范围内看不到x吗？

如果您在Node控制台中运行它，它会。如果将其作为文件在中运行，则x在文件的作用域中，而不是全局作用域。

顺便说一句，在Node中，可以使用global显式查看全局范围，就像在浏览器中使用window一样。因此，

console.log(global == this)

将根据您是在文件中还是在控制台中运行它，给出两个不同的答案。

此外，请尝试迁移到let和const。这是特别令人困惑的，因为var在全局范围和其他地方的行为不同。在控制台和浏览器中，外部var x位于全局范围内，因此它定义了一个全局变量(window.x和global.x(。在Node文件中，var x不在全局作用域中，因此它执行不在全局范围中时的正常操作：定义局部变量x(不是this.x，不是global.x，只有x(。因此，您有两个局部变量，内部变量遮蔽外部变量，这使得外部变量不可访问。同时，this.x从未被定义。

Answer 2

在chrome中，this是Window的对象，就像执行this.constructor.name一样，您将获得Window作为构造函数名称，因此在访问this.x时，它将查找全局变量x，而不引用函数范围。

var x = 1;
var fn = function (a) {
var x = a;
console.log(`local x = ${x}`);
console.log('Constructor ', this.constructor.name);
console.log(`global x = ${this.x}`);
}
fn(10);

然而，在NodeJS中，this将始终引用函数原型(而不是全局范围(。因此，您没有任何值x与函数的prototype相关联，因此它会给您undefined。