美文网首页
call()和apply()区别

call()和apply()区别

作者: 紫气楠楠 | 来源:发表于2019-12-03 12:27 被阅读0次

定义

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

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

语法

/*apply()方法*/
function.apply(thisObj[, argArray])

/*call()方法*/
function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);

作用

改变执行上下文

什么是执行上下文

我们在写一个方法的时候,总是会用到一个关键字this,而this的指向就是我们这里所说的执行上下文(执行环境)

this指向的永远是调用该方法的对象

function test1(){
        this.num = 1
        console.log(this.num)
    }
test1()//1

上面代码中的test1是全局对象window下的一个方法,那么调用该方法的对象就是全局对象window,所以this的指向对象就应该是window,所以上面打印结果为1
在知道什么是执行上下文后,那么改变执行上下文的含义就更好理解了(函数被调用的时候, 查看this 指向哪个object, 那么那个object 就是当前的 "上下文"。按照江湖流传的说法,就是改变this指向)

改变执行上下文的意义

嗯~简单来说,就是为了方便,举个栗子:
大壮有一个电热锅,大壮的小伙伴二狗子今天想吃火锅,但二狗子没有电热锅,他又不想为吃一顿火锅再去买个电热锅,于是就借用了大壮的电热锅,这样既可以达到目的,又节省了开支,一举两得

改变执行上下文也是一样,A对象有一个方法,而B对象因为某种原因也需要用到一样的方法,那么这时候我们去借用A的方法远比再给B扩展一个同样的方法来的要划算,既可以完成需求,又能减少内存的占用,何乐而不为

异同

  1. 相同点:都能够改变方法的执行上下文(执行环境),将一个对象的方法交给另一个对象来执行,并且是立即执行

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

function test (a,b,c) {}

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

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

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

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

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

用途:对象继承

    function parent(){
        this.num = 1
        this.sun = function(){
            console.log(this.num+1)
        }
    }

    function son(){
        parent.call(this)//将this指向parent函数,继承parent内的方法和变量
        this.sun()
    }
    son()//2

son通过call方法,继承了parent的sun方法和num变量,同时son还可以扩展自己的其他方法

function son(){
        parent.call(this)//将this指向parent函数,继承parent内的方法和变量
        this.sun()
        this.p = 5
        this.fox = function(){//son自己的方法
            console.log(this.p+3)
        }
        fox()
    }
    son()//2 8

相关文章

  • this_原型链_继承

    问题1: apply、call 、bind有什么作用,什么区别? apply和call call apply,调用...

  • bind()和call()和apply()的区别

    bind()和call()和apply()的区别 首先说说call()和apply()的区别 它们都是改变this...

  • this&原型链&继承

    1.apply、call 、bind有什么作用,什么区别? apply和call apply和call都是为了改变...

  • this_原型链_继承

    this相关问题 apply、call 、bind的作用以及区别 call、apply和bind方法的用法以及区别...

  • 理解JS中的 call, apply, bind方法

    call, apply, bind 方法的目的和区别 我们常说,call(), apply(),bind()方法的...

  • js学习note4 call/apply/bind的区别*

    this指向问题,call和apply和bind的区别。call和apply接受的参数不同,结果一样:apply接...

  • 高级2:this&原型链&继承

    问题1: apply、call 、bind有什么作用,什么区别 apply、 call的作用和区别基本语法: fn...

  • 高级2 原型链 this

    this 相关问题 问题1: apply、call 、bind有什么作用,什么区别 **apply 和 call ...

  • this

    1. call, apply 有什么作用?有什么区别? call和apply用来直接指定this的绑定对象;区别是...

  • this & 原型链 & 继承

    this 相关 问题1: apply、call 、bind有什么作用,什么区别 apply()和call()方法都...

网友评论

      本文标题:call()和apply()区别

      本文链接:https://www.haomeiwen.com/subject/pitwmctx.html