[JavaScriptWeird]No.31 框架小叮嚀：重載函式

發表於 | 更新於 | 分類於

前言

本篇要提的是「重載函式」，請注意這是一個 JavaScript 沒有的功能，但是JavaScript 可以利用一級函式的特性來取代。

重載函式 ( Function Overloading )

直接使用範例說明：

1
2
3
function greet(firstName, lastName, languaue){

}

這是一個函式，在其他程式語言中，都有重載函式的概念，這代表可以讓同一個函式能夠有不同數量的參數，但在 JavaScript 不能這麼做，因為JavaScript 的函式就是物件，不過我們也可以利用 JavaScript 的一級函式概念來處理這些問題。

像是以本例來說，假如我們「不想要每次都傳入 languaue」
我們已經看過可以使用 ES6 的預設參數或者使用 || 運算子，然後用邏輯運算來決定什麼情況用什麼語言。

1
2
3
4
5
6
7
8
9
10
11
12
function greet(firstName, lastName, languaue = 'en'){  
  if (languaue === 'en'){  
    console.log('Hello ' + firstName + ' ' + lastName);  
  }  
  if (languaue === 'es'){  
    console.log('Hola ' + firstName + ' ' + lastName);  
  }  
}

greet('John','Doe','en'); // Hello John Doe  
greet('John','Doe','es'); //Hola John Doe  
greet('John','Doe'); // Hello John Doe

當然也還有其它的方式，像是再包一層函式處理

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function greet(firstName, lastName, languaue){  
  if (languaue === 'en'){  
    console.log('Hello ' + firstName + ' ' + lastName);  
  }  
  if (languaue === 'es'){  
    console.log('Hola ' + firstName + ' ' + lastName);  
  }  
}

function greetEnglish(firstName, lastName){  
  greet(firstName, lastName, 'en');  
}

function greetSpanish(firstName, lastName){  
  greet(firstName, lastName, 'es');  
}

greetEnglish('John', 'Doe');  
greetSpanish('John', 'Doe');

也就是說，雖然 JavaScript 沒有重載函式的概念，但是可以透過其它的方式來處理這一塊，所以不用太擔心。

0%