es6箭頭函數中的this的區別

箭頭函數函數看上去只是es6對匿名函數的簡寫,其實箭頭函數和匿名函數有明顯區別

  • 普通方式定義的函數可參考我之前整理的文章 關于js中this
  • 箭頭函數中的this是詞法作用域,即this和調用時的上下文無關
  • 箭頭函數根本就沒有綁定自己的 this,在箭頭函數中調用 this 時,僅僅是簡單的沿著作用域鏈向上尋找,找到最近的一個 this 拿來使用罷了(外層調用者);
  • 因為箭頭函數沒有綁定this,所有call,apply的第一個參數(this的綁定)無效
    來看看區別
//箭頭語法
var obj = {
    name: 'ab',
    getName: function () {
        var fn = () => this.name; // this指向obj對象
        return fn();
    }
};
obj.getName();

//普通的方式
var obj = {
name: 'ab',
getName: function () {
    var fn = function() {return this.name} // this指向winodw對象
    return fn();
}
};
obj.getName();
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容