call apply bind 的用法

174 阅读1分钟

这几个方法都是可以用来改变this指向

call

//创建cat对象
const cat = {
    name:'花花',
    eat:function(expression){
    	console.log(this.name + expression + '的吃鱼')
    }
}
//执行cat的eat方法,此时eat方法中的this为cat
cat.eat('高兴')

//创建dog对象
const dog = {
    name:'旺财'
    eat:function(expression){
    	console.log(this.name + expression + '的啃骨头')
    }
}
//将cat中的eat对象中的this指向dog,并执行eat方法,dog就可以吃到鱼了
cat.eat.call(dog,'开心')

//执行结果:
//花花高兴的吃鱼
//旺财开心的吃鱼

apply

相比call的区别是apply传参的方式不同

//两条语句等同,call传参以参数列表形式传递,apply以数组方式传递
cat.eat.call(dog,'蹲下来')//多个参数call(obj,argu1,argu2,argu3,...)
cat.eat.apply(dog,['蹲下来'])//多个参数apply(obj,[argu1,argu2,argu3,...])

bind

const bindEat = cat.eat.bind(dog,'蹲下来')//eat函数不会执行,需要手动调用
bindEat()//才会执行eat函数

总结:

  • apply call区别传参不同
  • call bind 区别call会自动执行方法,bind需要手动执行
  • call apply bind 都可以改变方法执行上下文的this指向