演習課題「JavaScript の関数」
右のコードでは、determinant2
という名前の関数を定義しようとしています。
この関数は、ある 4 つの引数 x, y, z, w に対して x × w - y × z を計算するものです。
この関数を完成させてください。
また、この関数をテストするための入力として、1 行で 4 つの整数が半角スペース区切りで入力されます。
この入力に対し、実装した関数の戻り値を出力してください。
プログラムを実行して、想定通り出力されれば演習課題クリアです!
期待する出力値
-2
演習課題「JavaScript の関数 2」
今、2 つの文字列の長さの差を計算する関数 lengthDiff
を実装しようとしています。
具体的には、2 つの文字列を受け取り、その 2 つの文字列の長さの差を 0 以上の整数として返す関数にしたいと思います。
この関数をしっかり動くように定義してください。
また、この関数をテストするための入力として、2 行で 2 つの文字列が入力されます。
この入力に対し、実装した関数の戻り値を出力してください。
プログラムを実行して、想定通り出力されれば演習課題クリアです!
期待する出力値
1
#05:補習: JavaScriptの関数について
このチャプターでは、Webアプリケーションを作成する際に必要となる、JavaScriptの関数について学習します。
JavaScript における関数の定義
MDN web docs
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Functions
以下の 3 つがあります。
const a = (arg) => {
//...処理
};
const a = function(arg) {
//...処理
};
function a(arg) {
//...処理
}
本チャプターで扱ったのは
const a = (arg) => {
//...処理
};
になります。
アロー関数とも呼ばれる形式です。
左辺の
a
が関数名になり、(arg) => {
//...処理
};
が関数の本体です。
これは
const a = [
1,
2
];
のような変数の定義と同様の形ですので、関数を変数に代入していると考えるとわかりやすいでしょう。
仮引数
関数定義の際の
()
の中にある識別子は「仮引数」と呼ばれ、関数呼び出しの際に渡される値を示しています。const a = (arg) => {
console.log(arg + 1);
};
とし、
a(1);
として呼び出した場合には arg
には 1
が入っていますので、console.log(1 + 1);
が実行されます。return
関数には「戻り値」というものも存在します。
以前
const arr = [2, 2, 3];
const popped = arr.pop();
console.log(popped);
のように、
配列.pop();
の「戻り値」を確認したことがありますが、これは関数定義の際に戻り値を決めることもできます。その際には
return
というキーワードを用います。const multipleBy10 = (arg) => {
return arg * 10;
};
のように定義した場合、
const result = multipleBy10(2);
console.log(result);
とすることで
2 * 10
、すなわち 20
が戻り値として確認できます。関数の呼び出し
a(1);
のように、
()
をつけることで呼び出す(処理を実行する)ことが可能です。このとき、
()
の中に渡す値を「引数」と呼びますが、これは関数定義の ()
の中に書いた仮引数に渡されます。どの関数が何を引数にとり、何を戻り値として返すかは関数の作者が決めることです。
ライブラリを利用する際はドキュメントを確認し、自身でライブラリを作る際はドキュメントをしっかり作るようにすると良いでしょう。
MDN web docs
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
配列をソートするのに用います。
引数として二つの要素を比較する関数を渡すことができ、その結果をもとに配列のソートを行います。
関数を渡さなかった場合は Unicode のコードポイント順(いわゆる文字列の辞書順)のソートが行われます。
この場合、数値であろうとも文字列に変換されてから辞書順ソートとなります。
数値を数値としてソートするコードの例は次のようになります。
const arr = [4, 60, 53, 2, 72, 1, 3, 9, 12];
arr.sort((a, b) => {
return a - b;
})
MDN web docs
https://developer.mozilla.org/ja/docs/Glossary/Callback_function
コールバック関数は、関数に渡される関数のことです。
そのコールバック関数を受け取った関数は、その実行のどこかで受け取ったコールバック関数を実行することが期待されます。
例えば、この講座を通して出てくる次のようなものがあります。これもコールバック関数であり、router.get
は "/"
へのアクセスがあったときに、引数として受け取った関数を実行しています。
これによって、"/"
にアクセスがあった場合に res.send("index")
をする、という処理を実現しています。
router.get("/", (req, res) => {
res.send("index");
});