iT邦幫忙

2023 iThome 鐵人賽

DAY 17
0
自我挑戰組

我的日常學習雜記與筆記整理系列 第 20

Day - 20 函式(四) 調用 - Function, Method

  • 分享至 

  • xImage
  •  

函式在被宣告定義的當下不會執行,而是在調用的時候被執行。

JavaScript 函式(function) 被調用的方式如下:

  1. 作為函式(functions)調用
  2. 作為方法(methods)調用
  3. 作為建構式(constructors)
  4. 透過call()apply() 方法間接調用。

調用運算式(invocation expression)

JavaScript 用來呼叫(或執行)函式或方法的語法。

函式調用運算式 :
// 函式調用的運算式一定會包含函式運算式 + 括號 + 引數運算式

f(0) // f 為函式運算式, 0 為引數運算式
Math.max(x,y,z) // Math.max() 為函式,x,y,z 是引數
a.sort(); // a.sort 沒有引數的函式

在 JavaScript 中呼叫一個函式時,會發生以下的事情:

  1. JavaScript 會計算函式運算式的值(要呼叫的函式)。
  2. JavaScript 會計算引數運算式的值(呼叫函式時傳遞的引數)。
  3. 若函式運算式的值不是一個可呼叫的物件(不是一個函式或者一個具有 call() 方法的物件),那麼 JavaScript 會拋出一個 TypeError 錯誤。
  4. 這些引數值會依序傳遞給函式定義時指定的參數。
  5. JavaScript 會執行函式的主體(函式內部的程式碼)。
  6. 若函式使用return回傳一個值,那這個值就是整個函式調用表達式的值return沒有值的話,傳回的是undefined
  7. 若函式沒有使用 return 回傳一個值,那麼值將會是 undefined
  8. 若在呼叫一個函式時提供的引數數量與函式定義的參數數量不符,JavaScript 有特定的規則來處理這種情況。
  9. 這些規則在 JavaScript 的規範中有詳細的說明。

    若提供的引數太少,那麼缺少的參數值會被賦予 undefined
    若提供的引數太多,那多餘的引數將被忽略。

方法調用與函式調用的差異

基本方法調用使用:

方法(method) 是存在於物件中的JavaScript 函式。


obj.method = funcName; // 將 funcName 函式指定給物件的 method
obj.method();  // 調用物件的方法
obj.method(x,y); // 調用有引數的物件方法

function funcName(){
	//....
}

函式主體可用 this 來參考此物件:

var calculator = {
	operandOne: 1,
	operandTwo: 2,
	plus: function(){
		// this 
		this.result = this.operandOne + this.operandTwo;
	},
	minus: function(){
		this.result = this.operandOne - this.operandTwo;
	},
	times: function(){
		this.result = this.operandOne * this.operandTwo;
	},
	divided: function(){
		this.result = this.operandOne / this.operandTwo;
	}		
};

calculator.plus();
calculator.result // 3

參考資料

  • JavaScript 大全 第六版, 歐萊禮

上一篇
Day - 19 函式(三) 函式宣告 - 規則和限制
下一篇
Day - 21 函式(五) 調用 - Method, Method Chaining 筆記
系列文
我的日常學習雜記與筆記整理30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言