js 代码中call、bind、apply的用法和区别

90 阅读1分钟

call、bind、apply三个方法都有改变this指向的功能,但是不同的是它们的改变方式、使用的方式不一样。 看以下的例子:

const obj = {
    name: 'ex',
    age: 123,
    myFun: function(v1,v2) {
        console.log(`这是name:${this.name}, 这是age:${this.age}.\n v1: ${v1}, v2: ${v2}`)
    }
}

我们先看看call的用法:

obj.myFun.call({name: '新名字', age: 88}, 123,321)
// 输出:这是name:新名字, 这是age:88.
// v1: 123, v2: 321

接下来再用下bind的用法:

obj.myFun.bind({name: '新名字', age: 88}, 123,321)()
// 输出:这是name:新名字, 这是age:88.
// v1: 123, v2: 321

// 这里最关键要看的差异点就是最后的"()",由此可见,bind的用法需要调用一次才起效,这和call不一样

最后是apply的用法:

obj.myFun.apply({name: '新名字', age: 88}, [123,321])
// 输出:这是name:新名字, 这是age:88.
// v1: 123, v2: 321

// 这里的差异相对于call方法就是参数的传入方式不同:需要用[]括起来。