簡述JS中this的指向

這裏是修真院前端小課堂，每篇分享文從

【背景介紹】【知識剖析】【常見問題】【解決方案】【編碼實戰】【擴展思考】【更多討論】【參考文獻】

八個方面深度解析前端知識/技能，本篇分享的是：

【簡述JS中this的指向    】

 

一、背景介紹
    咱們在寫代碼時候每每但願一個函數在不一樣環境下行爲風格一致可是具體表現不同，這個時候就須要this出場了。

    this是javascript的一個關鍵字,是函數內部的一個特殊對象（或this引用）;this在不一樣的上下文執行環境中指代不一樣的對象，因此咱們能夠用一樣的this代碼輸出不一樣的結果，從而簡化代碼。

1.1 THIS的特性

       會根據代碼上下文語境自動改變其引用對象

this的指向在函數定義的時候是肯定不了的，只有函數執行的時候才能肯定this到底指向誰，實際上this的最終指向的是那個調用它的對象。

2.知識剖析
2.1 做爲普通函數在全局環境中被調用

       先上代碼：

全局環境中的普通對象

        這裏調用了a函數，而a函數的執行環境是全局環境，這裏的this也就指向了全局變量window。

        在全局環境裏面，this 永遠指向 window，所以在全局環境裏做爲普通函數被調用的時候，this 也是指向 window。

2.2 做爲對象的屬性被調用

先來個總結：若是函數做爲一個對象的屬性方法，而且被調用的時候，那麼這個屬性方法中的this 就指向這個對象，來看代碼：

.png](/img/bVbmXa0)

![圖片上傳中...]

可是當在在對象方法中再定義函數，這時候 this 又是 window

2.3 做爲構造函數被調用

做爲構造函數被調用的時候，this 表明它即將 new 出來的對象；若是不加 new，表示即做爲普通函數調用，指向 window。

2.4做爲 call/apply/bind 方法的調用

做爲 call/apply/bind 方法被調用的時候指向傳入的值。

2.5  其餘：setTimeout、setInterval中的this；構造函數 prototype 屬性； Eval函數；箭頭函數.。

3.常見問題

    一、this 遇到return怎麼辦呢？什麼意思呢，來看

        什麼意思呢？

        若是返回值是一個對象，那麼this指向的就是那個返回的對象，若是返回值不是一個對象那麼this仍是指向函數的實例。

二、在嚴格模式下是什麼狀況呢？

        在嚴格模式下，在全局環境中執行函數調用的時候 this 並不會指向 window 而是會指向 undefined

三、什麼是嚴格模式？

        除了正常運行模式，ECMAscript 5添加了第二種運行模式："嚴格模式"（strict mode）。顧名思義，這種模式使得Javascript在更嚴格的條件下運行。

設立"嚴格模式"的目的，主要有如下幾個：

• 消除Javascript語法的一些不合理、不嚴謹之處，減小一些怪異行爲;
• 消除代碼運行的一些不安全之處，保證代碼運行的安全；
• 提升編譯器效率，增長運行速度；
• 爲將來新版本的Javascript作好鋪墊。

        "嚴格模式"體現了Javascript更合理、更安全、更嚴謹的發展方向，包括IE 10在內的主流瀏覽器，都已經支持它，許多大項目已經開始全面擁抱它。

        另外一方面，一樣的代碼，在"嚴格模式"中，可能會有不同的運行結果；一些在"正常模式"下能夠運行的語句，在"嚴格模式"下將不能運行。掌握這些內容，有助於更細緻深刻地理解Javascript，讓你變成一個更好的程序員。

4.拓展思考
Q1：apply方法有什麼做用？通常在什麼狀況下可使用apply？

        apply:方法能劫持另一個對象的方法，繼承另一個對象的屬性.，call:和apply的意思同樣,只不過是參數列表不同.。

        在給對象參數的狀況下,若是參數的形式是數組的時候,好比apply示例裏面傳遞了參數arguments,這個參數是數組類型,而且在調用Person的時候參數的列表是對應一致的(也就是Person和Student的參數列表前兩位是一致的) 就能夠採用 apply , 若是個人Person的參數列表是這樣的(age,name),而Student的參數列表是(name,age,grade),這樣就能夠用call來實現了,也就是直接指定參數列表對應值的位置(Person.call(this,age,name,grade));

Q2：ES6是什麼？

       ECMAScript 6（如下簡稱ES6）是JavaScript語言的下一代標準，在2015年6月正式發佈。

Q3：bind是幹什麼用的？何時使用？

       bind()最簡單的用法是建立一個函數，使這個函數不論怎麼調用都有一樣的this值。場景就是在綁定函數，偏函數，settimeout等

Q4：何時使用apply何時使用call

       傳遞參數是數組形式的時候用apply，反之使用call

1. 參考文獻

參考一：完全理解js中this的指向