JavaScript中的bind函数（浅谈）

看别人的项目时遇到bind函数，看不懂，回头补了一下，作出以下比较浅显的总结，个人觉得官网上的陈述有点绕，一开始看不懂，后来发现相当精辟。

官网介绍: bind方法会创建一个新函数，称为绑定函数。当调用这个绑定函数时，绑定函数会以创建它时传入bind方法的第一个参数作为this，传入bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数。

 

个人理解：

1.绑定函数当然也是函数，它拥有函数的特性

2.绑定函数的函数体就是原函数

3.绑定函数的功能之一是改变this的指向

4.绑定函数的一个重要功能是可以递归遍历一个数组（koa2中的中间件async/await可能是基于此函数实现）

 

测试demo及注释:

demo1:

var myModule = {
    num: 10,
    getNum: function () {
        return this.num;
    },
    add: function (x, y) {
        return x+y
    }
}

var yourModule = {
    num: 15

}

console.log(myModule.getNum(1)) // 10 

// 说明myModule.getNum.bind()是一个绑定函数
console.log(myModule.getNum.bind()) // [Function: bound getNum]   

// 说明原本myModule中的this的指向改为指向了yourModule,注意后面添加了括号，这与调用函数时要在函数后面添加括号的语法一样
console.log(myModule.getNum.bind(yourModule)()) // 15   

// 印证官方介绍"传入bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数“
// 在以下示例中，”第二个及以后的参数“（与null在同一个括号的参数）和"绑定函数运行时本身的参数"(第二个小括号的参数)
// 这两种类型的参数在bind中被一视同仁（即2，3，4，5），作为参数按顺序传入到原函数中执行，原函数原本需要接收多少个参数，就拿前面对应数量的参数，多出来的参数，将被舍弃
console.log(myModule.add.bind(null, 2, 3)()) // 5
console.log(myModule.add.bind(null, 2)(3)) // 5
console.log(myModule.add.bind(null)(2, 3)) // 5
console.log(myModule.add.bind(null, 2, 3, 4, 5)()) // 5
console.log(myModule.add.bind(null)(2, 3, 4, 5)) // 5
console.log(myModule.add.bind(null,2,3)(4, 5)) // 5

demo2:

// 递归遍历数组
var arr = ['Mike', 'Jack', 'Rose']
function test(arr, i) {
    function done(i) {
        console.log(arr[i], i)
        if (i < 2) done.bind(null, i+1)()
    }
    done(i)
}

test(arr, 0)

最后，为什么说是浅谈，原因是看了很多的bind函数相关的文章都讲到了如何实现，但我还没看，留个坑，日后再补。