call、apply、bind方法

158 阅读1分钟

call、apply、bind方法

都是函数的方法,改变函数内部this的指向

call的用法

call是函数(方法)的方法,通过call,可以改变方法的this指向,让this指向call的第一个参数。

  1. 全局函数调用call
  2. 对象的方法调用call
     function fun() {
            console.log(this) // this指向全局对象
        }
        let cat = {
            name: "小猫"
        }
        fun.call(cat) //call的第一个参数是一个对象   


        let animal = {
            name: "狮子"
        }
        let dog = {
            name: "小王",
            sayName() {
                console.log("我是 " + this.name)
            }
        }
        dog.sayName()  //输出我是小王
        dog.sayName.call(animal) //输出我是狮子

继承的方式

  1. ES6---extends
  2. ES5---原型链
  3. CALL方法 ---可以实现多重继承
      function User() {
            this.curdContent = function () {
                console.log("增删改查")
            }
        }
        function Person() {
            this.login = function () {
                console.log("登录成功")
            }
        }
        function Admin() {
            User.call(this)
            Person.call(this)
        }
        
        var admin = new Admin()
        admin.curdContent()
        admin.login()

call方法传参

       let dog = {
            name: "小狗"

        }
        let cat = {
            name: "小猫",
            sayName(food1, food2) {
                console.log(`我是${this.name},我喜欢吃${food1}${food2}`)
            }

        }
        cat.sayName.call(dog, "鱼", "虾")   //call方法
        cat.sayName.apply(dog, ["鱼", "鸡肉"])   //apply方法
        let newFun = cat.sayName.bind(dog, "鱼", "虾")  //bind方法
         

call方法第一个参数是一个对象,后面的参数才是其他对象需要传过来的值。

call 和 apply 、bind 的区别

  1. 传递参数的形式不一样:call是依次在后面写传递的值,而apply是以数组的形式传递值。
  2. 返回形式不一样:bind返回一个新的值,需要一个变量接收。

总结

  1. call,会调用函数,通过参数列表依次传参
  2. apply,会调用函数,是通过数组来传递参数的
  3. bind,不会调用函数,将新的重新绑定this的函数作为返回值,通过参数列表依次传参