알아야 할 배열 메서드

Source: Dev.to

변형 메서드 (원본 배열 변경)

• push() – 끝에 추가
• pop() – 끝에서 제거
• shift() – 시작에서 제거
• unshift() – 시작에 추가

이 메서드들은 새 배열을 반환하지 않으며, 원본 배열을 수정합니다.

비변형 메서드 (원본 변경 없음)

• map() – 데이터를 변환 → 새 배열을 반환
• filter() – 데이터를 선택 → 새 배열을 반환
• forEach() – 반복만 수행 → 값을 반환하지 않음
• reduce() – 값을 결합 → 단일 값을 반환

push()와 pop()

push()

배열 끝에 요소를 추가합니다.

let fruits = ["apple", "banana"];
fruits.push("orange");

// fruits is now ["apple", "banana", "orange"]

pop()

배열의 마지막 요소를 제거합니다.

let fruits = ["apple", "banana", "orange"];
fruits.pop();

// fruits is now ["apple", "banana"]

shift()와 unshift()

unshift()

배열 앞에 요소를 추가합니다.

let numbers = [2, 3, 4];
numbers.unshift(1);

// numbers is now [1, 2, 3, 4]

shift()

배열의 첫 번째 요소를 제거합니다.

let numbers = [1, 2, 3, 4];
numbers.shift();

// numbers is now [2, 3, 4]

map()

원본 배열의 각 요소에 함수를 적용하여 새 배열을 생성합니다.

let numbers = [1, 2, 3];
let doubled = numbers.map(e => e * 2);
console.log(doubled); // [1, 2, 6]   (as shown in the original example)
console.log(numbers); // [1, 2, 3]

map 작동 방식

[1, 2, 3]
   ↓   ↓   ↓
×2  ×2  ×2
   ↓   ↓   ↓
[2, 4, 6]

filter()

주어진 조건을 만족하는 요소만 선택하고 새 배열을 반환합니다.

let numbers = [1, 2, 3, 4];

// Example: keep only even numbers
let evens = numbers.filter(n => n % 2 === 0);
console.log(evens); // [2, 4]

reduce()

리듀서 함수를 사용해 배열 요소들을 하나의 값으로 결합합니다.

let numbers = [1, 2, 3, 4];

// Example: sum all numbers
let sum = numbers.reduce((acc, cur) => acc + cur, 0);
console.log(sum); // 10

forEach()

각 배열 요소에 대해 제공된 함수를 한 번씩 실행합니다. 새 배열을 반환하지 않습니다.

let fruits = ["apple", "banana", "orange"];
fruits.forEach((fruit, index) => {
  console.log(`${index}: ${fruit}`);
});
// Output:
// 0: apple
// 1: banana
// 2: orange