【Javascript】配列を順次処理する方法(forEachの使い方)
この記事では、配列の要素を順次処理する方法について説明します。
forEachの基本的な呼び出し方は以下のとおりです。
js
let array = ['html', 'css', 'js', 'java', 'php', 'python'];
array.forEach(function(val){
console.log(val);
});
実行結果は以下のとおりです。
実行結果
html
css
js
java
php
python
基本的には順次処理した結果を受け取ることはできません。
以下のようにreturnしてもundefindが返るだけです。
js
let array = ['html', 'css', 'js', 'java', 'php', 'python'];
let result = array.forEach(function(val){
return val;
});
console.log(result);//undefined
forEach内で別メソッドを呼び出して処理するには次のように記述します。
js
let array = ['html', 'css', 'js', 'java', 'php', 'python'];
array.forEach(function(val){
kantan(val);
});
function kantan(val){
let moji = "は簡単";
console.log(val + moji);
}
実行結果
htmlは簡単
cssは簡単
jsは簡単
javaは簡単
phpは簡単
pythonは簡単
定義済みのメソッドを呼び出したい場合は、function内で呼び出さずにいきなり呼び出すこともできます。
js
let array = ['html', 'css', 'js', 'java', 'php', 'python'];
array.forEach(val => kantan(val));
function kantan(val){
let moji = "は簡単";
console.log(val + moji);
}
実行結果
htmlは簡単
cssは簡単
jsは簡単
javaは簡単
phpは簡単
pythonは簡単
forEach内であればメソッドの戻り値を別メソッドに渡すこともできます。
js
let array = ['html', 'css', 'js', 'java', 'php', 'python'];
array.forEach(function(val){
let result = kantan(val);
let result2 = desu(result);
console.log(result2);
});
function kantan(val){
let moji = "は簡単";
return val + moji;
}
function desu(val){
let moji = "です。";
return val + moji;
}
実行結果
htmlは簡単です。
cssは簡単です。
jsは簡単です。
javaは簡単です。
phpは簡単です。
pythonは簡単です。
以上で記事の解説はお終い！
HTML、CSS、JavaScriptをもっと勉強したい方にはUdemyがオススメ！同僚に差をつけよう！