1. 全局代码中的this

this在全局上下文中，它的值是全局对象本身（Global Object），在浏览器中就是Window Object，如下图示。

看下面几个例子：

//Global scope
//The implicit property of the global object
var foo1 = "abc";
console.log(this.foo1 == window.foo1); console.log(foo1); console.log(this.foo1); console.log(window.foo1);  //true abc abc abc

//The implicit property of the global object
foo2 = "def";
console.log(this.foo2 == window.foo2); console.log(foo2); console.log(this.foo2); console.log(window.foo2);      //true def def def

//The explicit property of the global object
this.foo3 = "gh";
console.log(this.foo3 == window.foo3); console.log(foo3); console.log(this.foo3); console.log(window.foo3); //true gh gh gh

2. 函数代码中的this

共有四种函数调用方式：

1）方法调用模式：作为对象属性调用，obj.func()；（详见8.对象中的this）

2）函数调用模式：指向全局，直接调用func()；（详见1.全局代码中this）

3）构造器调用模式：使用new调用；（详见6.作为构造器调用的函数中的this）

4）call/apply调用模式：动态改变this指向。（详见7.手动设置函数调用时this的值）

函数代码中this值的第一个特性，同时也是最主要的特性，即：它并非静态地绑定在函数上。

this的值是在进入执行上下文（Context Excution）的阶段确定的，在函数代码中，其值每次都不尽相同。然而进入执行代码阶段，其值就不能改变。

如果想给this赋一个新值是不可能的，因为在那时this根本就不是变量了。

结合例子来分析：

通过上述结果分析可知：调用bar对象的sayName方法时，this指向bar对象。通过赋值方式使得foo的sayName方法指向bar的sayName方法，再调用foo对象的sayName方法时，this指向foo对象。Why?

this的值在函数中是非静态的，它的值确定是在执行代码阶段（函数调用时，具体代码执行前）。this的值是由激活上下文代码的调用者提供的，比如调用函数的外层上下文，更重要的是，this的值是由调用表达式的形式决定的。因此说，this并非静态绑定在函数上。

由于this非静态地绑定在函数上，那么我们是否可以在函数中动态地修改this的值呢？

在sayName方法中，动态地修改this的值，重新执行以上的代码，发现this的值引用错误。这是由于一旦进入代码执行阶段（函数调用时，执行代码前），this的值确定，不能被改变。

影响函数代码中this值变化的因素：在通常的函数调用中，this是由激活上下文代码的调用者来提供的，即调用函数的父上下文（parent context）。this值取决于调用函数的方式。

误区：一些文章或JavaScript书籍中提到：this值取决于函数定义的方式，如果它是全局函数，this设置为全局对象，如果它是一个对象的方法，那么this总是指向这个对象。这是绝对不正确的。

切记一点：正是调用函数的方式影响了上下文中this的值。

eg: 全局函数被调用方式的不同形式激活，不同的调用方式导致了不同的this值。

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

console.log(foo == foo.prototype.constructor);  //true
foo.prototype.constructor();  //foo {}

eg: 对象定义的方法，执行该方法，this值未必指向该对象。

var foo = {
    bar: function() {
        console.log(this);
        console.log(this === foo);
    }
};
foo.bar(); //foo true
var fooTest = foo.bar;
console.log(fooTest === foo.bar);
//同一个function，不同的调用表达式，this值不同
fooTest(); //Window false

调用方式如何影响this的值？为充分理解this值的确定，需要详细分析其内部类型之一，即引用类型（Reference type）。

3. 引用类型（Reference Type）

使用伪代码将引用类型的值表示为拥有两个属性的对象，包括base（拥有属性的那个对象），对象中的propertyName（属性名）。

var valueofRefereceType = {
base: <base object>,
propertyName: <property name>
};

引用类型的值只有两种情况：

1）当我们处理一个标识符时

2）或属性访问器

标识符的处理过程另作讨论，目前只需知道，该算法的返回值中，总是一个引用类型的值，这对于this来说非常重要。

标识符是：变量名、函数名、函数参数名或全局对象中未识别的属性名。例如，下面标识符的值：

var foo;
function bar() { }

在操作中间结果的过程中，引用类型对应的值如下：

var fooReference = {
    base: global,
    propertyName: 'foo'
};

var barReference = {
    base: global,
    propertyName: 'bar'
};

伪代码GetValue描述从一个引用类型中得到对象真正的值。

内部的[[Get]]方法返回对象属性真正的值，包括对原型链中继承的属性分析。

GetValue(fooReference); // 10
GetValue(barReference); // function object "bar"

