✨
[Javascript] Function Declaration & Function Expression
What's This
関数宣言と関数式、どう違ってどちらを使うべきか、調査してみた。
Function Declaration
// Function Declaration
// 関数宣言の場合、関数名が重複しているとき、エラーにはならない。
// 後から宣言された方の関数によって上書きされることになる。
// 関数宣言で関数定義を行なった場合には、関数の宣言文より前に実行文を記述可能。
function calcAge1 (birthYear) {
return 2037 - birthYear;
}
const age1 = calcAge1(30);
console.log(age1);
先にCallして、後から定義する。
これでも通る。
const age1 = calcAge1(30);
function calcAge1 (birthYear) {
return 2037 - birthYear;
}
console.log(age1);
Function Expression
// Function Expression
// 関数式で関数名が重複している場合には、エラーが発生する。
// 関数式で関数定義を行なった場合には、関数定義よりも前に実行文を書くとエラーになる。
const calcAge2 = function (birthYear) { // 関数式は、実際には式なので、式が値を生み出すことに留意する。
return 2037 - birthYear; // ここの部分は、単なる値(Value)。関数は、実際には単なる値である
} // 関数は文字列や数値型といった型ではない。ただ、それであると同時に、Value であるので、変数に格納することができる。
const age2 = calcAge2(1919);
console.log(age2);
同じことを式Expressionで行おうとすると、エラーになる。
const age2 = calcAge2(1919);
const calcAge2 = function (birthYear) {
return 2037 - birthYear;
}
console.log(age2);
ReferenceError: Cannot access 'calcAge2' before initialization
結論
で、どちらを使うかという話なのだが、好みの問題だと思うので、自分は後者を使う。
最初に関数を定義した上で、呼び出す方がなんとなく綺麗ではないかと考えるからだ。
Discussion