JavaScript 배열 맵() 메서드
그만큼 JavaScript의 map() 메소드 원래 배열의 각 요소에 함수를 적용하여 새 배열을 만듭니다. 빈 요소를 건너뛰고 원래 배열을 변경하지 않으므로 데이터 변환에 이상적입니다.
map() 메소드의 주목할만한 기능 중 하나는 빈 요소를 처리하는 것입니다. 비어 있지 않은 값 처리에만 초점을 맞춰 이러한 요소에 대한 콜백 함수 실행을 자동으로 건너뜁니다. 이러한 동작은 효율적이고 간소화된 처리를 보장하여 배열 변환의 전반적인 성능을 향상시킵니다.
통사론:
map((element, index, array) =>{ /* … */ }) 매개변수:
- 요소: 이는 필수 매개변수이며 현재 요소의 값을 보유합니다.
- 색인: 선택적 매개변수이며 현재 요소의 색인을 보유합니다.
- 도착: 선택적 매개변수이며 배열을 보유합니다.
반환 값:
새로운 배열을 반환하고 배열의 요소는 콜백 함수의 결과입니다.
예: 여기서는 map()> 원래 배열에 있는 각 숫자의 제곱근을 포함하는 새 배열을 만드는 방법입니다.
const numbers = [1, 4, 9, 16, 25]; const squareRoots = numbers.map(num =>Math.sqrt(num)); console.log(squareRoots); // 출력: [1, 2, 3, 4, 5]
산출
[ 1, 2, 3, 4, 5 ]
예 : 이 예제에서는 배열 map() 메서드를 사용하고 배열 요소의 제곱을 반환합니다.
자바스크립트 // Input array let arr = [2, 5, 6, 3, 8, 9]; // Using map to transform elements let newArr = arr.map(function (val, index) { return { key: index, value: val * val }; }) // Display output console.log(newArr) 산출
[ { key: 0, value: 4 }, { key: 1, value: 25 }, { key: 2, value: 36 }, { key: 3, value: 9 }, { key: 4, value: 64 }, { key: 5, value: 81 } ] 예: 이 예에서는 배열 map() 메서드를 사용하여 문자 'A'를 이름의 모든 문자와 연결합니다.
자바스크립트 //Input string let name = 'Geeks'; // New array of character and names // concatenated with 'A' let newName = Array.prototype.map.call(name, function (item) { return item + 'A'; }) // Display output console.log(newName) 산출
[ 'GA', 'eA', 'eA', 'kA', 'sA' ]
인수와 함께 콜백 함수 사용
map() 메소드와 함께 parsInt()를 사용합니다. 그만큼 parseInt()> 함수는 문자열을 정수로 변환합니다. 함께 사용하는 경우 map()> , 문자열 배열의 각 요소를 정수로 변환합니다.
예: 여기서는 map()과 함께parseint를 사용하고 있습니다.
자바스크립트 const strings = ['10', '20', '30']; const integers = strings.map(str =>ParseInt(str)); console.log(정수); // 출력: [10, 20, 30]
산출
[ 10, 20, 30 ]
우리는 Javascript Array 메소드의 전체 목록을 가지고 있습니다. 이를 확인하려면 다음을 수행하십시오. 자바스크립트 배열 전체 참조 기사.
우리는 Javascript의 모든 중요한 주제를 다루는 Javascript에 대한 치트 시트를 가지고 있으므로 이를 확인하십시오. Javascript 치트 시트 - JavaScript 기본 가이드 .
JavaScript는 웹 페이지 개발로 가장 잘 알려져 있지만 브라우저가 아닌 다양한 환경에서도 사용됩니다. 다음을 따르면 JavaScript를 처음부터 배울 수 있습니다. 자바스크립트 튜토리얼 그리고 자바스크립트 예 .