es6和es5中的this指向

先看一段代碼：

 

var name = "window";
var obj = {
    name: 'obj',
    //普通函數
    one: function(){
    	console.log(this.name)
    },
    //箭頭函數
    two: ()=> {
	    console.log(this.name)
    },
    //普通函數中的箭頭函數
    three: function(){
    	(()=>{
    		console.log(this.name)
   		})()
    }, 
    //多層箭頭函數
    four: ()=> {
    	(()=>{
    		console.log(this.name)
   		})()
    }
}
obj.one();    //obj  
obj.two();	  //window 
obj.three();  //obj
obj.four()    //window

 

 

 

說明：

1、

①普通函數中的this總是指向它的直接調用者；

②箭頭函數中的this是在定義函數的時候綁定，而不是在執行函數的時候綁定。

2、

①比如上面的 obj.one()；直接調用者是obj，因此this指向obj

②箭頭函數中的this指向是固定的，並不是因爲箭頭函數內部有綁定this的機制，實際原因是箭頭函數內部沒有this，箭頭函數的this是在定義時就綁定的，它的this就是箭頭函數所處的對象的所處作用域。

比如obj.three()；箭頭函數所在的對象是函數three，函數three處於obj的作用域中，因此this指向obj；

比如obj.four()；箭頭函數所在的對象是obj，obj處於window的作用域中因此this指向window。

3、

es6函數寫法有2種，一種是 fn: (str) => { } ； 一種是 fn(str){ }

箭頭函數是沒有上下文的、this會直接指向上一級

第二種寫法this指向調用它的調用者