this

说到this，需要明确三方面内容：

• this何时被赋值
• this被赋了什么值
• 内置函数如何使用this的

this何时被赋值

进入函数代码

当控制流根据一个函数对象 F、调用者提供的 thisArg 以及调用者提供的 argumentList，进入函数代码的执行环境时，执行以下步骤：

1. 如果函数代码是严格模式下的代码，设 this 绑定 为 thisArg。
2. 否则如果 thisArg 是 null 或 undefined ，则设 this 绑定为全局对象。
3. ……

以上信息来源：进入函数代码

从上诉信息中可以知道：

• this 与调用者提供的 thisArg 密切相关
• this 在严格模式下为 thisArg
• this 在非严格模式下为 thisArg 或 全局对象

那么 thisArg 又是怎么来的呢？下面来看下函数调用过程：

函数调用

1. 令 ref 为解释执行 MemberExpression 的结果。
2. 令 func 为 GetValue(ref)。
3. 令 argList 为解释执行 Arguments 的结果，产生参数值们的内部列表（参见 11.2.4）。
4. 如果 Type(func) 不是 Object，抛出一个 TypeError 异常。
5. 如果 IsCallable(func) 为 false，抛出一个 TypeError 异常。

6. 如果 Type(ref) 为 Reference，那么

   • 如果 IsPropertyReference(ref) 为 true，

     • 那么令 thisValue 为 GetBase(ref)。

   • 否则，ref 的基值是一个环境记录项。

     • 令 thisValue 为调用 GetBase(ref) 的 ImplicitThisValue 具体方法的结果。

7. 否则，Type(ref) 不是 Reference。

   • 令 thisValue 为 undefined。
8. 返回调用 func 的 [[Call]] 内置方法的结果，传入 thisValue 作为 this 值和列表 argList 作为参数列表。

以上信息来源：函数调用

从上诉信息中可以知道：

• thisArg 即 thisValue
• thisValue 与 ref 的类型密切相关

• 如果 ref 的类型是 Reference（引用规范类型）

  • 如果 ref 是属性引用，通过 GetBase(ref)（返回引用值ref的基值部分） 获取 thisValue
  • 否则，通过 ImplicitThisValue 方法获取 thisValue
• 否则，thisValue 为 undefined

那么，了解到这里可能有许多新的疑问，比如：

• Reference 是怎样的类型
• ref 是怎么来的
• ref 什么时候是 Reference，什么时候不是。
• GetBase(ref) 和 ImplicitThisValue 是如何产生结果的

Reference 是怎样的类型

首先先解释下 Reference。

其实ES中的类型分为ECMAScript语言类型和规范类型

ECMAScript语言类型对应的是程序员使用 ECMAScript 语言直接操作的值，如 Undefined、Null、Boolean、String、Number、Object等。
规范类型可用来描述 ECMAScript 表达式运算的中间结果，但这样的值不能储存为对象的属性或 ECMAScript 语言的变量值。引用尤雨溪的解释：

这里的 Reference 是一个 Specification Type，也就是 “只存在于规范里的抽象类型”。它们是为了更好地描述语言的底层行为逻辑才存在的，但并不存在于实际的 js 代码中。

ref 是怎么来的

从上诉函数调用中可以知道，ref 是解释执行 MemberExpression 的结果。
下面详细看下 MemberExpression 的解析过程：

产生式 CallExpression : MemberExpression Arguments 按照下面的过程执行 :

1. 令 baseReference 为解释执行 MemberExpression 的结果。
2. 令 baseValue 为 GetValue(baseReference)。
3. 令 propertyNameReference 为解释执行 Expression 的结果。
4. 令 propertyNameValue 为 GetValue(propertyNameReference)。
5. 调用 CheckObjectCoercible(baseValue)。
6. 令 propertyNameString 为 ToString(propertyNameValue)。
7. 如果正在执行中的语法产生式包含在严格模式代码当中，令 strict 为 true，否则令 strict 为 false。
8. 返回一个值类型的引用，其基值为 baseValue 且其引用名为 propertyNameString，严格模式标记为 strict。

从上诉信息中分析可以知道：

• 解释执行 MemberExpression 的结果是一个引用规范类型（Reference）

• 这个引用规范类型包含三部分信息：

  • baseValue
  • propertyNameString
  • strict
• thisValue 的值取决于 baseValue
• baseValue 是调用 GetValue 获得的。
• GetValue 得到的基值是 undefined、Object、Boolean、String、Number、环境记录项中的任意一个（详见：引用规范类型），而不是引用规范类型。

GetValue 详细过程见：GetValue

ref 什么时候是 Reference，什么时候不是 Reference

一般来说，ref 是MemberExpression解析的结果，都将是 Reference。
但是，如果 MemberExpression 是其函数表达式的一部分，则可能将改变最终解析结果的类型。
而改变解析结果类型的主要原因取决于是否调用了 GetValue 方法，如果调用了 GetValue ，函数中间值 ref 将是 Object 类型。

那么哪些表达式不使用 GetValue 呢？