属性访问器：点（.）语法或括号（[]）语法

foo.bar();
foo['bar']();

在中间计算的返回值中，引用类型的值为：

var fooReference = {
base: foo,
propertyName: 'bar'
};

GetValue(fooReference); // function object "bar"

引用类型的值域函数上下文中的this如何相关？ --从最重要的意义上来说。 这个关联的过程是这篇文章的核心。

一个函数上下文中，确定this值的通用规则如下：

1）在一个函数上下文中，this由调用者提供，由调用函数的方式来决定。

2）如果调用括号()的左边是引用类型的值，this值将设为引用类型值的base对象（base object）。

3）如果调用括号()的左边不是引用类型的值（与引用类型类型不同的任何其它属性），this值为null，不过实际不存在this值为null的情况，因为当this值为null的时候，其值会被隐示转换为全局对象。（注：第5版的ECMAScript，已经不强迫转换为全局变量，而是赋值为undefined。）

看些例子，理解函数上下文中this值。

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

调用括号()的左边是引用类型的值，因为foo是一个标识符。

var fooReference = {
base: global,
propertyName: 'foo'
};

相应地，this设置为引用类型的base对象，即全局对象。

使用属性访问器：

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

我们再次拥有一个引用类型，其base是foo对象，在函数bar激活时用作this。

var fooBarReference = {
base: foo,
propertyName: 'bar'
};

但是，使用另外一种形式激活相同的函数，我们得到其它的this值。

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

//window

因为test作为标识符，生成了引用类型的其它值，其base（全局对象）用作this的值。

var testReference = {
base: global,
propertyName: 'test'
};

从上述例子中可以分析得知：使用不同的表达式激活函数为何会导致不同的this值，原因在于生成了引用类型（Type Reference）不同的中间值。

再看两个例子，加深印象。

通过调用方式动态确定this值的经典例子。

function foo() {
console.log(this.bar);
}
var x = {bar: 10};
var y = {bar: 20};
x.test = foo;
y.test = foo;

x.test(); //10
y.test(); //20

4. 函数调用和非引用类型

正如前面所提到的，当调用括号的左边不是引用类型而是其它类型，这个值自动设置为null，结果为全局对象。

思考如下这种表达式：

(function () {
console.log(this);
})(); //null ---> global

在这个例子中，我们有一个函数对象但不是引用类型的对象（它不是标识符，也不是属性选择器），相应地，this值最终设为全局对象。

更多复杂的例子：

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

(foo.bar = foo.bar)(); //Window
(false || foo.bar)(); //Window
(foo.bar, foo.bar)(); //Window

一个属性访问器，它的中间值应该是引用类型的值，但是在某些调用中，我们得到的this值不是base对象，而是global对象。Why?

原因在于后面3个的调用中，应用一定的操作符之后，调用括号左边的值不再是引用类型的值。

第一个例子 --- 调用括号左边是引用类型的值，this为base对象，即foo；

第二个例子 --- 组运算符并不适用，如上面所提到的，从引用类型获取一个对象真正值的方法，如GetValue。相应地，在组运算的返回中，得到的仍是一个引用类型。因此this值再次被设为base对象，即foo；

第三个例子 --- 与组操作符不同，赋值运算符触发了GetValue方法，返回的结果是函数对象，而不是引用类型的值，这意味着this值会被设置为null，最终会被变成全局对象。

第四个例子 --- 逻辑或运算符触发了GetValue方法，返回的结果......

第五个例子 --- 逗号运算符触发了GetValue方法，返回的结果是......

5. 引用类型和this为null

例外的情况：调用括号左侧是引用类型的值，但this却为null，最终被隐示转换为全局对象（global object）。情况成立的条件是：当引用类型值的base对象恰好为活跃对象（activiation object）。例如：内部子函数在父函数中被调用。局部变量、内部函数、形式参数存储在给定函数的激活对象中。

function foo() {
  function bar() {
    console.log(this); // Window
  }
  bar(); // the same as AO.bar()
}

foo();

活跃对象总是作为this返回，值为null（用伪代码表示AO.bar()相当于null.bar()）。正如上面例子提到的，this的值最终由null隐示转换为全局对象。

上述例子的变形：

function foo() {
  function bar() {
    console.log(this); // Window
  }
  return bar(); // the same as AO.bar()
}
foo();

有一种情况与上述情况又不一样：使用with。

