arrow function을 가장 많이 사용할 때는 callback 함수로 사용할 때 입니다.

callback 함수란, 인자로 전달되는 함수라고 생각하시면 됩니다.

arrow function을 조금 더 연습하기 위해 array의 반복문으로 사용되는 map, forEach 메서드를 함께 보겠습니다.

• Array.map()
• Array.forEach()

정말 많이 쓰이는 메서드 입니다!

1. Array.map()

map 메서드는 배열을 반복해주는데,

callback 함수에서 return한 값으로 매(each) 요소를 수정해 줍니다.

map 메서드의 return 값은 수정된 값으로 다시 생성된 배열입니다.

const originalArray = [1, 2, 3, 4, 5];

const newArray = originalArray.map(function addOne(number) {
  return number + 1;
});

console.log(originalArray); // [1, 2, 3, 4, 5]
console.log(newArray); // [2, 3, 4, 5, 6]

2. Array.forEach()

forEach 는 for 대신 사용하는 반복문입니다.

map 과의 큰 차이는 forEach 함수 자체가 return 하는 것도 아무것도 없다는 것입니다.

그냥 forEach 함수를 탈출하고 싶을 때 return 을 사용하면 됩니다.

map 은 요소가 수정된 새로운 배열이 return 되었다면,

forEach 는 아무것도 return 하는 것이 없습니다.

그래서 forEach 로 전달되는 callback 함수에서도 return하는 것이 없습니다.

forEach 는 단지 for 문 대신 사용하는 반복 method 입니다.

let startWithNames = [];
let names = ['a', 'ab', 'cbb', 'ada'];

names.forEach(el => {   
  if (el.startsWith('a')) {     
    startWithNames.push(el);   
  } 
});  ///['a','ab','aba']

let hasC = false;
let arr = ['a', 'b', 'c', 'd'];

arr.forEach(el => {
  if (el === 'c') {
    hasC = true;
  }
}); ///true

만약 forEach에서 현재 index 를 알고 싶으면 두 번째 인자로 받을 수 있습니다.

let idxOfC = -1;
let arr = ['a', 'b', 'c', 'd'];

arr.forEach((el, idx) => {
  if (el === 'c') {
    idxOfC = idx;
    return;
  }
});///2

Assignment

두 문제 모두 map 메서드와 arrow function을 사용해주세요.

1. moreThan100 함수를 구현해 주세요.

• 숫자로 구성된 배열을 인자로 받습니다.

• 100 보다 크거나 같으면, true 를

• 100 보다 작으면 false 로 요소를 변경하여, 새로운 배열을 return 해주세요.

• 예를 들어,

  nums(input)가
  [100, 9, 30, 7]
  이라면
  
  return은
  [true, false, false, false]

mycode

const moreThan100 = nums => {
  return nums.map(nums =>{ ///.map() 은 아래 조건을 돌리며 배열을 반환한다.
    if (nums >= 100) {
      return true;
    }else{
      return false;
    }
  })
  
}
console.log(moreThan100([100,200,300,400]))
///[ true, true, true, true ]

2. formatDate 함수를 구현해 주세요.

• 날짜가 담긴 배열을 인자로 받습니다.

• 날짜의 data type은 string이며, 보내는 날짜 타입은 'YYYY-MM-DD' 입니다.

• 해당 날짜의 형식을 'YYYY년 MM월 DD일' 로 바꿔서, 새로운 배열을 return 해주세요.

• 예를 들어,

  dates(input)가
  ['2019-03-21', '2019-04-21', '2019-05-21']
  이라면
  
  return은
  ['2019년 03월 21일', '2019년 04월 21일', '2019년 05월 21일']

mycode

const formatDate = dates => {
  return dates.map(dates => {
    const line = dates.indexOf('-');
    const year = dates.slice(0,line);
    const month = dates.slice(line+1 , line+3);///마지막 요소는 제외하고 그 앞에까지의 인덱스를 잘라서 반환한다
    const date = dates.slice(line+4 , dates.length);
    const result =`${year}년${month}월${date}일`;

     return result;
  });
}
console.log(formatDate(['2019-03-21', '2019-04-21', '2019-05-21'])) ///[ '2019년03월21일', '2019년04월21일', '2019년05월21일' ]