using map versus for iteration

map-vs-for.js

var foods = [
  { name: 'brocolli', type: 'vegetable' },
  { name: 'spinach', type: 'vegetable' },
  { name: 'apple', type: 'fruit' },
  { name: 'tomato', type: 'fruit' },
  { name: 'bread', type: 'grain' },
  { name: 'beef', type: 'meat' },
  { name: 'chicken', type: 'meat' },
]

// for iteration
var names = []
for (var i = 0; i < foods.length; i++ ) {
  names.push(foods[i].name)
}

// map es5
var names = foods.map(function(food){
  return food.name
})

// map es6
let names = foods.map((food) => return food.name) //one liners do not require 'return'

// final functional form
let names = foods.map((x) => x.name)