[筆記] JavaScript 的基本觀念 – 14 – call()、apply() 與 bind()

Call, apply 和 bind 這三個內建函式,主要是用於設定 this 的範圍。當你呼叫一個函式時,你可以藉機改變 this 的範圍,將你想要的參數傳入。在你撰寫一些數學運算函式時,可以省去你重複撰寫的麻煩。
javascript es6 logo


課程對應章節

Course 50 ~ Course 52 (全部一共有 85 Courses)

請注意:本系列文章為個人對應課程的消化吸收後,所整理出來的內容。換言之,並不一定會包含全部的課程內容,也有可能會添加其他資源來說明。課程連結網址:http://tinyurl.com/w7vrql6

內容

1. 這三者在呼叫時,都會將第一個傳入的物件當作 this 的新範圍。
2. 物件本身內的 this,會是指向物件本身。不過若你是在函數內使用 this,在預設的情況下,會指向 global object。這在使用上會容易造成誤解和困擾。
3. 若你在物件內的某項的回傳函式內,使用了 this,那麼 JavaScript 會將這個 this 指向 global object。因此,你會看見像是 self = this ,這樣的用法出現在物件中,就是為了保存當下 this 指向物件本身的狀態。
4. bind() :可在 function 後方直接使用,並代入新的物件當作 this 的新範圍。
5. call():第一個引數是新的物件範圍,後面可以緊接代入函數所需的(預設)參數。換言之,你不一定要給定所有參數,你可以用這個特性造出許多架構類似的函式,而不用一直重複撰寫。
6. apply():跟 call() 很像,但後頭的參數要以 array 代入。
7. bind()僅複製原本的函式架構,所以要啟用還是要加上()。不過 call() 和 apply () 則是會主動執行,所以就不用加 ()。


JavaScript 全攻略系列文章

  • [筆記] JavaScript 的基本觀念 – 20 – something new 新玩意
  • [筆記] JavaScript 的基本觀念 – 19 – 檢視 / 建立框架 view & build a framework
  • [筆記] JavaScript 的基本觀念 – 18 – 其他 miscellaneous
  • [筆記] JavaScript 的基本觀念 – 16 – new 和 constructor function 函數建構子
  • [筆記] JavaScript 的基本觀念 – 15 – prototype, reflection & extend
  • [筆記] JavaScript 的基本觀念 – 13 – Closure 閉包
  • [筆記] JavaScript 的基本觀念 – 12 – IIFE
  • [筆記] JavaScript 的基本觀念 – 11 – Array, Syntax, Semicolon
  • [筆記] JavaScript 的基本觀念 – 10 – this
  • [筆記] JavaScript 的基本觀念 – 9 – 函數與物件 Function and Object
  • [筆記] JavaScript 的基本觀念 – 8 – Boolean & if/else
  • [筆記] JavaScript 的基本觀念 – 17 – 內建函數建構子
  • [筆記] JavaScript 的基本觀念 – 7 – 運算子
  • [筆記] JavaScript 的基本觀念 – 6 – 型別
  • [筆記] JavaScript 的基本觀念 – 5 – Asynchronous
  • [筆記] JavaScript 的基本觀念 – 4 – Variable Environment
  • [筆記] JavaScript 的基本觀念 – 3 – Execution Stack
  • [筆記] JavaScript 的基本觀念 – 2 – undefined
  • [筆記] JavaScript 全攻略:克服 JS 的奇怪部分
  • [筆記] JavaScript 的基本觀念 – 1 – Hoisting
  • 按讚加入粉絲團

    延伸閱讀