JavaScript에서 배열 순회하기: 다양한 루프 방법과 활용 6가지

JavaScript에서 배열을 효과적으로 다루기 위해서는 배열을 순회하는 방법에 대해 알고 있어야 합니다. 이 글에서는 기본적인 for 루프부터 다양한 메서드를 활용한 순회까지, JavaScript에서 배열을 다루는 다양한 방법을 살펴보겠습니다.

Table of Contents

1. for 루프

가장 전통적인 방법 중 하나인 for 루프를 사용하여 배열을 순회할 수 있습니다.

const myArray = [1, 2, 3, 4, 5];

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

for 루프는 배열의 인덱스를 활용하여 각 요소에 접근하는 방식입니다.

forEach() 메서드는 각 배열 요소에 대해 주어진 함수를 실행합니다.

const myArray = [1, 2, 3, 4, 5];

myArray.forEach(function(element) {
  console.log(element);
});

forEach()는 가독성이 좋고 간편하게 사용할 수 있는 방법 중 하나입니다.

for…of 루프는 배열의 값을 직접 가져와서 사용할 수 있는 간편한 방법입니다.

const myArray = [1, 2, 3, 4, 5];

for (const element of myArray) {
  console.log(element);
}

이는 for 루프의 간결한 버전으로, 더 가독성이 좋습니다.

for…in 루프는 배열보다는 객체의 속성을 순회할 때 주로 사용됩니다. 배열에 사용할 경우 배열의 순서가 보장되지 않을 수 있으므로 주의가 필요합니다.

const myArray = [1, 2, 3, 4, 5];

for (const index in myArray) {
  console.log(myArray[index]);
}

map() 메서드는 각 요소에 주어진 함수를 적용하고, 새로운 배열을 반환합니다.

const myArray = [1, 2, 3, 4, 5];

myArray.map(function(element) {
  console.log(element);
});

map()은 새로운 배열을 반환하기 때문에 원본 배열을 변경하지 않습니다.

reduce() 메서드는 배열의 각 요소에 대해 주어진 함수를 실행하고 누적된 결과를 반환합니다.

const myArray = [1, 2, 3, 4, 5];

const sum = myArray.reduce(function(acc, element) {
  return acc + element;
}, 0);

console.log(sum);

reduce()를 사용하면 배열의 요소를 합치거나 복잡한 계산을 할 수 있습니다.

이러한 다양한 배열 순회 방법 중에서는 상황과 요구에 맞게 선택하여 사용하는 것이 중요합니다. 코드의 가독성과 효율성을 고려하여 적절한 방법을 선택하여 JavaScript에서 배열을 효과적으로 다뤄보세요.