수정하기 - 자바스크립트의 배열 메서드 중 map()의 사용법은 무엇인가요?

닉네임

비밀번호

제목

내용 [이미지 업로드는 권한이 있는 사람만 가능. 하단 카톡으로 연락]

`map()` 메서드는 <a href='https://sangseek.com/sangseeks/자바/ko'>자바</a>스크립트의 배열(Array) 메서드 중 하나로, 배열의 각 요소에 대해 주어진 함수를 호출하고, 그 결과를 새로운 배열로 반환합니다. 이 메서드는 원본 배열을 변경하지 않고, 새로운 배열을 생성하는 점에서 불변성을 유지하는 특징이 있습니다. `map()` 메서드는 주로 배열의 각 요소를 변형하거나 가공할 때 유용하게 사용됩니다.           기본 문법    ```javascript  let newArray = array.map(function(currentValue, index, array) {      // return element for newArray  }, <a href='https://sangseek.com/sangseeks/thisArg/ko'>thisArg</a>);  ```    - `currentValue`: 현재 처리 중인 배열 요소  - `index` (선택적): 현재 처리 중인 배열 요소의 인<a href='https://sangseek.com/sangseeks/덱스/ko'>덱스</a>  - `array` (선택적): `map()`이 호출된 배열  - `thisArg` (선택적): 콜백 함수에서 `this`로 사용할 값           사용 예시    1.   기본 사용법      ```javascript  const numbers = [1, 2, 3, 4, 5];  const doubled = numbers.map(num => num * 2);    console.log(doubled); // [2, 4, 6, 8, 10]  ```    위의 예시에서 `map()` 메서드는 `numbers` 배열의 각 요소를 2배로 만드는 함수를 적용하여 새로운 배열 `doubled`를 생성합니다.    2.   인덱스와 원본 배열 사용하기      ```javascript  const fruits = ['apple', 'banana', 'cherry'];  const fruitLengths = fruits.map((fruit, index) => {      return `${fruit} is at index ${index} and has ${fruit.length} <a href='https://sangseek.com/sangseeks/characters/ko'>characters</a>.`;  });    console.log(fruitLengths);  // ["apple is at index 0 and has 5 characters.", "banana is at index 1 and has 6 characters.", "cherry is at index 2 and has 6 characters."]  ```    이 예시에서는 각 과일의 이름, 인덱스, 그리고 글자 수를 포함한 문자열을 생성하여 새로운 배열을 만듭니다.    3.   객체 배열 변형하기      ```javascript  const users = [      { name: 'Alice', age: 25 },      { name: 'Bob', age: 30 },      { name: 'Charlie', age: 35 }  ];    const userNames = users.map(user => user.name);    console.log(userNames); // ["Alice", "Bob", "Charlie"]  ```    여기서는 객체 배열에서 각 사용자 객체의 `name` 속성만 추출하여 새로운 배열을 생성합니다.           주의사항    - `map()` 메서드는 항상 새로운 배열을 반환합니다. 원본 배열은 변경되지 않습니다.  - `map()`의 콜백 함수는 배열의 각 요소에 대해 호출되며, 배열의 길이만큼 호출됩니다.  - 만약 `map()` 메서드의 콜백 함수가 `<a href='https://sangseek.com/sangseeks/undefined/ko'>undefined</a>`를 반환하면, 결과 배열의 해당 요소는 `undefined`로 설정됩니다.           결론    `map()` 메서드는 배열의 각 요소를 변형하여 새로운 배열을 생성하는 데 매우 유용한 도구입니다. 특히 데이터 가공, 변형, 필터링 등의 작업을 수행할 때 자주 사용됩니다. 자바스크립트의 함수형 프로그래밍 스타일을 활용하여 코드의 가독성과 유지보수성을 높이는 데 기여할 수 있습니다.