Better JS Array Iteration

Javascript에서 배열을 순회하는 것은 생각보다 꽤 귀찮은 작업이다. { value: number }  를 element로 갖는 배열의 합을 구하는 전통적인 (?) 코드는 다음과 같다.

let sum = 0;
for (let i = 0; i < arr.length; ++i) {
const item = arr[i];
sum += item.value;
}
view raw 1.js hosted with ❤ by GitHub

Python에서는 아래와 같이 깔끔하게 되는데 이것 참 아쉽단 말이야.
sum = 0
for item in arr:
  sum += item["value"]
view raw 2.py hosted with ❤ by GitHub

이럴 때는 forEach를 사용해보자.

let sum = 0;
arr.forEach(function(item) {
  sum += item.value;
});
view raw 3.js hosted with ❤ by GitHub

아까보다는 훨씬 깔끔해졌음을 느낄 수 있는데, 곰곰히 생각해보면  굳이 side-effect가 있는 함수1를 쓰는게 함수형 프로그래밍스럽지 않다. 그래서 reduce를 사용하면 함수 스멜이 훨씬 강해지면서 덤으로 let조차 const로 대체할 수 있다.
const sum = arr.reduce(function(acc, item) {
  return acc + item.value;
}, 0);
view raw 4.js hosted with ❤ by GitHub

여기에 더 한 느낌과 가독성을 위해서  arrow-function을 사용하면 최종적으로 다음과 같은 코드가 나온다.
const sum = arr.reduce((acc, item) => acc + item.value, 0);
view raw 5.js hosted with ❤ by GitHub

^0^b


  1. 풩-션.. 후로시-져… 메쏘-드… 

Leave a Reply