JavaScript中this关键字原理

原创于 2018-12-06 11:18:30 发布 · 423 阅读

CC 4.0 BY-SA版权

文章标签：

6 篇文章

订阅专栏

本文通过一个具体示例，深入解析JavaScript中this关键字的工作原理。解释了函数内部this的指向取决于函数执行的上下文环境，而非定义时的位置。当在全局环境执行时，this指向全局对象；而在对象方法中执行时，this指向该对象。

先来看一个例子：

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

var foo = obj.foo;
var bar = 2;

obj.foo() // 1
foo() // 2

造成这种差异的原因就是函数体内部使用了this关键字，需要明确的是代码中this指的是函数运行时所在的环境。

为啥会是这样呢？下面将详细剖析。

JS会将函数单独保存在内存中，JavaScript 还允许在函数体内部，引用当前环境的其他变量。

因此，上面代码函数f在全局环境执行，this.x指向全局环境的x。在obj环境执行，this.x指向obj.x。