JavaScript函數 bind call apply區別

來源:互聯網
上載者:User

標籤:

1. apply calll

  在JavaScript中 call 和 apply 都是為了改變某個函數運行時上下文而存在的, 換句話說就是為了改變函數內部的this的指向。

  

  這裡我們有一個新的對象 banana對象 但是沒有say方法 我們可以通過call 或者apply用apple的say方法。

  直接傳入banana進去 使得this指向banana對象。

  apply和 call 本質上完全一樣 只是 接收的參數不一樣 call把參數(參數個數是確定的)逐個放進去。而apply的參數(參數是不確定的)放到一個數組裡面

  

  其中this 是你想指定的上下文。他可以是任何一個JavaScript對象

  JavaScript 中,某個函數的參數數量是不固定的,因此要說適用條件的話,當你的參數是明確知道數量時用 call 。

  而不確定的時候用 apply,然後把參數 push 進數組傳遞進去。當參數數量不確定時,函數內部也可以通過 arguments 這個數組來遍曆所有的參數。

2. 數組追加

  

  

   C:  類(偽)數組的使用方法

    var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));

   javascript 中存在一種名為偽數組的對象結構 比較特別的是arguments對象。 還有像調用getElementsByTagName document.childNodes之類的、

  他們返回NodeList對象都屬於偽數組。不能用Array下的push 和 pop等方法。 但是我們可以 Array.prototype.slice.call 轉換為真正的數組的帶有length屬性

  的對象 這樣domNodes就可用Array下面的所有方法。

3. 深入理解apply call

  

  上面的方法可以解決問題 但是傳入的參數個數不能確定的時候 上面的方法就失效了、 這個時候就要用到 call 和 apply 但是由於參數個數不確定 

  所以 使用apply是最好的。

  

  接下來的要求是給每一個 log 訊息添加一個"(app)"的前輟。此時我們就要想到 arguments是一個偽數組 我們首先要轉換數組。

  Array.prototype.slice.call轉換為標準的數組。 在使用數組的unshift().

  

4. JavaScript bind

  bind() 方法與 apply 和 call 很相似,也是可以改變函數體內 this 的指向。 

  MDN的解釋是:bind()方法會建立一個新函數,稱為綁定函數,當調用這個綁定函數時,綁定函數會以建立它時傳入 bind()方法的第一個參數作為 this而且無論怎麼調用 this都不會變

  傳入 bind() 方法的第二個以及以後的參數加上綁定函數運行時本身的參數按照順序作為原函數的參數來調用原函數。

 在Javascript中,多次 bind() 是無效的。更深層次的原因, bind() 的實現,相當於使用函數在內部包了一個 call / apply ,第二次 bind() 相當於再   包住第一次 bind() ,故第二次以後的 bind 是無法生效的。

  

 

  三個都是輸出81  但是bind () 方法 後面跟了一個括弧。說明 當你希望改變上下文環境之後並非立即執行 而是回調執行的時候 使用bing()方法

  而 使用call apply 會立即執行

  • apply 、 call 、bind 三者都是用來改變函數的this對象的指向的;
  • apply 、 call 、bind 三者第一個參數都是this要指向的對象,也就是想指定的上下文;
  • apply 、 call 、bind 三者都可以利用後續參數傳參;
  • bind 是返回對應函數,便於稍後調用;apply 、call 則是立即調用 。
5.  bind的詳細解釋

  bind() 最簡單的用法是建立一個函數 使這個函數不論怎麼調用都有同樣的this 值。 

   

  

 

JavaScript函數 bind call apply區別

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.