あかつきのお宿

この記事は以下の動画の中に出てきたサンプルコードを載せたものです。コピペなどが必要なときに使ってください。

基本的な書き方

colors = ['赤', '緑', '青']

colors.forEach(function(color, index){
  console.log(index + '番目は' + color)
})

引数を省略した書き方

colors = ['赤', '緑', '青']

// 引数１つだけ
colors.forEach(function(color){
  console.log('色は' + color)
})

// 引数がない
colors.forEach(function(){
  console.log('ループ中・・・')
})

ループの途中で処理を中断する

colors = ['赤', '緑', '青']

// indexが1のときはconsole.logを行わない
colors.forEach(function(color, index){
  if(index == 1) {
    return;
  }

  console.log(index + '番目は' + color)
})

連想配列をforeachで回す

colors = {'赤': '#foo', '緑': '#0f0', '青': '#00f'}
keys = Object.keys(colors)

keys.forEach(function(key){
  console.log(key + 'は' + colors[key])
})

for-inで配列を回す

// 通常の配列を回す
colors = ['赤', '緑', '青']

for(index in colors){
  console.log(index + '番目は' + colors[index])
}

// 連想配列を回す
colors = {'赤': '#foo', '緑': '#0f0', '青': '#00f'}

for(key in colors){
  console.log(key + 'は' + colors[key])
}

for-ofで配列を回す

// 通常の配列を回す
colors = ['赤', '緑', '青']

for(color of colors){
  console.log('色は' + color)
}

//　連想配列を回す
colors = {'赤': '#foo', '緑': '#0f0', '青': '#00f'}
keys = Object.keys(colors)

for(key of keys){
  console.log(key + 'は' + colors[key])
}

アロー関数を使った書き方

colors = ['赤', '緑', '青']

colors.forEach((color, index) => {
  console.log(index + '番目は' + color)
})