[JavaScript]JavaScriptでforeachする方法とアロー関数

たいていのプログラミング言語にはforeachという命令文があって、配列の全要素をスキャンすることができる。しかし、JavaScriptにはそういう命令は無い。

えっ？　じゃあJavaScriptでforeachしたいときはどうするの？　配列の要素の個数を調べてfor文でループさせるの？

まあ、そういうやり方もできるが、JavaScriptでは独立した命令文としてではなく、配列オブジェクトに備わっているforeachメソッドを使用する。

//配列
var my_car = 
[
    {
        'maker'     : 'MAZDA',
        'model'     : 'DEMIO',
        'grade'     : 'XD L pakage'
    },
    {
        'maker'     : 'Peugeot',
        'model'     : '206',
        'grade'     : 'XT'
    },
    {
        'maker'     : 'Rover',
        'model'     : 'MINI',
        'grade'     : 'Cooper 35th Anniversary'
    }
];

//foreachメソッドで配列の全要素をスキャン
my_car.forEach(function (value, index, array){
    console.log(index + " : " + value['maker'] + ' : ' + value['model'] + ' : ' + value['grade']);
});

上記のコードを実行するとコンソールに配列の内容が出力される。

foreachメソッドの引数には、配列要素、インデックス、配列自身（例ではvalue,index,array）を引数とする関数を渡す。その関数の中で配列の各要素の対する処理を記述する。例では無名関数を使ってその場でコードを記述しているが、別で定義した関数を渡しても良い。

余談だが、無名関数はアロー関数と言う形式で記述することもできる。アロー関数は”function”というキーワードを使わずに”=>”という矢印のような記号を使う。書き方は以下の通り。

(引数,引数) => { コード }

最初の例のforeachに渡す無名関数をアロー関数で書き直すと次のようになる。

my_car.forEach((value, index, array)=>{
    console.log(index + " : " + value['maker'] + ' : ' + value['model'] + ' : ' + value['grade']);
});

“function”と”=>”、どちらの書き方でも実行結果は同じになる。

コメントを残す コメントをキャンセル

コメントを残すコメントをキャンセル