forEachメソッドを使った繰り返し処理[JavaScript]

forEachメソッドを使った繰り返し処理[JavaScript] JavaScript

「配列の要素1つ1つに同じ処理を繰り返したい」

そんなとき便利なのがforEavhメソッドです。

基本的な使い方をみていきましょう。

forEachメソッドの書き方

forEachメソッドは配列を繰り返すためのメソッドです。書き方は以下の通り。

const array = [配列のデータ];
array.forEach(コールバック関数);
例1
const animals = ['monkey', 'snake', 'cow'];
animals.forEach(function(value) {
  console.log(value);
});

例1では、配列animalsの要素を1つずつvalueに代入してconsole.logしています。

なお、forEachメソッドではbreak文やcontinue文は使えません。

コールバック関数

JavaScriptでは、関数も値として扱われます。変数に代入もできますし、別の関数の引数にすることもできます。コールバック関数とは、この「別の関数の引数になる関数」のことです。

ちなみにコールバック関数を受け取る関数のことを「高階関数」と呼びます。

例2
function add(a, b) {
  return a + b;
}

const addFunc = add; //変数に代入する場合()はつけない

例2では関数を変数に代入しています。

例3
function greet(func) {
  func('こんにちは');
}

greet(function(message) {
  console.log(message);
});

例3ではまず関数greetを定義しています。これは引数として受け取った関数に引数「こんにちは」を渡す、というものです。

その下ではgreetを呼び出しています。引数には「引数として受け取った値をconsole.logする関数」が渡されています。ちょっとややこしいですね。

出力するとどうなるかというと、「こんにちは」がmessageに代入されてconsole.logされます。このとき、関数greetは高階関数であり、function(message)はコールバック関数となります。

まとめ

  • 配列専用
  • 引数にコールバック関数をとる
  • breakやcontinueは使えない

以上がforEachメソッドの基本的な使い方です。

あなたの毎日がハッピーでありますように。

コメント

タイトルとURLをコピーしました