JavaScript 函數作用域、執行環境(this)、call、apply、bind 的用法

什麼是函數的作用域

函數作用域：在 JavaScript 中，作用域爲可訪問變量，對象，函數的集合。JavaScript 函數作用域: 作用域在函數內修改。

this 與函數又有什麼關係呢？

this對象是在運行時基於函數的執行環境綁定的。比如：在全局函數中，this 等同於 window 或者 global，而當函數被作爲方法調用時，this 等於那個對象。特別需要注意的是在執行諸如:setInterval、setTimeout 等函數的回調時，此時的 this 其實是指向全局 window 的，因爲類似這樣的方法其實是 window 的屬性方法。所以我們經常會看到類似下面的代碼：

var a = {
    age: 21,
    addAge: function() {
        var that = this
        setInterval(function() {
            that.age += 1
        }, 1000)
    }
專門建立的學習Q-q-u-n ⑦⑧④-⑦⑧③-零①②  分享學習方法和需要注意的小細節，互相交流學習，不停更新最新的教程和學習技巧（從零基礎開始到WEB前端項目實戰教程，學習工具，全棧開發學習路線以及規劃）

那我們想改變函數執行時綁定的 this 怎麼辦呢？

call、apply、bind 可以用來幹這個事情，哈哈~

call、apply 的用法：

每個函數都有兩個非繼承而來的方法： apply ( ) 和 call ( )。這兩個方法的用途都是在特定的作用域中調用函數，實際上就是用來設置函數體內的 this對象 的值。兩個方法的作用是相同的，唯一的區別是接收參數的方式不一樣。兩個方法的第一個參數是接收一個對象或者 null，區別是 apply 接收兩個參數，第二個參數可以是 數組或者類數組的對象（arguments）這樣。ES6 的 Set 實例也可以。call 方法就比較厲害了，它接收多個參數，除第一個對象參數外，其餘的參數要一個一個列出來。

function sum(num1, num2) {
    return num1 + num2
}
sum.apply(this, [1, 2]) // 3
sum.call(this, 1, 2) // 3

其實，call 和 apply 方法的強大在於，能擴充函數運行的運用域：

var color = 'yellow'
var obj = {
    color: 'blue'
}
function checkColor () {
    console.log(this.color)
}
checkColor() // yellow
checkColor.call(this) // yellow
checkColor.call(window) // yellow，此處 this === window
checkColor.call(obj) // blue

那 bind 可以用來乾點啥好事兒呢？

ES 5 爲函數定義了一個 bind 方法。這個方法會創建一個函數的實例，實例執行時的 this 值會被綁定到傳給 bind ( ) 函數的值。舉個