前言
這邊要講一個很特別的東西,在 JavaScript 沒有的,但其他程式語言有的東西以及為何它不需要重載函數 (function overloading)
重載函數
在其他的語言 C#、C、JAVA 都有一個叫重載函數的概念,這表示我能讓同一個函數擁有不同數量的參數,但 JavaScript 不行,因為函數就是物件,所以讓我們來準備看一下範例比較清楚。
首先如果我們想要用一些其他的方式來呼叫 greet 方法,但又不想每次都要傳入 languaue
,那就可以使用先前使用一個方式來傳入預設值或是使用 ES6 的預設參數來解決這個問題 ↓
1 2 3 4 5 6 7 8 9
| function greet(firstName, lastName, languaue) { languaue = languaue || 'en'; if (languaue === 'en') { console.log('Hello ' + firstName + ' ' + lastName); }; if (languaue === 'es') { console.log('Hola ' + firstName + ' ' + lastName); }; }
|
那我們呼叫的時候就可以這樣子呼叫。
1 2 3 4 5 6 7 8 9 10 11 12 13 14
| function greet(firstName, lastName, languaue) { languaue = languaue || 'en'; if (languaue === 'en') { console.log('Hello ' + firstName + ' ' + lastName); }; if (languaue === 'es') { console.log('Hola ' + firstName + ' ' + lastName); }; console.log('------'); }
greet('John', 'Doe', 'en'); greet('John', 'Doe', 'es'); greet('John', 'Doe');
|

課程也有講,如果想要函數有兩種不同的版本,我們也就可以不用傳這麼多資訊,就像這樣 ↓
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
| function greet(firstName, lastName, languaue) { languaue = languaue || 'en'; if (languaue === 'en') { console.log('Hello ' + firstName + ' ' + lastName); }; if (languaue === 'es') { console.log('Hola ' + firstName + ' ' + lastName); }; console.log('------'); }
function greetEnglish(firstName, lastName) { greet(firstName, lastName, 'en'); }
function greetSpanish(firstName, lastName) { greet(firstName, lastName, 'es'); }
greetEnglish('John', 'Doe'); greetSpanish('John', 'Doe');
|

而上面這個做法就是一個簡單處理函數呼叫的方式,另外我們可以使用 ES6 的預設參數值來給預設值 ↓
1 2 3 4 5 6 7 8 9 10 11
| function greet(firstName, lastName, languaue = 'en') { if (languaue === 'en') { console.log('Hello ' + firstName + ' ' + lastName); } if (languaue === 'es') { console.log('Hola ' + firstName + ' ' + lastName); }; }
greetEnglish('John', 'Doe'); greetSpanish('John', 'Doe','es');
|

圖源
JavaScript 全攻略:克服 JS 奇怪的部分