JavaScript -- this

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

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

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

为什么会出现这种结果？

答：

对象里面函数的存储是这样的：

 

obj 存的是 对象的地址：

对象里面 存的是 key 值，和 value  writable 等属性，并且 value 里面保存的是函数的地址，

函数存储在对象内存之外的地址。

当进行 var foo = obj.foo；操作时 ，是将函数地址给了foo。这样就可以使用这个函数了

可见函数和对象是相互独立的，只是对象调用了这个函数。

 

JavaScript 允许在函数体内部，引用当前环境的其他变量。

现在问题就来了，由于函数可以在不同的运行环境执行，所以需要有一种机制，能够在函数体内部获得当前的运行环境（context）。所以，this就出现了，它的设计目的就是在函数体内部，指代函数当前的运行环境。

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

var x = 1;
var obj = {
  f: f,
  x: 2,
};

// 单独执行
f() // 1

// obj 环境执行
obj.f() // 2

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

 

上图红框为全局的运行环境；（）

下图红框为对象的运行环境（）；