国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

快速理解JavaScript中apply()和call()的用法和用途

chenjiang3 / 1150人閱讀

摘要：在學習之前，我們必須對的作用和使用方法有所了解，可以參考我前一篇文章快速理解中的用法與陷阱。和的作用十分相似，只是參數類型上的差別，以適應不同的使用場景。

在學習apply()之前，我們必須對this的作用和使用方法有所了解，可以參考我前一篇文章《快速理解JavaScript中this的用法與陷阱》。當然如果你已經熟悉this的相關知識，那么請直接往下看。

call()和apply()的作用十分相似，只是參數類型上的差別，以適應不同的使用場景。它們都是為了改變函數運行時的 context（上下文）而存在的，再說的直白一點，就是為了改變函數內部 this 的指向。

恩？什么？我似乎聽到你說改變this的指向？？那就是說。。。

沒錯！這樣就可以實現繼承啦！Exciting！

看下面的代碼：

以下代碼必須看過《瘋狂動物城》才可看懂（逃）

function animal(name,food) {
   this.name = name,
    this.food = food,
   this.say = function() {
        console.log(name +" likes " + this.food + ".");
   }
}

function rabbit(name,food) {
   animal.call(this,name,food);
}

var Judy = new rabbit("Judy","carrot");

Judy.say();// >>> Judy likes carrot.

可以看出，我們聲明了一個叫Judy的對象，我們并沒有在rabbit對象里添加任何屬性和方法，但是我們使用call()繼承了原本屬于animal的屬性和方法。就可以做到animal函數所有能做到的事情。

這到底是怎么做到的呢？讓我們來看看call()的參數：
第一個是一個對象，這個對象將代替Function類里原本的this對象，我們傳入的是this，記住，這個this在rabbit函數里指的是未來將要實例化這個函數的對象（我知道這有些拗口），當聲明了Judy的時候，這個this指的就是Judy。
除了第一個參數，后面所有的參數都是傳給父函數本身使用的參數。

而apply()和call()功能幾乎一樣，唯一的區別就是apply()第二個參數只能是數組，這個數組將作為參數傳給原函數的參數列表arguments。

其實在實際開發中，JS 繼承的方法并不止這一種，使用原型鏈繼承是更加常用的方式，此外還有構造函數繼承，這里不展開。而apply使用的場景，更多的使用在這樣一個場景：

需要將數組轉化為參數列表。

apply()的這個把數組轉化為參數列表的特性，可以讓它做一些有趣的事情。

例如，push()方法的參數只能是一個或者多個參數，而不能是一個數組，當我們想要將數組B拼接到數組A后面時，傳統的做法是遍歷數組B，每循環一次就push進數組A后面，這樣就浪費了push()可以傳多個參數的功能。
我們可以這樣做：

var list1 = [0,1,2];
var list2 = [3,4,5];
[].push.apply(list1,list2);

console.log(list1);// >>> [0,1,2,3,4,5]

看起來有點糊涂嗎？可以這樣理解：
list1調用了屬于數組對象的push方法，這個push方法需要傳入一個參數列表，而恰好我們有了list2這個數組類型的參數列表，實現了拼接操作。
第三行就相當于：

list1.push(3,4,5);

看，apply多么神奇！同樣的，Math對象下的max()和min()等方法都只支持參數列表而不是數組，能做什么事情，你應該猜到了吧？

此外還有許多地方apply()的這個特性帶來很多便利：比如函數式編程中的currying（柯里化），apply()都有著不可或缺的作用。

既然說到這，那下一篇文章我就帶大家認識函數柯里化。今天有點晚了，先休息啦~

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/78874.html

相關文章

  • JavaScript 函數作用域、執行環境(this)、call、apply、bind 的用法

    摘要：什么是函數的作用域函數作用域在中，作用域為可訪問變量，對象，函數的集合。函數作用域作用域在函數內修改。與函數又有什么關系呢對象是在運行時基于函數的執行環境綁定的。 什么是函數的作用域 函數作用域：在 JavaScript 中，作用域為可訪問變量，對象，函數的集合。JavaScript 函數作用域: 作用域在函數內修改。 this 與函數又有什么關系呢？ this對象是在運行時基于函數的...

    1fe1se 評論0 收藏0

  • JavaScript也玩私人訂制——玩轉函數柯里化

    摘要：而柯里化是一個屬于函數式編程的一個常見的技巧。簡單來說，函數柯里化就是對高階函數的降階處理。讓你意外的是，這就是柯里化的基本思想，簡單地讓人猝不及防。 函數式編程是一種被部分JavaScript程序員推崇的編程風格，更別說 Haskell 和 Scala 這種以函數式為教義的語言。原因是因為其能用較短的代碼實現功能，如果掌握得當，能達到代碼文檔化（代碼本身具有很高可讀性甚至可以代替文檔...

    MRZYD 評論0 收藏0

  • 「前端面試題系列6」理解函數的柯里化

    摘要：原題如下寫一個方法，當使用下面的語法調用時，能正常工作這道題要考察的，就是對函數柯里化的理解。當參數只有一個的時候，進行柯里化的處理。這其實就是函數柯里化的簡單應用。 showImg(https://segmentfault.com/img/bVbopGm?w=620&h=350); 前言 這是前端面試題系列的第 6 篇，你可能錯過了前面的篇章，可以在這里找到： ES6 中箭頭函數的...

    liaorio 評論0 收藏0

  • Know this, use this! (總結 this 的常見用法)

    摘要：而當做普通函數調用的話，實際上即第種情況下，對函數普通調用，此時的指向這是正常情況下，會正確返回并且指向該對象，但是在構造函數當中，如果返回了一個對象，那么會指向返回的那個對象。 this應該是一個討論了很久的話題了。其中，關于this的文章，在很多的博客當中也有很多介紹，但是，以前我都是一知半解的去了解它，就是看博客當中，只介紹了一些情況下的 this 的使用方式，但是也并沒有自己去...

    zorro 評論0 收藏0

  • 學習JavaScript之this,call,apply

    摘要：在全局對象中調用，自然讀取的是全局對象的值構造器調用說明作為構造器調用時，指向返回的這個對象。最直觀的表現就是，去看一些優秀框架的源代碼時，不再是被繞的暈乎乎的。 學習起因： 在之前的JavaScript學習中，this,call,apply總是讓我感到迷惑，但是他們的運用又非常的廣泛。遂專門花了一天，來弄懂JavaScript的this,call,apply。中途參考的書籍也很多，以...

    wenhai.he 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<