这个内部函数

Question

我的问题是：

function Foo()
{
   this.foo = "bar"; // <- What is "this" here?
}

据我所知，这取决于Foo 的使用方式，即作为构造函数还是函数。 this在不同的情况下可以是什么？

Answer 1

this 关键字是指函数所属的对象，如果函数不属于任何对象，则为 window 对象。

用在OOP代码中，指函数所属的类/对象 例如：

function foo() {
    this.value = 'Hello, world';

    this.bar = function() {
        alert(this.value);
    }
}

var inst = new foo();
inst.bar();

此提醒：Hello, world

您可以使用apply() 或call() 函数来操作this 引用的对象。 （有时非常方便的功能）

var bar1 = new function() {
    this.value = '#1';
}
var bar2 = new function() {
    this.value = '#2';
}

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

foo.call(bar1); // Output: #1
foo.apply(bar2, []); // Output: #2

Answer 2

阅读 Douglas Crockford 对此事的看法，引用 A Survey of the JavaScript Programming Language 的内容：

函数是一个对象。它可以像其他对象一样包含成员。这允许一个函数包含它自己的数据表。它还允许一个对象充当一个类，包含一个构造函数和一组相关的方法。

函数可以是对象的成员。当函数是对象的成员时，它被称为方法。有一个特殊的变量，叫做 this，当对象的方法被调用时，它被设置为对象。

例如，在表达式 foo.bar() 中，this 变量被设置为对象 foo，作为函数 bar 的一种额外参数。然后功能栏可以引用 this 来访问感兴趣的对象。

在像 do.re.mi.fa() 这样的更深层次的表达式中，this 变量被设置为对象 do.re.mi，而不是对象 do。在一个简单的函数调用中，这被设置为全局对象（又名窗口），这不是很有用。正确的行为应该是保留 this 的当前值，尤其是在调用内部函数时。

此外，“this”可能会根据您的函数的调用方式而改变，请阅读 apply function 和 call function。

我建议您花时间在他的（免费）演示文稿中学习 JavaScript 最伟大的思想之一，链接自 here。

Answer 3

在 JavaScript 中，约定（这只是约定）是任何以大写字母开头的函数都将用作构造函数。然后，一个人会打电话

var foo = new Foo() 和 this 将引用即将被 foo 引用的新创建的对象。

当然，没有什么能阻止您单独调用Foo()，在这种情况下，this 将引用调用函数的对象。为避免混淆，不建议这样做。

Answer 4

这取决于该函数的使用方式，我们可以使用两种基本类型的函数

1. 功能
2. 作为对象的函数，使用 new 关键字

会一一看到

1.功能

var example = function () {
  console.log(this);
};

example();

Output : window

这里的'this'关键字指向窗口对象。

默认情况下，这应该始终是 window 对象，它指的是根 - 全局范围。所以当我们 console.log(this);从我们的函数中，因为它是由窗口调用的（只是刚刚调用），我们应该期望 this 值是我们的窗口对象：

2.作为对象的函数

var example = function () {
  console.log(this);
};

var obj = new example();

Output : example {}

这里的 'this' 关键字指向新创建的示例对象。

Answer 5

在 JavaScript 中，一切都是对象，甚至是函数。当你在下面的代码中说this.foo时

function Foo()
{
   this.foo = "bar"; // <- What is "this" here?
}

foo 成为Foo 对象的成员变量

Answer 6

在 NodeJS 中有一些有趣的行为：

function foo() {
    this.name = 'bar' // <- What is "this" here?
}

foo() // <- TypeError: Cannot set property 'name' of undefined

但是使用箭头函数：

const bar = () => {
    this.name = 'foo'
    console.log(this)
}

bar() // <- { name: 'foo' }

我一直觉得传统的函数字面量有自己的上下文，但没有箭头函数，这似乎与我的理解相矛盾。

鉴于这种行为，OP 的代码将无法正常工作...