メソッド、コールバック関数【JavaScript】

f:id:morning-output:20200930081608j:plain

メソッドとは、オブジェクトに関連付けられた関数のことです。

以下、配列を操作するメソッドについてアウトプットしていきます。

f:id:morning-output:20200930084956p:plain

pushメソッドは、配列の最後に新しい要素を追加することができます。

「numbers.push(4);」によって「4」が追加されていることが分かります。

f:id:morning-output:20200930095548p:plain

forEachメソッドは、配列の中の要素を1つずつ取り出して、全ての要素に繰り返し同じ処理を行うことができます。

配列内の要素が１つずつ順番にアロー関数内の引数に代入され処理が実行されています。

f:id:morning-output:20200930103436p:plain

findメソッドとは、コールバック関数の処理部分に記述した条件式と一致する1つ目の要素を配列の中から取り出すことができます。

上の記述では、3より大きい数字の5が出力されています。findメソッドは条件に合う要素が見つかった時点で処理が終了します。「return」で条件に合う要素が戻り値になります。

また、配列の要素がオブジェクトの場合もfindメソッドは使用可能です。

f:id:morning-output:20200930104933p:plain

filterメソッドは、記述した条件に合う要素のみを取り出して新しい配列を作ります。

使い方はfindメソッドと同じです。filterメソッドの場合は1つ目の要素で処理が終了しません。

f:id:morning-output:20200930105839p:plain

mapメソッドは、配列内の全ての要素に処理を行い、その戻り値から新しい配列を作成します。上の記述では、出力された値が2倍になっています。

f:id:morning-output:20200930111051p:plain

上記のように配列のオブジェクト要素に対しても使用可能です。

const call = (引数名) => {
　// 処理
};
call(関数名);

コールバック関数とは、引数に渡される関数のことです。先ほどのメソッドでも頻出しました。記述が長くなるので{ }で改行します。

f:id:morning-output:20201001080408p:plain

「call(printYukichi);」によって引数「(callback)」に「(printYukichi)」を代入しています。その後、「callback();」で関数を呼び出しています。

f:id:morning-output:20201001083117p:plain

関数を直接引数の中で定義することもできます。動作の流れは先ほどの記述と同じです。

また、コールバック関数では、通常の引数と同じように引数を渡すこともできます。

朝活のブログ