javascript對象不徹底探索記錄02:瘋狂打call!給誰打call?打什麼call?

舒適提示:做者的爬坑記錄,對你等大神徹底沒有價值,別在我這浪費生命
舒適提示-續:打call本來是屬於咱們偶像宅文化中的專業名詞,指的是飯們在看live時在臺下配合愛豆演出的節奏喊口號,舉例:「超絕可愛~TJY!!!」如今被各類濫用,我很蛋疼javascript

在javascript中有兩個常被提起的神奇函數,傳說中的call()apply()先看看文檔中的定義
JavaScript標準庫 - Function.prototype.call()
JavaScript標準庫 - Function.prototype.apply()java

call() 方法調用一個函數, 其具備一個指定的this值和分別地提供的參數(參數的列表)。
注意:該方法的做用和 apply() 方法相似,只有一個區別,就是call()方法接受的是若干個參數的列表,而apply()方法接受的是一個包含多個參數的數組。

從上面段話,我get到兩點:1.這不是人話 2.貌似整明白call()就約等於整明白apply()
那我就一條一條攻略吧segmentfault

call誰?給誰打call?

語法
fun.call(thisArg, arg1, arg2, ...)

參數
thisArg:
在fun函數運行時指定的this值。須要注意的是,指定的this值並不必定是該函數執行時真正的this值,若是這個函數處於非嚴格模式下,則指定爲null和undefined的this值會自動指向全局對象(瀏覽器中就是window對象),同時值爲原始值(數字,字符串,布爾值)的this會指向該原始值的自動包裝對象。
arg1, arg2, ...:
指定的參數列表。數組

返回值
返回值是你調用的方法的返回值,若該方法沒有返回值,則返回undefined。瀏覽器

參考文檔中的說明,咱們能夠這樣理解,call()的做用實際上就是在改變函數運行的this結合call的詞面意思來理解,就是喊來thisArg來做爲funthis,直白點能夠理解爲,老王有洗衣服的這個方法,他給老張打電話讓他來洗衣服,老張自己是(maybe)不會洗衣服的,可是由於這通電話他就要去洗了。app

這樣就好理解了,call()的兩個(類)參數,第一個是要執行函數/洗衣服的this(對象)/老張,從第二個開始是這個函數的參數/要洗哪些衣服,而返回值就是這個方法自己的返回值/涼到陽臺函數

再往簡單的理解一下,call()的執行,其實就是在執行fun自己,只不過改變了執行這個函數的對象(this)this

怎麼call?

弄明白(maybe)call()的定義以後,腦中又浮現出了那個陰魂不散的題目prototype

var name = "The Window";
var object = {
  name : "My Object",
  getNameFunc : function(){
    return function(){
      return this.name;
    };
  }
};
alert(object.getNameFunc()());//The Window

詳情在個人另外一片文章javascript對象不徹底探索記錄01:this! which?- lskrat
這題讓人懵逼的緣由,就是這裏面的this究竟是which,出現「The Window」的緣由說究竟是由於執行object.getNameFunc()的是Window對象code

因此爲了可以獲得期待的結果,是否是能夠經過call()喊來object本身來執行呢,這就試試!

alert(object.getNameFunc().call(object));//My Object

真是效果拔羣到想爲call()打call!如此顯著的療效,都能用在哪呢?

打什麼call?

我就來試着總結一下call()都有什麼用處吧//本章節陸續補充

1.防止懵逼,指定this
這條的來源,看過上文就都知道了,對this目標懵逼的同窗們,能夠用call()來直接指定this,就讓來執行!
舉例:見上文

2.實現繼承
繼承,做爲面嚮對象語言的基礎特性,在javascript中有不少的實現方式,其中一種就是用call()

function Food(name, price) {
    this.name = name,
    this.price = price,
    this.getPrice = function() {
        console.log("吃一份" + this.name + "須要" + this.price + "塊錢!貧窮使的我保持身材")
    }
}

function RouJiaMo() {
    Food.call(this, "肉夾饃", 5);
}

var rouJiaMo = new RouJiaMo()
rouJiaMo.getPrice();//吃一份肉夾饃須要5塊錢!貧窮使得我保持身材

在建立實例rouJiaMo時,將Food()中的this換成了RouJiaMo,這也就在使得rouJiaMo不但能夠擁有和Food中同樣的內部變量並賦值,而且能夠調用其內部函數,從而造成了繼承

相關文章
相關標籤/搜索