.map() 함수

• map 메서드를 효과적으로 사용하기 위해서 콜백 함수가 어떻게 작동하는지 알아야 한다.
• 콜백 함수로 어떤 인자들이 전달되며, 어떻게 사용될까?
• 콜백 함수는 3개 ( 2 or 1 )

arr.map ((value, index, array)=>{....});

• value

  : 기존 배열의 값들이다

• index

  : 기존 배열의 값들의 인덱스,
  map 을 사용해서 데이터를 생성하거나 다른 배열의 같은 아이템을 인덱스로 접근해야 할 때 사용한다

• array

  : 거의 쓰지 않는다

map함수를 사용하여 반복적인 컴포넌트를 렌더링할 수 있다. map 함수는 파라미터로 전달된 함수를 사용해서 배열 내 각 요소를 새로운 배열로 생성한다. 기존 배열은 그대로 존재한다.

1. 제곱해서 새로운 배열 생성하기

var numbers = [1,2,3,4,5];

var arr = numbers.map(num => num*num);
    });
    
    
console.log(arr);
// [1,4,9,16,25]

console.log(numbers);
// [1.2.3.4.5]

2. 객체 배열 요소 순회하기

각 객체가 가진 특정 프로퍼티 값을 꺼내어 배열로 만듭니다

var persons = [
    {name: "Tom", age:18},
    {name: "Huck", age:17},
    {name: "Becky", age:16}
    ];
    
var name = persons.map (person => person.name);

console.log(name);

-> 'tom,huck,Becky'