map 메소드 요약

3829 단어 자바스크립트es6

소개



오늘은 map 메소드에 대해 학습했으므로 내용을 출력해 가고 싶습니다.
최근 전직 활동 중 공부 시간에 충분한 시간을 충분하지 않고 더 생산성을 가지고 학습해 나가고 싶은 점에 달려 있습니다.

map 메소드란?



배열의 Array 객체가 가지는 메소드. 배열의 모든 데이터에 대해 지정한 처리를 행하여 새로운 배열을 만들 수 있습니다.

MDN 참조

map 메소드의 사용 예



숫자의 배열에 대해 하나씩 2배로 하여 새로운 배열을 만들고 싶습니다.

에디터
var numbers = [1,2,3];
// 2倍した数字を置ける配列を作る
var doubledNumbers = [];

for(var i = 0; i < numbers.length; i++) {
    // 対象となる配列を2倍して配列に入れる
    doubledNumbers.push(numbers[i] * 2);
}

doubledNumbers;

결과
[2,4,6]

메모 쓰기

에디터
var numbers = [1,2,3];
// 2倍した数字を置ける配列を作る
var doubledNumbers = [];


왜 새로운 배열을 만드는가? 그것에 대해서는 이미 있는 데이터를 바꾸지 않는 것이 좋다고 여겨지고 있다(뮤테이트).
numbers에 원래 들어 있던 것을 바꾸어 버려 [2,4,6]로 해 상태가 되고 있습니다.
큰 규모가 되면 numbers=[1,2,3]가 들어가 있는 근원으로서 프로그램을 짜 버렸다···.
그러나 내용이 변경된 케이스가 있거나 한다. 결과적으로 의도하지 않은 동작이 발생할 수 있습니다.
즉, 원래 데이터를 변경하지 않도록하는 것이 생각이 필요합니다!
for(var i = 0; i < numbers.length; i++) {
 numbers[i] = numbers[i] * 2
}
numbers;

그럼, map 메소드로 써 보자! ! !

에디터
var doubled = numbers.map(function(number) {
    return number * 2;
})

doubled;


이미지로서 numbers 배열을 2배로 새로운 배열에 건네받는다


포인트는 return을 잊지 않는 것! 새로운 배열에 무엇을 넣으면 좋은지 모르게 되어 null가 돌아온다.
return number * 2;

좋은 웹페이지 즐겨찾기