[JS] for() / forEach() / map() 함수 비교

1) for()

let str = '';

for (let i = 0; i < 9; i++) {
  str = str + i;
}

console.log(str);
// Expected output: "012345678"

초깃값부터 시작해서 증가 또는 감소하면서 조건에 부합하면 계속 순회합니다. 중간에 "break;" 문을 만나면 반복문을 중단합니다.

 

2) Array.prototype.forEach()

const array1 = ['a', 'b', 'c'];

array1.forEach((element) => console.log(element));

// Expected output: "a"
// Expected output: "b"
// Expected output: "c"

배열의 각 요소에 대해 인자로 전달된 Callback 함수을 실행합니다.

 

3) Array.prototype.map()

const array1 = [1, 4, 9, 16];

// Pass a function to map
const map1 = array1.map((x) => x * 2);

console.log(map1);
// Expected output: Array [2, 8, 18, 32]

배열의 각 요소에 대해 인자로 전달된 Callback 함수를 실행하고 실행된 결과를 모은 새로운 배열을 리턴합니다.

 

정리

단순 반복이라면 for( ), 배열을 순회하려면 forEach( ), 배열을 순회 후 콜백 함수의 실행 결과를 모은 새로운 배열을 얻고 싶다면 map( ) 사용할 것을 권장합니다.