javascript - MDN的JavaScript`this`示例和书籍无法正常工作...为什么？

我试图理解JS this，因为它对我来说太混乱了太长时间了，到目前为止，没有人给我一种我可以理解的解释。我去了MDN并尝试了他们文档中的简单代码示例。从他们的页面直接复制的代码如下（控制台日志是我唯一的补充）：

var obj = {a: 'Custom'}
var a = 'Global'
function whatsThis () {
    return this.a
}

console.log(whatsThis())
console.log(whatsThis.call(obj))
console.log(whatsThis.apply(obj))

根据MDN，输出应为：

Global
Custom
Custom

相反，我得到

undefined
Custom
Custom

令人难以置信的是，我尝试了一些著名的You Don't Know JS系列书的一个例子，该系列书的第2章第2章关于this。我逐字尝试了以下示例：

function foo() {
    console.log( this.a );
}

var a = 2;

foo();

这本书说输出应该是2，但是我得到了undefined。

这就是为什么我想了解更多有关this的原因，但是即使书籍和MDN直的代码示例对我来说也失败了，这使我很难集中精神围绕JS的核心概念。请帮我把这个问题弄清楚。

最佳答案

在Node.js模块中用var声明的变量不会以全局对象结尾-模块具有自己的作用域。您可以将要读取的属性明确地放在全局对象上：

global.a = 'Global';

global.a = 2;

（在浏览器中，它是window而不是global，或者您可以同时使用new便携式globalThis。）

但是，您无需太担心这种行为。在应始终使用的strict mode中（它将自动应用于类和ES模块等新功能中），像this这样的普通函数调用的whatsThis()就是undefined。

'use strict';

function whatsThis() {
  console.log('this is ' + this);
}

let obj = {
  whatsThis,
};

whatsThis();
whatsThis.call('a string');
obj.whatsThis();

实际上，绝对不应该使用Node中的全局对象，并且在浏览器脚本的顶级使用var声明变量同样是一种不好的做法。