자바스크립트의 map 메서도

 

 

map은 자바스크립트의 배열 메서드 중 하나로, 배열의 각 요소를 하나씩 꺼내 특정 작업을 수행한 후, 변환된 값들로 새로운 배열을 만드는 데 사용됩니다. 간단히 말해, 배열 요소를 변환하거나 처리할 때 매우 유용한 도구입니다.

기본 문법

array.map(callback(element, index, array))

• callback: 각 요소를 처리할 함수를 지정합니다.
• element: 배열의 현재 처리 중인 요소입니다.
• index(옵션): 현재 요소의 인덱스입니다.
• array(옵션): 현재 처리 중인 원본 배열입니다.

예제 1: 배열 요소 변환

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

→ map은 원본 배열 numbers의 요소를 각각 제곱한 새로운 배열 squaredNumbers를 생성합니다.

---

예제 2: 객체 속성 추출

const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];
const userNames = users.map(user => user.name);
console.log(userNames); // 출력: ['Alice', 'Bob', 'Charlie']

→ map을 사용해 객체 배열에서 이름만 추출한 새로운 배열을 만듭니다.

---

특징

1. 원본 배열은 변하지 않습니다.
2. 새로운 배열이 반환됩니다.
3. 배열 요소의 개수는 변하지 않습니다. (입력 배열과 출력 배열의 길이가 같습니다.)

---

map을 사용하면 복잡한 데이터를 손쉽게 변환할 수 있어 코드가 깔끔하고 읽기 쉬워집니다.