apply与call

Posted 2021-03-13 知一以天

红色字体需要视频讲解分析

 

call:

function.call(obj[,arg1[, arg2[, [,.argN]]]]])

　　

• 调用call的对象必须是个函数function
• call的第一个参数将会是function改变上下文后指向的对象，也就是上面例子里的小刚，也就是上上面例子里的老婆大人，如果不传，将会默认是全局对象window
• 第二个参数开始可以接收任意个参数，这些参数将会作为function的参数传入function
• 调用call的方法会立即执行

apply:

function.apply(obj[,argArray])

与call方法的使用基本一致，但是只接收两个参数，其中第二个参数必须是一个数组或者类数组，这也是这两个方法很重要的一个区别

 

相同点

都能够改变方法的执行上下文（执行环境），将一个对象的方法交给另一个对象来执行，并且是立即执行

 

不同点

call方法从第二个参数开始可以接收任意个参数，每个参数会映射到相应位置的func的参数上，可以通过参数名调用，但是如果将所有的参数作为数组传入，它们会作为一个整体映射到func对应的第一个参数上，之后参数都为空

function func (a,b,c) {}

func.call(obj, 1,2,3)
// function接收到的参数实际上是 1,2,3

func.call(obj, [1,2,3])
// function接收到的参数实际上是 [1,2,3],undefined,undefined

　　

apply方法最多只有两个参数，第二个参数接收数组或者类数组，但是都会被转换成类数组传入func中，并且会被映射到func对应的参数上

 

func.apply(obj, [1,2,3])
// function接收到的参数实际上是 1,2,3

func.apply(obj, {
    0: 1,
    1: 2,
    2: 3,
    length: 3
})
// function接收到的参数实际上是 1,2,3

　　

两个方法该如何选择？

跟简单，根据你要传入的参数来做选择，不需要传参或者只有1个参数的时候，用call，当要传入多个对象时，用apply

或者，如果需要传入的参数已经是一个数组或者类数组了，就用apply，如果还是单独的需要逐个传入的，可以考虑使用call（如果你不嫌麻烦的话 ）

【其他用途——对象继承】

由于可以改变this的指向，所以也就可以实现对象的继承

function superClass () {
    this.a = 1;
    this.print = function () {
        console.log(this.a);
    }
}

function subClass () {
    superClass.call(this);
    this.print();
}

subClass();
// 1

　　

subClass通过call方法，继承了superClass的print方法和a变量，同时subClass还可以扩展自己的其他方法

 

 

数组与类数组小科普

数组我们都知道是什么，它的特征都有哪些呢？

1. 可以通过角标调用，如 array[0]
2. 具有长度属性length
3. 可以通过 for 循环和forEach方法进行遍历

类数组顾名思义，具备的特征应该与数组基本相同，那么可以知道，一个形如下面这个对象的对象就是一个类数组

var arrayLike = {
    0: ‘item1‘,
    1: ‘item2‘,
    2: ‘item3‘,
    length: 3
}

　　

类数组arrayLike可以通过角标进行调用，具有length属性，同时也可以通过 for 循环进行遍历

我们经常使用的获取dom节点的方法返回的就是一个类数组，在一个方法中使用 arguments关键字获取到的该方法的所有参数也是一个类数组

但是类数组却不能通过forEach进行遍历，因为forEach是数组原型链上的方法，类数组毕竟不是数组，所以无法使用