[JavaScript] 배열(Array) 메서드 총정리 (map, filter, reduce 등)

JavaScript에서 배열(Array)은 데이터를 저장하고 조작하는 데 가장 많이 사용되는 자료형 중 하나입니다. 특히 다양한 배열 메서드들이 제공되어 데이터를 손쉽게 처리할 수 있습니다. 이번 포스팅에서는 자주 사용되는 배열 메서드인 map(), filter(), reduce()를 포함하여 forEach(), find(), some(), every() 등 다양한 메서드들을 예제와 함께 자세히 설명하겠습니다.

배열(Array) 메서드 총정리

---

1. 배열 메서드 기본 개념

배열이란 무엇인가?

배열은 여러 개의 값을 하나의 변수로 저장할 수 있는 데이터 구조입니다. 배열은 인덱스를 사용하여 값을 저장하거나 접근할 수 있습니다.

const fruits = ['apple', 'banana', 'cherry'];
console.log(fruits[0]);  // 출력: apple

배열 메서드란?

배열 메서드는 배열의 요소를 조작, 검색, 추가, 제거 등 다양한 작업을 수행하기 위해 제공되는 함수들입니다.

---

2. 자주 사용되는 배열 메서드

1) forEach()

각 배열 요소를 반복하며 작업을 수행합니다. 반환값은 없습니다.

const numbers = [1, 2, 3];
numbers.forEach(num => console.log(num));

2) map()

배열의 각 요소를 변환하여 새로운 배열을 반환합니다.

const numbers = [1, 2, 3];
const doubled = numbers.map(num => num * 2);
console.log(doubled);  // 출력: [2, 4, 6]

3) filter()

조건을 만족하는 요소들만 추출하여 새로운 배열을 반환합니다.

const numbers = [1, 2, 3, 4];
const evens = numbers.filter(num => num % 2 === 0);
console.log(evens);  // 출력: [2, 4]

4) reduce()

배열의 모든 요소를 하나의 값으로 줄이는 데 사용됩니다.

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((acc, num) => acc + num, 0);
console.log(sum);  // 출력: 10

 

---

3. 추가 배열 메서드

1) find()

조건을 만족하는 첫 번째 요소를 반환합니다.

const users = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 }
];

const user = users.find(user => user.age === 30);
console.log(user);  // 출력: { name: 'Bob', age: 30 }

2) some()

배열의 일부 요소가 조건을 만족하는지 확인합니다. (true/false 반환)

const numbers = [1, 2, 3];
console.log(numbers.some(num => num > 2));  // 출력: true

3) every()

모든 요소가 조건을 만족하는지 확인합니다. (true/false 반환)

console.log(numbers.every(num => num > 0));  // 출력: true

4) sort()

배열을 정렬합니다. 원본 배열을 변경합니다.

const numbers = [3, 1, 4, 2];
numbers.sort();
console.log(numbers);  // 출력: [1, 2, 3, 4]

5) concat()

두 개 이상의 배열을 병합합니다.

const arr1 = [1, 2];
const arr2 = [3, 4];
const result = arr1.concat(arr2);
console.log(result);  // 출력: [1, 2, 3, 4]

---

4. 추가 팁 및 참고 사항

• map(), filter(), reduce()는 배열을 변환하거나 새로운 배열을 생성할 때 유용합니다.
• forEach()는 단순히 요소를 반복할 때 사용하고, 값을 반환하지 않습니다.
• sort()는 숫자 정렬 시 올바르게 작동하도록 콜백 함수를 제공하는 것이 좋습니다.

numbers.sort((a, b) => a - b);  // 오름차순 정렬

---

5. 요약 및 마무리

이번 포스팅에서는 JavaScript의 배열 메서드들을 정리했습니다. map(), filter(), reduce()와 같은 고차 함수들은 배열을 변환하고 처리하는 데 유용하게 사용됩니다. 또한, find(), some(), every()는 조건에 따라 요소를 검색하거나 검사하는 데 사용됩니다. 배열을 다룰 때 각 메서드의 특징을 잘 이해하고 적절하게 사용하여 효율적인 코드를 작성하세요.

---

6. 관련 글 링크 및 태그

• 관련 글: JavaScript의 this 키워드 완벽 이해하기