JavaScript 中 call()、apply()、bind() 的用法

JavaScript 中 call()、apply()、bind() 的用法

   var name = "小芳", age = "18"
    var obj = {
        name: "聪聪",
        objage: this.age,
        myFun: function () {
        	return this
            console.log(this.name + "年龄" + this.age)
        }
        }
    console.log(obj.objage) // 18
    obj.myFun() // 聪聪年龄undefined

由上可以得出，console的this指向是obj，所以，this.age为undefined。
再看下边代码

 var name = "小马"
    function  show() {
        console.log(this.name + "年龄18")
    }
    show() // 小马年龄18

从这一点可以看出this的指向的window。
今天所总结的是call（），apply（），bind（）；他们三者都能改变this的指向问题，我们来看看。

 var obj = {
      name: "聪聪",
      age: "18",
      myFun: function () {
          console.log(this.name + "年龄" + this.age)
      }
      }
 var replaceObj = {
 	name: "小芳",
 	age: "20"
 } 
	obj.myFun.apply(replaceObj) // 小芳年龄20
	obj.myFun.call(replaceObj) // 小芳年龄20
	obj.myFun.bind(replaceObj)() //小芳年龄20

上边要注意的是bind()返回的是一个函数，需要在后边重新调用一下才可以执行。

那么如果传参接收参数怎么办呢？接着看。

var obj = {
        name: "聪聪",
        age: "18",
        myFun: function (o, t) {
            console.log(this.name + "年龄" + this.age + "性别" + o + "身高" + t)
        }
    }
    var replaceObj = {
        name: "小芳",
        age: "20"
    }
    obj.myFun.call(replaceObj, "女", "170" ) // 小芳年龄20性别女身高170
    obj.myFun.bind(replaceObj, "女", "170" )() // 小芳年龄20性别女身高170
    obj.myFun.apply(replaceObj, ["女", "170"] ) // 小芳年龄20性别女身高170
    obj.myFun.apply(replaceObj, "女", "170") // 小芳年龄20性别女身高170 // 报错
    obj.myFun.call(replaceObj, ["女", "170"] ) //小芳年龄20性别女,170身高undefined
    obj.myFun.bind(replaceObj, ["女", "170"] )() // ceshi.html:253 小芳年龄20性别女,170身高undefined

有上面我们可以得出结论，当传参的时候，call() 所传的是string类型， bind()返回的是一个函数，要想查看是需要调用函数的，所以要加上(),重新调用一下，**bind()使用的时候是需要传数组格式，**才能够拼接出来想要的结果，其他两个方法如果想要使用数组的时候，将会把数组内的内容当成一个参数进行渲染和拼接。

以上内容分别有借鉴和学习，并非抄袭。