JavaScript 関数
JavaScriptの関数は特定のタスクを実行するために設計されたコードブロックです。
JavaScriptの関数は、「何か」がそれを呼び出したときに実行されます。
例
// p1とp2の積を計算する関数
function myFunction(p1, p2) {
return p1 * p2;
}
JavaScript関数の構文
JavaScriptの関数はfunctionキーワードで定義され、その後に名前が続き、その後に括弧 () が続きます。
関数名には、文字、数字、アンダースコア、ドル記号(変数と同じルール)を含めることができます。
括弧内には、カンマで区切られたパラメータ名を含めることができます:
function name(parameter1, parameter2, parameter3) {
// 実行されるコード
}
関数のパラメータは、関数定義の括弧 () 内にリストアップされます。
関数引数は、関数が呼び出されたときに関数によって受け取る値です。
関数の内部では、引数(パラメータ)はローカル変数として振る舞います。
関数の呼び出し
関数の内部のコードは、「何か」が関数を呼び出すときに実行されます:
- イベントが発生したとき(ユーザーがボタンをクリックしたとき)
- JavaScriptコードから呼び出されたとき
- 自動的に(自己呼び出し)
関数の呼び出しについては、後のチュートリアルでさらに詳しく学びます。
関数の戻り値
JavaScriptがreturn文に到達すると、関数の実行は停止します。
関数がステートメントから呼び出された場合、JavaScriptは呼び出しステートメントの後にコードを「返して」実行します。
関数はしばしば戻り値を計算します。戻り値は「呼び出し元」に「返されます」:
例
// 二つの数値の積を計算し、結果を返す関数
function myFunction(a, b) {
return a * b;
}
なぜ関数を使うのか?
関数を使うことで、コードを再利用することができます。
同じコードを何度も使うことができます。
異なる引数を使って同じコードを使うことで、異なる結果を生成することができます。
()演算子
()演算子は関数を呼び出します:
例
// 華氏から摂氏に変換する関数
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
let value = toCelsius(77);
不正確なパラメータで関数にアクセスすると、不正確な答えが返されることがあります:
例
// 華氏から摂氏に変換する関数
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
let value = toCelsius();
()なしで関数にアクセスすると、関数の結果ではなく関数そのものが返されます:
例
// 華氏から摂氏に変換する関数
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
let value = toCelsius;
重要
上記の例からわかるように、toCelsiusは関数オブジェクトを参照し、toCelsius()は関数の結果を参照します。
関数を変数の値として使用する
関数は変数と同じように使うことができます。すべての種類の数式、代入、計算で使用することができます。
例
// 関数の戻り値を変数に格納する代わりに
let x = toCelsius(77);
let text = "気温は " + x + " 摂氏度です";
関数を直接、変数の値として使用することができます:
例
// 関数の戻り値を変数に格納する代わりに
let text = "気温は " + toCelsius(77) + " 摂氏度です";
関数については後のチュートリアルでさらに詳しく学びます。
ローカル変数
JavaScriptの関数内で宣言された変数は、その関数にローカルになります。
ローカル変数はその関数内からしかアクセスできません。
例
// ここではcarNameを使用できません
function myFunction() {
let carName = "Volvo";
// ここではcarNameを使用できます
}
// ここではcarNameを使用できません
ローカル変数はその関数が開始されるときに作成され、関数が完了すると削除されます。