如果with对象包含函数属性，并且在with语句块中调用该函数。with语句会将该对象添加到作用域链的最前面，即在活跃对象之前。相应地，有了引用类型的值（标识符或属性访问器），其base对象不再是活跃对象，而是with语句对象。另外，值得一提的是，它不仅仅只针对内部函数，也针对全局函数，原因在于with对象比作用域链最前面的对象（全局对象或活跃对象）还要靠前。

var x =10;
with({
    foo: function() {
        console.log(this.x);
    },
    x: 20
}) {
    foo();  //20
}

//because
var fooReference = {
    base: _withObject,
    propertyName: 'foo'
};

同样的情况出现在catch语句的实际参数中函数调用，catch对象添加到作用域的最前端，即活动对象或全局对象的前面。但是，这个特定的行为被确认为ECMAScript-262-3的bug，在ECMAScript-262-5中被修复了。这样，在特定的活动对象中，this不是指向catch对象，而是指向全局对象。

try {
    throw function() {
        console.log(this);
    };
} catch (e) {
    e();  //ES3标准里是_catchObject，ES5标准里是Window
}
//ES3
var eReference = {
    base: _catchObject,
    propertyName: 'e'
};
//ES5
var eReference = {
    base: global,
    propertyName: 'e'
};

同样的情况出现在命名函数的递归调用中。在第一次递归调用中，base对象是父活跃对象或全局对象，在递归调用中，base对象应该是存储着函数表达式可选名称的特定对象。但是，在这种情况下，this总是指向全局对象。

(function foo(bar) {
alert(this);
!bar && foo(1);
})();

6. 作为构造器调用的函数中的this

函数作为构造函数时，通过new操作符创建对象实例的过程包括：首先调用Foo()函数内部的[[construct]]方法，其次，在对象创建之后，调用内部的[[call]]方法。所有相同的函数“Foo”将this设置为新创建的对象。

function Foo() {
console.log(this);
this.x = 10;
}
var a = new Foo();
console.log(a.x);

再看一例：Person不做为构造函数调用，而是作为普通函数在全局作用域中被调用，this指向Window，因此全局对象中的name被修改为mars。至于Person.name的值为空字符串，有点奇怪？更奇怪的是将代码中Person函数的name全部换为zzz或其它标识，Person.zzz为undefined？？原因是：name是函数的一个内部参数，标识函数的名字，由于赋给Person的函数为匿名函数，因此name为空字符串，但是用其它标识符，由于Person中没有定义该属性，因此值为undefined。

var name = 'window_mars';
var Person = function (name) {
    this.name = name;
};
Person('mars');
console.log(name);         //mars
var s1 = Person.name;      //""
var o = new Person("ting");
console.log(o.name);       //ting

下面的例子可以很好地说明name属性为函数自带的属性值，且其值不能被覆盖。

var name = 'window_mars';
var Person = function (name) {
    this.name = name;
};
Person.name = name;
Person.name1 = name;
var s1 = Person.name;      //""
var s2 = Person.name1;     //"window_mars"
var o = new Person("ting");
console.log(o.name);       //ting

7. 手动设置函数调用时this的值（apply()、call()）

Function.prototype原型上定义了两个方法，允许手动设置函数调用时的值，这两个方法分别是：apply()和call()。这两个方法都接受第一个参数作为调用上下文中this的值，而这两个方法的区别是传递参数，对于apply()方法，第二个参数是数组类型（或类数组对象，比如arguments），而对于call()方法接受任意多的参数（逗号分隔）。这两个方法的第一个参数如果不传或为null，那this的值为Window。

例一：

var b = 10;
function a(c) {
console.log(this.b);
console.log(c);
}
a(20); //this.b is 10, c is 20

a.apply({b:20},30); //this.b is 20, c is 30
b.apply({b:40},[40]); //this.b is 40, c is 40

例二：

8. 对象中的this

对象中this值的判断，其实最终也牵涉到函数中this值的判断，因此可按照函数上下文中this值的判断规则来确定this值。看下面几个例子。

函数getName()上下文中this值的判断，引用类型中间值的base对象是person对象，this值为person对象，如下面代码所示。

var person = {
    name: "ting",
    getName: function() {
        console.log(this); //Object {name: "ting", getName: function}
        console.log(this.name); //ting
    }
};
person.getName();

函数getName()和getGlobalName()上下文中this值的判断，this值分别为person对象和全局对象。

上述例子的变形：

var name = "global-ting";
function getGlobalName () {
    return this.name;
}
var person = {
    name: "ting",
    getName: getGlobalName
};
var s1 = person.getName(); //"ting"
var s2 = getGlobalName();  //"global-ting"

上述例子的变形：