这里的 'this' 引用是什么？

Question

我正在阅读 this chapter in You don't know JS。

function baz() {
    // call-stack is: `baz`
    // so, our call-site is in the global scope
    console.log("baz");
    bar(); // <-- call-site for `bar`
}


function bar() {
    // call-stack is: `baz` -> `bar`
    // so, our call-site is in `baz`
    console.log("bar");
    foo(); // <-- call-site for `foo`
}

function foo() {
    // call-stack is: `baz` -> `bar` -> `foo`
    // so, our call-site is in `bar`
    console.log("foo");
    console.log(this);
}

baz(); // <-- call-site for `baz`

我期待函数 foo 中的 console.log(this) 打印 bar，因为 bar 是调用站点，但它似乎是 window.

函数 foo 中的 this 引用 window 而不是 bar 是怎么回事？

Answer 1

'this' 指的是调用函数的对象，而不是调用函数。您运行此代码来自浏览器（即来自网页）吗？如果是的话，那么'this'就是代码在运行中的window。

Answer 2

正如 Kyle Simpson 精彩解释的那样，this 的值仅取决于调用站点的 4 个条件：

var obj = {
  foo: function() {
    console.log(this);
  }
};

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

1.使用对象调用（隐式绑定）

obj.foo();

在这种情况下，使用 obj 调用 foo（始终注意点运算符之前的对象）。因此 this 在 foo.

中引用 obj

2。 'call' 或 'apply'（显式绑定）

foo.call(obj);

这里，函数foo中的this指的是obj，因为它已经被显式绑定了。

3。使用新的（新关键字）调用

obj = new foo();

在 foo 内部，this 现在引用新创建的对象。

4。全局对象（默认绑定）

foo();

这里直接调用了foo。因此它默认为 window。（这就是你的情况！）

如您所见，在您的例子中，foo 被直接调用（案例 4）。因此 this 指的是 window 对象。只要记住这4个案例，你就可以了！

Answer 3

确实 'bar' 是调用站点，但您必须查看 4 rules 中的哪一个适用于调用站点。在这种情况下，没有 new 绑定。类似地，我们没有看到硬绑定、显式绑定或隐式绑定，因为 foo() 未作为 obj.foo() 执行。因此，这是默认绑定的明显情况，因此 this 指向全局对象，即 window

这里的 'this' 引用是什么？

What is the 'this' reference here?

javascript

this