javascript的this关键字原理

一、this指的是函数运行时所在的环境。对于obj.foo()来说，foo运行在obj环境，所以this指向obj；对于foo()来说，foo运行在全局环境，所以this指向全局环境。所以，两者的运行结果不一样。

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

为什么会这样？函数的运行环境到底是怎么决定的？举例来说，为什么obj.foo()就是在obj环境执行，而一旦var foo = obj.foo，foo()就变成在全局环境执行？

二、函数
我们已经知道，对象声明时所获得的是引用地址，但当属性的值可能是一个函数时，又该如何？

var obj = { foo: function () {} };

注意：当属性的值是一个函数时，引擎会将函数单独保存在内存中，然后再将函数的地址赋值给foo属性的value属性。如下图：

由于函数是一个单独的值，所以它可以在不同的环境（上下文）执行。

var f = function () {};
var obj = { f: f };

// 单独执行
f()

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

三，实例

var f = function () {
  console.log(this.x);
}
var x = 1;
var obj = {
  f: f,
  x: 2,
};
// 单独执行
f() // 1
// obj 环境执行
obj.f() // 2

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

3.2 在obj环境执行，this.x指向obj.x。

总结：，obj.foo()是通过obj找到foo，所以就是在obj环境执行。一旦var foo = obj.foo，变量foo就直接指向函数本身，所以foo()就变成在全局环境执行。