Call函数

JavaScript Call和Apply方法免费看

Call()方法的使用、Apply()方法的使用

2020-06-18侠课岛    基础入门       

前端/前端必修/JavaScript 基础知识梳理 20     0     559

在 JavaScript 语言中,每个函数都有 Call()Apply() 方法。这两个方法都是在特定的作用域中调用函数,能改变函数的作用域,实际上是改变函数体内 this 的指代的对象。

Call() 方法的使用

call() 是预定义的 JavaScript 方法。call() 方法可以用来代替另一个对象调用一个方法。

语法:

call([thisObj[,arg1[, arg2[,   [,.argN]]]]])

call() 函数可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj

示例:

例如已知有一个 Person 函数和 Student 函数:

function Person(name, age){
    this.id = 1;
    this.name = "xkd";
    this.show = function(){
        console.log("call函数");
    }
}
function Play(game){
    this.game = game;
}
var play = new Play("王者荣耀");

此时如果我们用Student 函数的对象 stu 来调用 Person 函数函数中的属性和方法,肯定会报错对不对,但是如果我们使用了 call() 函数, Student函数的实例对象就可以调用 Person 函数中的属性和方法了:

function Person(name, age){
    this.name = "小飞侠";
    this.age = 18;
    this.show = function(){
        console.log("我叫" + this.name + ",今年" + this.age + "岁");
    }
}
function Play(game){
    this.game = game;
    Person.call(this);
}
var play = new Play("王者荣耀");

console.log(play.name + "喜欢玩" + play.game);   // 继承了Person中的name属性

play.show();     // 继承了Person中的play方法

输出:

小飞侠喜欢玩王者荣耀
我叫小飞侠,今年18岁

在 JavaScript 中,this 指向函数执行时的当前对象。通过 Play 实例化一个 play 对象时, Play 里面的 call)() 函数里的 this 就是 play,这个 play 带着实参通过 call() 函数传入到被调用的构造函数里,取代了被调用函数中的 this ,执行完构造函数后,将结果返回。

需要注意的是, call() 函数中的参数 this 不一定非得写成 this,任何 Object 都可以,它的目的是把被调用函数里的this改变成这个 call() 函数里所传进去的这个 this 对象。

Apply()方法的使用

apply() 方法应用某一对象的一个方法,用另一个对象替换当前对象。apply() 方法的第一个参数作用和 call() 是一样的,只不过它的第二个参数是个 args,args可以是数组或类数组,apapply() 方法把这个集合中的元素作为参数传递给被调用的函数。

语法:

apply([thisObj[,argArray]])

如果没有提供参数 thisObjargArray ,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError

示例:

我们还是使用上面这个例子,只不过call() 方法变成了 apply() 方法:

function Person(name, age){
    this.name = "小飞侠";
    this.age = 18;
    this.show = function(){
        console.log("我叫" + this.name + ",今年" + this.age + "岁");
    }
}
function Play(game){
    this.game = game;
    Person.apply(this, arguments);
}
var play1 = new Play("荒野求生");

console.log(play1.name + "喜欢玩" + play1.game);   // 继承了Person中的name属性

play1.show();     // 继承了Person中的play方法

apply() 方法作用和 call() 方法其实完全一样,唯一区别在于传参形式不一样。 call() 方法接受若干参数,而 apply() 方法接收一个包含若干参数的数组。如果要使用数组而不是参数列表,则 apply() 方法非常方便。

本教程图文或视频等内容版权归侠课岛所有,任何机构、媒体、网站或个人未经本网协议授权不得转载、转贴或以其他方式复制发布或发表。

评价

20

本课评分:
  •     非常好
难易程度:
  •     适中的

内容目录


本文索引


|
教程
粉丝
主页

签到有礼

已签到2天,连续签到7天即可领取7天全站VIP

  • 1
    +2 金币
  • 2
    +3 金币
  • 3
    +5 金币
  • 6
    +7 金币
  • 5
    +6 金币
  • 4
    暖心福利
    自选分类VIP ×1天
  • 7
    惊喜大礼

    自选分类VIP ×3天 +20金币
  • 持续签到 +8 金币

金币可以用来做什么?