浅谈bind、call、apply区别，使用方法及场景

谈到bind、call、apply，首先想到的是改变this全局上下文指向，但三者的区别，就自己的使用浅谈心得。

首先，直接调用三个方法并打印，获取直观对比，demo代码如下：

<script>
    var objA = {
        name: '小王',
    }
    var objB = {
        log: function () {
            return this.name
        }
    }
    console.log(objB.log.bind(objA))
    console.log(objB.log.call(objA))
    console.log(objB.log.apply(objA))
</script>

控制台输出结果如下：

在调用bind方法改变this指向时，执行的方法不会执行，而调用call方法和apply方法时，在改变this指向的同时，执行的方法也会执行；

除了以上这一直观的区别外，在使用时传入入参格式也有区别，demo代码如下：

<script>
    var objA = {
        name: '小王',
    }
    var objB = {
        log: function (age) {
            return `${this.name},年龄${age}岁`
        }
    }
    console.log(objB.log.bind(objA, 20)())
    console.log(objB.log.call(objA, 20))
    console.log(objB.log.apply(objA, [ 20 ]))
</script>

控制台输出如下：

使用bind方法和call方法时入参格式为逗号分割的入参，使用apply方法时入参格式为一个数组，入参依次为数组元素，多个入参就在这一数组中依次添加；

 

依据个人开发习惯：

在绑定方法时多使用bind方法；

在调用其他实例方法时，多使用call方法或apply方法；