1. 程式人生 > >Javascript中call()方法和apply()方法的作用與區別

Javascript中call()方法和apply()方法的作用與區別

形式 時速 有效 let 調用函數 ply lane pan arguments

ECMAScript規範所有函數都包含兩個非繼承的方法,分別為call()和apply(),這兩個函數都是在特定的作用域中調用函數,能改變函數的作用域,實際上是改變函數體內“this”的指代的對象。

call(thisObject[,arg1,arg2,arg3...]):

釋義:應用某一對象的一個方法,用另一個對象替換當前對象。

說明:call方法可以用來代替另一個對象調用一個方法,call方法將一個函數對象上下文從初始的上下文改變為thisObj指定的新對象,如果沒有提供thisObject參數,那麽Global對象被用於thisObject。

apply(thisObject[,argArray])

釋義:調用對象的一個方法,另一個對象替換當前對象。

說明:如果argArray不是一個有效數組或不是arguments對象,那麽將導致一個
TypeError,如果沒有提供argArray和thisObj任何一個參數,那麽Global對象將用作thisObj。

二者區別:

兩者傳遞的參數不同,call傳遞的參數時一一列舉出來的,apply傳遞參數形式是數組。

二者作用:

1、調用函數,傳遞參數

    function
add(x, y) { return x + y; } function myAddCall(x, y) { return add.call(this, x, y); } function myAddApply(x, y) { return add.apply(this, [x, y]); } console.log(myAddCall(10, 20)); //輸出結果30 console.log(myAddApply(20, 20)); //輸出結果40

2、改變函數的作用域

var name = ‘Lilei‘;

    var obj = {name:‘Hmm‘};

    function Student() {
        return this.name;
    }

    console.log(Student.call(this));    //輸出Lilei

    console.log(Student. call(obj));    //輸出Hmm

3、模擬java中類的繼承

    function Flyer(fname,speed){
      this.fname=fname;
      this.speed=speed;
      this.fly=function(){
        console.log(this.fname+"以時速:"+this.speed+"飛行");//如果用到父對象的構造方法,構造方法不能放到原型對象中,因為子類型的__proto__與父類型的prototype無關
      }
}
function Plane(fname,speed,capacity) {
      this.capacity=capacity;
      Flyer.call(this,fname,speed);
      delete this.fly;//如果父類型中有與之同名的構造函數,則需要先刪除父對象中的構造函數
      this.fly=function(){
        console.log(this.fname+"搭載"+this.capacity+"名乘客以時速:"+this.speed+"飛行");
      }
}
var A380=new Plane("A380",1000,555);

  

Javascript中call()方法和apply()方法的作用與區別