[JS] 맨날 까먹는 for 반복 관련 문법 다시 총정리

돌고돌아

<기본 arr>

let arr = [1, 2, 3, 4, 5];

<기본 obj>

let obj = {a: 1, b: 2, c: 3};

 

1. for loop : 자유롭게 정해서 순회

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

 

2. for of : 배열의 각 요소 순회 (배열)

for (let val of arr) {
  console.log(val);
}

 

3. for in : 객체의 각 key 순회 (객체)

for (let key in obj) {
  console.log(key, obj[key]);  // a 1, b 2, c 3
}

 

4. .forEach() : 함수형 프로그래밍 스타일을 따른다. (배열)

arr.forEach(function(val, index) {
  console.log(val);  // 1, 2, 3, 4, 5
});

 

5. .map() : 함수형 프로그래밍 스타일을 따르며, 새배열을 반환하여 원본 배열의 불변성을 지켜준다. (배열)

let newArr = arr.map(function(val) {
  return val * 2;
});

 

6. .filter() : 함수형 프로그래밍 스타일을 따르며, 필터링된 결과를 반환하여 원본 배열의 불변성을 지켜준다. (배열)

let evenArr = arr.filter(function(val) {
  return val % 2 === 0;
});
console.log(evenArr);  // [2, 4]

 

7. .reduce() : 함수형 프로그래밍, 불변성 지켜줌, 누산기. 배열의 모든 요소에 대해 함수를 적용하고, 단일 출력 값(누적값)을 생성한다. 

let sum = arr.reduce(function(total, val) {
  return total + val;
}, 0);
console.log(sum);  // 15