JavaScript中apply()和call()的区别和应用

JavaScript中的每一个Function对象都有一个apply()方法和一个call()方法，这两个方法能够改变函数体内部 this 的指向。

例如，fun1.call()或者fun1.apply() 都是为了改变fun1函数内部的this指向。

二者的作用完全一样，只是接受参数的方式不太一样。

func.apply(thisArg, [argsArray])

func.call(thisArg, arg1, arg2, ...)

apply：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.apply(A, arguments)；即A对象调用B对象的方法。

call：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.call(A, args1,args2)；即A对象调用B对象的方法。

第一个参数指定了函数体内this对象的指向，他可以为任何一个 JavaScript 对象(JavaScript 中一切皆对象)，如果为null，则函数体内的this会指向默认的宿主对象，在浏览器中则是window。

第二个参数，call 需要把参数按顺序传递进去，而 apply 则是把参数放在数组里。

当你的参数不确定数量时用 apply ，然后把参数 push 进数组传递进去。或者也可以通过 arguments来获取所有的参数。这样看来，apply的使用率更高。

注意：

apply：最多只能有两个参数——新对象thisArg和一个数组[argsArray]。如果给该方法传递多个参数，则把参数都写进这个数组里面，当然，即使只有一个参数，也要写进数组里。如果[argsArray]不是一个有效的数组或arguments对象，那么将导致一个TypeError。如果没有提供[argsArray]和thisArg任何一个参数，那么Global对象将被用作thisArg，并且无法被传递任何参数。一般的，目标函数只需要n个参数列表，而不接收一个数组参数，可以通过apply的方式巧妙地解决这个问题【见apply妙用】。

call：它可以接受多个参数，第一个参数与apply一样，后面则是一串参数列表。这个方法主要用在js对象各方法相互调用的时候，使当前this实例指针保持一致，或者在特殊情况下需要改变this指针。如果没有提供thisArg参数，那么Global对象将被用作thisArg。 

call()方法的作用和 apply() 方法类似，区别就是call()方法接受的是参数列表，而apply()方法接受的是一个参数数组。 

基础用法

function add(a, b) {
    return a + b
}

function sub(a, b) {
    return a - b
}

// sub调用add的方法，同 var a1 = add.call(sub, 1, 2)
var a1 = add.apply(sub, [1, 2]) 
// add调用sub的方法，同 var a2 = sub.call(add, 1, 2)
var a2 = sub.apply(add, [1, 2]) 

console.log(a1, a2)

 输出：

 3 -1

基础继承 

function Animal(name) {
    this.name = name
    this.showName = function () {
        console.log(this.name)
    }
}

function Cat(name) {
    // Cat调用Animal方法，同 Animal.call(this, name)
    Animal.apply(this, [name])
}

var cat = new Cat('小猫')
cat.showName()

 输出：

 小猫

多重继承

function Func1() {
    this.sub = function (a, b) {
        console.log(a - b)
    }
}

function Func2() {
    this.add = function (a, b) {
        console.log(a + b)
    }
}

function Func3() {
    // Func3调用Func1方法，同 Func1.call(this)
    Func1.apply(this)
    // Func3调用Func2方法，同 Func2.call(this)
    Func2.apply(this)
}

var func = new Func3()
func.sub(1, 2)
func.add(1, 2)

 输出：

 -1 

 3 

 apply妙用1

var numbers = [5, 6, 1, 3, 7];

var max = Math.max.apply(null, numbers)
console.log(max)

var min = Math.min.apply(null, numbers)
console.log(min)

 输出：

 7 

 1       

Math.max()方法，只能传递参数列表Math.max(param1, param2...)，不支持Math.max([param1, param2]) 。借助apply，我们可以将一个数组参数转换为一个参数列表([param1, param2...] 转换为 (param1,param2...)

apply妙用2

var arr1 = new Array("1","2","3")
var arr2 = new Array("4","5","6")
// push返回数组长度
Array.prototype.push.apply(arr1, arr2) // 等价于arr1.push("4","5","6")
console.log(arr1)

 输出：

 6   

 ["1", "2", "3", "4", "5", "6"]

与君共勉：再牛逼的梦想，也抵不住傻逼般的坚持！