• 标识符引用 ： 标识符执行的结果总是一个 Reference 类型的值。
• 群组表达式：本算法不在执行 Expression 后使用 GetValue。这主要的目的是让 delete 与 typeof 运算符可以作用在被括号括起来的表达式。
• 成员表达式
• 调用表达式

更多表达式详见：表达式

GetBase(ref) 和 ImplicitThisValue 是如何产生结果的

• GetBase：返回引用值ref的基值部分
• ImplicitThisValue ： 声明式环境记录项永远将 undefined 作为其 ImplicitThisValue 返回。

this被赋了什么值

其实在 this何时被赋值 部分已经介绍了 this被赋了什么值。下面总结三种赋值过程：

第一种this赋值过程：

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

1. 调用表达式解析 obj.fn ，返回引用规范类型，baseValue 为 obj。
2. 函数调用，由于 1 过程返回的为引用规范类型，且为属性引用，调用 GetBase 将 baseValue （obj） 作为返回值，返回给 thisValue。
3. 进入函数代码，thisArg 为 obj，将其赋值给 this。

如果对步骤1中，baseValue 为 obj 有疑问，详见属性访问， 产生式 MemberExpression : MemberExpression [ Expression ] 执行过程。
相当于有两个过程：

1. 解析obj，baseValue 为声明式环境记录项。
2. 解析obj.fn，baseValue 为 obj。

第二种this赋值过程：

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

1. 调用表达式解析 foo, 返回引用规范类型，baseValue 为声明式环境记录项（函数声明时绑定）。
2. 函数调用，由于 1 过程返回的为引用规范类型，且不为属性引用，调用 ImplicitThisValue 方法，返回 undefined 。
3. 进入函数代码，thisArg 为 undefined，非严格模式下将 this 赋值为全局对象。

第三种this赋值过程：

var v = 1; 
var obj = {
    v: 2,
    fn: function(){
        console.log(this.v);
    }
}
var fn2 = obj.fn;
fn2(); // 1
(obj.fn, obj.fn)(); // 1

1. 调用表达式解析 fn2，(obj.fn, obj.fn) ，由于赋值表达式、逗号表达式都使用了 GetValue 方法，返回函数（Object 类型)。
2. 函数调用，由于 1 过程返回的不是引用规范类型，所以 thisValue 为 undefined`。
3. 进入函数代码，thisArg 为 undefined，非严格模式下将 this 赋值为全局对象。

内置函数如何使用this的

内置函数修改 this 是通过给 func 的 [[Call]] 内置方法传递 thisArg 来实现的。

内置方法

• Function.prototype.apply (thisArg, argArray)
• Function.prototype.call (thisArg [ , arg1 [ , arg2, … ] ] )
• Function.prototype.bind (thisArg [, arg1 [, arg2, …] ] )
• Array.prototype.every ( callbackfn [ , thisArg ] )
• Array.prototype.some ( callbackfn [ , thisArg ] )
• Array.prototype.forEach ( callbackfn [ , thisArg ] )
• Array.prototype.map ( callbackfn [ , thisArg ] )
• Array.prototype.filter ( callbackfn [ , thisArg ] )
• new 运算符 使用内置方法 [[Construct]] 实现this指定

内置方法模拟实现

使用成员表达式模拟内置方法[[Call]]的效果：

apply

Function.prototype.apply_ = function (context, arr) { 
    var context = Object(context) || window;
    var result;

    // 临时记录需要调用的function 
    context.fn = this;
      
    if (!arr) {
        result = context.fn();
    }
    else {
        var args = [];
        for (var i = 0, len = arr.length; i < len; i++) {
            args.push('arr[' + i + ']');
        }
        // 使用成员表达式指定context.fn执行时this为context 
        result = eval('context.fn(' + args + ')')
    }

    delete context.fn
    return result;
}

call

Function.prototype.call_ = function (context) {
    var context = context || window;
    context.fn = this;

    var args = [];
    // 获取参数列表 
    for(var i = 1, len = arguments.length; i < len; i++) {
        args.push('arguments[' + i + ']');
    } 
    // 使用成员表达式指定context.fn执行时this为context  
    var result = eval('context.fn(' + args +')');

    delete context.fn
    return result;
}  

bind

Function.prototype.bind_  = function (context) {
    // 记录bind的函数 
    var self = this;
    var args = [];
    // 获取绑定的参数列表 
    for(var i = 1, len = arguments.length; i < len; i++) {
        args.push('arguments[' + i + ']');
    } 

    // 创建新函数 
    var fbound = function () {
        // 获取未绑定的参数列表 
        var bindArgs = Array.prototype.slice.call(arguments);
        // fbound被当做构造函数使用，this指向实例。否则，指向 context
        self.apply(this instanceof self ? this : context, args.concat(bindArgs));
    } 
    // 维护原型关系   
    fbound.prototype = self.prototype || new Function().prototype ;
    return fbound;
}

参考文档

• 【1】冴羽的深入理解系列
• 【2】ES5 Wiki