call()和apply()方法

call()和apply()方法

1.方法定義

說明: call和apply方法使用一個指定的this值和若干個指定的參數(shù)值的前提下調(diào)用某個函數(shù)或方法。

call和apply兩個方法其作用基本相同,但是也略微有一些區(qū)別。

比如call的語法
call([thisObj[,arg1[, arg2[, [,.argN]]]]])
而apply的語法 
apply([thisObj[,argArray]]) 

其實也就是傳遞參數(shù)不同 , call和apply第一個參數(shù)為 ** 執(zhí)行函數(shù)內(nèi)部的指針引用對象 ** 或者this,上下文什么的。
第二個參數(shù)就有點區(qū)別了 , call傳入的參數(shù)是一個個分別傳入 ,而apply是將參數(shù)以一個數(shù)組形式傳入。

2.實例


var test = {
        a: 10,
        b: 20,
        sum: function(){
            return this.a + this.b
        }
    };
var test2 = {
        a: 100,
        b: 200
    }

上面兩個對象,我想讓test2也擁有test的sum方法該怎么辦呢, 給test2增加一個sum方法? 那等于又歇了重復(fù)的代碼, 這自然是不夠優(yōu)雅
這個時候我們就可以用到call()方法了

test.sum.call(test2) // => 300

是不是很方便,這可以讓我們在很多時候節(jié)省很多時間, 不必要的重復(fù)寫相同的代碼,那么下面來說一個復(fù)雜點的

function Animal(type, legs) {
    this.type = type;
    this.legs = legs;
    this.logInfo = function() {
        console.log(this === myCat); // => false
    }
}
var myCat = new Animal('Cat', 4);
setTimeout(myCat.logInfo, 1000);

上面的代碼 , 我們創(chuàng)建了一個Animal的構(gòu)造函數(shù)并創(chuàng)造它的實例了myCat,然后再定時器里1秒后調(diào)用logInfo的方法
但是結(jié)果并不是我們想象中的那樣,為什么呢,因為在logInfo這個方法在作為參數(shù)傳遞給setTimeout時已經(jīng)從原對象上分離了,所以1秒后發(fā)生的 是一個函數(shù)調(diào)用。
那么這個logInfo作為函數(shù)調(diào)用的時候 , 它的this是全局對象,瀏覽器環(huán)境下也就是window,嚴(yán)格模式下是undefined,反正就不是myCat;

setTimeout(myCat.logInfo.call(myCat), 1000);   // => true

這樣,我們就把logInfo方法的this 又指回myCat了,得到的也就是我們想要的結(jié)果。
繼承也就如上面的例子一樣。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容