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

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()

JavaScript 和 ES6

在这个过程你会发现，有很多 JS 知识点你并不能更好的理解为什么这么设计，以及这样设计的好处是什么，这就逼着让你去学习这单个知识点的来龙去脉，去哪学？第一，书籍，我知道你不喜欢看，我最近通过刷大厂面试题整理了一份前端核心知识笔记，比较书籍更精简，一句废话都没有，这份笔记也让我通过跳槽从8k涨成20k。