javascript中this的指向分析

1、this的意义（this是什么？）：

http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html

this是Javascript语言的一个关键字。

它代表函数运行时，自动生成的一个内部对象，只能在函数内部使用。

https://zhuanlan.zhihu.com/p/23804247

this 是你 call 一个函数时传的 context

 https://dmitripavlutin.com/gentle-explanation-of-this-in-javascript/

In JavaScript the situation is different: this is the current execution context of a function. 

      总结一下： this是函数执行时的上下文，当使用this.变量/方式时，该上下文的变量和方法被调用。 

2、this的生成与绑定时间：

The this object is bound at runtime based on the context in which a function is executed。

3、this的指向：

In most cases, the value of this is determined by how a function is called. It can't be set by assignment during execution, and it may be different each time the function is called. 

翻译：在大多数情况下，this的值（指向）是由函数如何被调用决定的。它不能在执行期间被赋值，而且每次调用时它的值都可能不一样。

MDN的文档已经很好地说明了this的各种指向：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

此处不再对各种情况进行说明，而着重对匿名函数的this指向进行分析：

★ 匿名函数的this指向：

JS高级程序设计中文版中有一句话：“匿名函数的执行环境具有全局性，因此其this对象通常指向window。”

然而实际上，英文原版根本没有提到执行环境的全局性问题，

原文是：

Anonymous functions are not bound to an object in this context, meaning the this object points to window unless executing in strict mode (where this is undefined).

翻译：

在这个上下文（执行环境）中匿名函数并没有绑定到任意一个对象中，意味着this指向window（除非这个上下文（执行环境）是在严格模式下执行的，而严格模式下该this指向undefined）

以下是附录的代码，this context指的是下面的代码

var name = “The Window”;                   

var object = {   

 name : “My Object”,                     

 getNameFunc : function()

 { 

      return function()

　　{ 

          return this.name;     

  　 };   

} };                 

alert(object.getNameFunc()());  //”The Window” (in non-strict mode)

      另一个例子分析：

       var number = 1;
　　var obj =

 　　{
　　 　　number: 2,
　　 　　showNumber: function()

       　　{
　　　　　　this.number = 3;
　　　　　　(function(){
　　　　　　console.log(this.number);//1 立即执行函数并没有绑定在obj对象中，所以指向的是window，输出为1
　　　　　　})();
　　　　　　console.log(this.number);//3 showNumber函数在调用时被绑定到了obj中，而函数中的this.number修改了obj的number值，所以输出为3
　　　　}
　　};
　　obj.showNumber();

总结一下：判断 this 指向谁，看执行时函数被绑定在哪里，只要函数(function)没有绑定在对象上调用，它的 this 就是 window。

4、严格模式下this的指向：

 When using the apply() or call() methods of a function, a null or undefined value is coerced to the global object in nonstrict mode. 

 In strict mode, the this value for a function is always used as specified, regardless of the value. 

翻译：在正常模式下，当使用函数的apply()或call()方法时，如果参数为null或者undefined，this指向都会被强制变为全局对象。

          而在严格模式下，this的指向完全由它所被放入的上下文决定，即使被指定为null或者是undefined，this的指向都会是该上下文。

　　1、
　　"use strict";
　　var color = "red";
　　function displayColor(){ alert(this.color); }
　　displayColor.call(null);
　　//VM139:3 Uncaught TypeError: Cannot read property 'color' of null
　　at displayColor (<anonymous>:3:40)
　　at <anonymous>:4:14

　　2、
　　var color = "red";
　　function displayColor(){ alert(this.color); }
　　displayColor.call(null);//red

 

在严格模式下，如果this未在执行的上下文中定义，那它将会默认为undefined。

　　1、

　　"use strict";
　　var color = "red";
　　function displayColor(){ alert(this.color); }
　　displayColor();
　　//VM119:3 Uncaught TypeError: Cannot read property 'color' of undefined
　　at displayColor (<anonymous>:3:40)
　　at <anonymous>:4:1

　　2、

　　"use strict";
　　function displayColor(){ alert(this === window); }//false
　　displayColor();

　　3、
　　var color = "red";
　　function displayColor(){ alert(this.color); }
　　displayColor();//red

5、箭头函数this指向的特殊性 

ES6标准入门（第二版）

箭头函数体内的this对象就是定义时所在的对象，而不是使用时所在的对象。

箭头函数导致this总是指向函数所在的对象，this指向的固定化，并不是因为箭头函数内部有绑定this的机制。

实际原因是箭头函数根本没有自己的this，导致内部的this就是外层代码块的this。

而且，正因为它没有this，所以不能用作构造函数，也不能用call、apply、bind这些方法去改变this的指向。

 

箭头函数-廖雪峰

箭头函数内部的this是词法作用域，由上下文确定

如果使用箭头函数，以前的那种hack写法：

var that = this;

就不再需要了。

由于this在箭头函数中已经按照词法作用域绑定了，所以，用call()或者apply()调用箭头函数时，无法对this进行绑定，即传入的第一个参数被忽略：

var obj = {
    birth: 1990,
    getAge: function (year) {
        var b = this.birth; // 1990
        var fn = (y) => y - this.birth; // this.birth仍是1990
        return fn.call({birth:2000}, year);
    }
};
obj.getAge(2015); // 25