call 和 apply 和 bind的区别

Posted 2021-03-07 东城以东

有些东西说忘就往，每天记录自己忘记的东西重新学习一遍，挺好

作用：call（）和apply（）用法都是一样的，改变this的指向问题 

区别：接收参数的方式不同，

（bind 方法是附加在函数调用后面使用，可以忽略函数本身的 this 指向），

（bind和 call / apply 有一些不一样，就是不会立即执行函数，而是返回一个已经改变了 this 指向的函数）

1.call

call 方法是附加在函数调用后面使用，可以忽略函数本身的 this 指向

语法： 函数名.call(要改变的 this 指向，要给函数传递的参数1，要给函数传递的参数2， ...)

　　（第一个参数是你要改变的函数内部的 this 指向）

　　（第二个参数开始，依次是向函数传递参数）

//实例1
var a = 1
function fn1(){
    console.log(this)
}
fn1()  // window
fn1().call(1)  //1

//实例2
var obj = {
    a:"很好",
    fn2:function(res){
        console.log(res+this.a)
    }
}
obj.fn2("我")//我很好
var co = {
    a:‘很不好‘
}
obj.fn2.call(co,"我")//我很不好

2.apply

apply 方法是附加在函数调用后面使用，可以忽略函数本身的 this 指向

语法： 函数名.apply(要改变的 this 指向，[要给函数传递的参数1， 要给函数传递的参数2， ...])

var obj = {
    name : ‘王富贵‘
}
function fn1(a,b) {
    console.log(this) //{name: "王富贵"}
    console.log(a+b) //3
}
fn1.apply(obj,[1,2])

3.bind

bind 方法是附加在函数调用后面使用，可以忽略函数本身的 this 指向

和 call / apply 有一些不一样，就是不会立即执行函数，而是返回一个已经改变了 this 指向的函数

语法： var newFn = 函数名.bind(要改变的 this 指向); newFn(传递参数)

var obj = {
    name : ‘王富贵‘
}
function fn1(a,b) {
    console.log(this) //{name: "王富贵"}
    console.log(a+b) //5
}
var fn2 = fn1.bind(obj)//这里只能传一个参数  改变this的指向
fn2(2,3)