JS中apply、call和bind的共同点和区别是什么？

apply、call和bind的共同点，作用？

• 他们都可以去调用别人的方法
• 他们都可以改变this的指向
• 他们的第一个参数都是this对象的指向
• 后续都可以进行参数的传递

apply、call和bind的区别？

1. 调用的呈现方式不一样

让我们一起先来看下代码

class Person{
name="美女"
say(){
console.log(this.name)
}}

//1.创建一个p1实例
let p1=new Person()

//2.创建一个对象
let obj={
name:'屌丝'
}

//3.借用美女的方法，喊上屌丝的名字
p1.bind(obj)()

• bind直接调用的时候，不会执行方法，而是会返回一个新的函数，新的函数里面有bind调用的方法

//如果上面那个地方看不懂，我把它解构一下
let newfunc=p1.bind(obj）
newfunc()

那我们继续来看call和apply的调用

p1.say.call(obj)
p1.say.apply(obj)

• call 和apply 调用的时候是一样的 既改变了this的指向，也会直接调用方法

2. 传递参数的写法不一样

• bind可以直接在新构建的函数里面传递参数
• 也可以在传递的第二个参数里面写参数

 class Person {
        name = "美女"
        say(b) {
            console.log(this.name)
            console.log(b);
        }
    }
    let p1 = new Person()

    let obj = {
        name: '屌丝'
    }
	//这是第一种方法
    p1.say.bind(obj)("abc")
    
	//这是第二种方法
	//  p1.say.bind(obj, "abc")()

call 直接在第二个参数里面写需要传递的参数

    p1.say.call(obj,"abc")

apply需要将传递的参数放在一个数组里面

    p1.say.apply(obj,["abc"])

如果没有放在数组里面，就会出现这样子的报错
Uncaught TypeError: CreateListFromArrayLike called on non-object

小结

不同点	bind	Value	Value
调用的呈现方式不一样	调用之后不会直接执行方法，而是重新构建出一个新的函数，在新函数里面执行方法	直接调用	直接调用
传递参数的写法不一样	p1.say.bind(obj, “abc”)() // p1.say.bind(obj, “abc”)()	p1.say.call(obj,“abc”)	p1.say.apply(obj,[“abc”])