函數(shù)原型中的 call 和 apply 方法的區(qū)別

tinna 發(fā)布于2019-08-26 14:06 / 1299人閱讀

摘要：都屬于的方法它們是在引擎內(nèi)在實(shí)現(xiàn)的，因?yàn)閷儆?，所以每個(gè)對(duì)象實(shí)例，也就是每個(gè)方法都有屬性。與調(diào)用參數(shù)不同不同之處在于調(diào)用函數(shù)時(shí)，參數(shù)可以使用數(shù)組要求明確列出參數(shù)。助記法的表示即數(shù)組而的表示即逗號(hào)。

call, apply都屬于Function.prototype的方法

它們是在 JavaScript 引擎內(nèi)在實(shí)現(xiàn)的，因?yàn)閷儆贔unction.prototype，所以每個(gè)Function對(duì)象實(shí)例，也就是每個(gè)方法都有call, apply屬性。它們的作用一樣，只是使用方式不同。

call 與 apply 調(diào)用參數(shù)不同

不同之處在于調(diào)用apply函數(shù)時(shí)，參數(shù)可以使用數(shù)組; call要求明確列出參數(shù)。

助記法: Apply 的A表示 Array, 即數(shù)組, 而 Call 的 C 表示 Comma, 即逗號(hào)。

更多請(qǐng)參閱MDN的文檔。

偽語法：

theFunction.apply(valueForThis, arrayOfArgs)
theFunction.call(valueForThis, arg1, arg2, ...)

從ES6開始，還有展開spread數(shù)組與該call功能一起使用的可能性，你可以在這里看到兼容性。

示例代碼：

function theFunction(name, profession) {
    console.log("My name is " + name + " and I am a " + profession +".");
}
theFunction("John", "fireman");
theFunction.apply(undefined, ["Susan", "school teacher"]);
theFunction.call(undefined, "Claude", "mathematician");
theFunction.call(undefined, ...["Matthew", "physicist"]); // 使用展開語法

搞這么復(fù)雜，直接調(diào)用函數(shù)不好嗎？

主要是為了模擬面向?qū)ο?，?duì)狀態(tài)進(jìn)行封裝的同時(shí)，不同實(shí)例可以有不同的內(nèi)部狀態(tài)，如：

var module = {
  x: 42,
  getX: function() {
    return this.x;
  }
}

var unboundGetX = module.getX;
console.log(unboundGetX()); // 函數(shù)在全局范圍內(nèi)調(diào)用，this=window
// 會(huì)輸出: undefined， 因?yàn)閣indow下沒有定義x
unboundGetX.call(module) //輸出 42, 或使用 bind 也有同樣的效果
var module1 ={
   x:123,
   getX: unboundGetX  //this 變?yōu)閙odule1
}
module1.getX() //返回123

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/110037.html

相關(guān)文章

理解 JavaScript call()/apply()/bind()

摘要：理解文章中已經(jīng)比較全面的分析了在中的指向問題，用一句話來總結(jié)就是的指向一定是在執(zhí)行時(shí)決定的，指向被調(diào)用函數(shù)的對(duì)象。與和直接執(zhí)行原函數(shù)不同的是，返回的是一個(gè)新函數(shù)。這個(gè)新函數(shù)包裹了原函數(shù)，并且綁定了的指向?yàn)閭魅氲摹? 理解 JavaScript this 文章中已經(jīng)比較全面的分析了 this 在 JavaScript 中的指向問題，用一句話來總結(jié)就是：this 的指向一定是在執(zhí)行時(shí)決定的，...

duan199226 2019-08-23 14:27 評(píng)論0 收藏0
【JavaScript】call與apply兄弟列傳

摘要：具體可參考下面代碼定義到原型鏈上的方法這里沒有繼承父類中的方法張三張三太史公曰總結(jié)一下與兄弟倆的任務(wù)使用一個(gè)指定的值和若干個(gè)指定的參數(shù)值的前提下調(diào)用某個(gè)函數(shù)或方法。本篇人物小傳自此結(jié)束。在JavaScript中，有這么倆貨，一個(gè)叫call,一個(gè)叫apply，它們倆工作幾乎一毛一樣，但是也有所區(qū)別，曾經(jīng)對(duì)這個(gè)知識(shí)點(diǎn)非常困惑，看過幾篇博客也沒搞清楚這哥倆到底打算要干個(gè)啥，直到某天仔細(xì)研究...

tuniutech 2019-08-22 10:38 評(píng)論0 收藏0
詳解call bind apply - 區(qū)別/使用場景/es6實(shí)現(xiàn)/es3實(shí)現(xiàn)

摘要：的區(qū)別接收數(shù)組一連串參數(shù)返回一個(gè)函數(shù)的使用場景將類數(shù)組含有屬性的對(duì)象轉(zhuǎn)化為數(shù)組類數(shù)組例如通過獲取的元素含有屬性的對(duì)象具有屬性，并且可以通過下標(biāo)來訪問其中的元素，但是沒有中的等方法。 call,apply,bind的區(qū)別 apply接收數(shù)組 func.apply(obj, [arus]) call一連串參數(shù) func.call(obj, param1, param2....) bind...

Alex 2019-08-23 17:07 評(píng)論0 收藏0
【面試篇】寒冬求職季之你必須要懂的原生JS(上)

摘要：循環(huán)可以使用的范圍包括數(shù)組和結(jié)構(gòu)某些類似數(shù)組的對(duì)象對(duì)象，以及字符串。只能遍歷數(shù)組，不能中斷，返回值是修改后的數(shù)組。除了之外，等，也有同樣的問題。聲明一個(gè)只讀的常量。這在語法上，稱為暫時(shí)性死區(qū)。暫時(shí)性死區(qū)也意味著不再是一個(gè)百分百安全的操作。互聯(lián)網(wǎng)寒冬之際，各大公司都縮減了HC，甚至是采取了裁員措施，在這樣的大環(huán)境之下，想要獲得一份更好的工作，必然需要付出更多的努力。一年前，也許你搞清楚閉包...

AlphaWatch 2019-05-23 16:25 評(píng)論0 收藏0
【面試篇】寒冬求職季之你必須要懂的原生JS(上)

摘要：只能遍歷數(shù)組，不能中斷，返回值是修改后的數(shù)組。這在語法上，稱為暫時(shí)性死區(qū)。作用域鏈無論是還是查詢，都會(huì)在當(dāng)前的作用域開始查找，如果沒有找到，就會(huì)向上級(jí)作用域繼續(xù)查找目標(biāo)標(biāo)識(shí)符，每次上升一個(gè)作用域，一直到全局作用域?yàn)橹埂? 互聯(lián)網(wǎng)寒冬之際，各大公司都縮減了HC，甚至是采取了裁員措施，在這樣的大環(huán)境之下，想要獲得一份更好的工作，必然需要付出更多的努力。一年前，也許你搞清楚閉包，this，原...

寵來也 2019-08-23 16:49 評(píng)論0 收藏0