什么是函数的作用域

函数作用域：在 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)
    }

那我们想转变函数实行时绑定的 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 ( ) 函数的值。举个🌰：

var color = 'yellow'
var obj = {
    color: 'blue'
}
function checkColor () {
    console.log(this.color)
}
checkColor.bind(obj)() // blue

它的完成道理也比较简单，相似于下面如许：

function bind(fn, context) {
    return function() {
        return fn.apply(context, arguments)
    }
}