【JS】配列の値を繰り返し取り出してコンソールに書き出すいろいろな方法

いろいろある方法

Javascriptで配列の中身を繰り返し取り出す方法がいろいろあるのでメモ。

for-ofを使う方法

for-ofは配列のループに適していて、似た構文のfor-inはオブジェクトのループに適している。

const arr = ['ゴジラ','ジョーズ','ダースベイダー','アイアンマン'];

for (const name of arr) {
  console.log(name);
  console.log(`${name}さん`);
}

Link

For...of - Javascript | Mdn

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/for...of

forEach を使う方法

const arr = ['ゴジラ','ジョーズ','ダースベイダー','アイアンマン'];

arr.forEach(element => console.log(element));
arr.forEach(element => console.log(`${element}さん`));

const arr = ['ゴジラ','ジョーズ','ダースベイダー','アイアンマン'];

function getName(element) {
  console.log(element);
  console.log(`${element}さん`);
}

arr.forEach(getName);

Link

Array.prototype.foreach() - Javascript | Mdn

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

forループを使う方法

const arr = ['ゴジラ','ジョーズ','ダースベイダー','アイアンマン'];

for (let i = 0; i < arr.length; ++i) {
  console.log(arr[i]);
  console.log(`${arr[i]}さん`);
}

whileループを使う方法

const arr = ['ゴジラ','ジョーズ','ダースベイダー','アイアンマン'];
var i = 0;

while(i < arr.length){
	console.log(arr[i]);
  console.log(`${arr[i]}さん`);
	i++;
}

jQueryの$.each を使う方法

const arr = ['ゴジラ','ジョーズ','ダースベイダー','アイアンマン'];

$.each(arr, function(index, value) {
  console.log(value);
})

Link

jQueryのEachとは？配列やオブジェクトをループするeachの使い方

https://www.bold.ne.jp/engineer-club/jquery-each