iT邦幫忙

2024 iThome 鐵人賽

DAY 11
0
佛心分享-刷題不只是刷題

30 天克服前端面試系列 第 11

Day 11 - 請說明 JavaScript 中.call 和 .apply 的差異為何?

  • 分享至 

  • xImage
  •  

.call.apply 都可以直接呼叫函式並且改變函式內 this 的指向,兩者最主要的差異是傳入的參數形式不同。

.call

  • 定義:.call 方法會立即執行函式,並將 this 指向傳入的第一個參數,接下來的參數是要傳給函式的具體值,一個一個地傳入。
  • 參數形式:.call是 逐個傳入參數的。
  • fn.call(thisArg, arg1, arg2, ...)
  • 使用時機:所有參數的數量,並且想逐個傳遞。
function order(food, count) {
  console.log(this.name, "點了", food, count);
  //Ashley 點了 豚骨拉麵 一份
}
const person = {
  name: "Ashley",
};
order.call(person, "豚骨拉麵", "一份");

在這個例子中,this 被設定為 person,並且 food 和 count 是逐個傳入的。

.apply

  • 定義:.apply.call 類似,也會立即執行函式,並將 this 指向傳入的第一個參數。但是,接下來的參數必須以陣列的形式傳遞。
  • 參數形式:.apply 是用 陣列 傳遞參數的。
  • fn.apply(thisArg, [arg1, arg2, ...])
  • 使用時機:參數是以陣列的形式存在,或者數量不確定時。
function order(food, count) {
  console.log(this.name, "點了", food, count);
  //Andy 點了 沾麵 兩份
}
const person = {
  name: "Andy",
};
order.apply(person, ["沾麵", "兩份"]);

在這個例子中,this 被設定為 person,而參數 food 和 count 是以陣列的形式傳遞。


本文同步於此


上一篇
Day 10 - 請描述 JavaScript 中 null, undefined 和 undeclared 的差異為何?
下一篇
Day 12 - 請說明 closure 閉包是什麼?如何應用?
系列文
30 天克服前端面試16
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言