JavaScript - 배열 하나하나 출력하기 for문, for of, forEach

배열 안의 값들을 하나씩 돌면서 전부 출력하고 싶을 때,

for 반복문

const fruits = ["apple", "banana", "lemon"];

for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

// "apple"
// "banana"
// "lemon"

 

for of 반복문

const fruits = ["apple", "banana", "lemon"];

for (let fruit of fruits) {
    console.log(fruits[i]);
}

// "apple"
// "banana"
// "lemon"

 

[ ].forEach

arr.forEach(callback(currentvalue[, index[, array]])[, thisArg])

 

forEach는 배열 안에 들어있는 각각의 요소에 정해진 함수(콜백함수)를 실행함. forEach는 두 가지 매개변수가 전달이 되는데, 하나는 콜백함수(배열값, 인덱스, 배열전체), 하나는 

const fruits = ["apple", "banana", "lemon"];

// 첫 번째 배열값만 입력하면
fruits.forEach(function (fruit, index, array) {
    console.log(fruit);          // apple, banana, lemon
});


// 두 번째 index 인자까지 입력하면
fruits.forEach(function (fruit, index, array) {
    console.log(fruit, index);   // apple 0, banana 1, lemon 2
});


// 세 번째 array까지 입력하면
fruits.forEach(function (fruit, index, array) {
    console.log(fruit, index, array);   
});
// apple 0 ["apple", "banana", "lemon"]
// banana 1 ["apple", "banana", "lemon"]
// lemon 2 ["apple", "banana", "lemon"]

 

너무 복잡하니까, 이것만 알아두기.

const fruits = ["apple", "banana", "lemon"];

// 간단하게 이렇게 쓰자
fruits.forEach((fruit) => console.log(fruit));  // apple, banana, lemon

배열 안의 값들마다 내가 전달한 함수를 출력하는구나 하고 알면 됨.