replit - 29. arrat methods

이하영·2022년 4월 2일
0

Replit

목록 보기
3/3

replit 29번을 풀면서 정리안된 부분들을 정리해보려 한다.
아직도 헷갈리는게 많지만...🤯 호ㅏ이팅...내자신

arrat methods

arrow function을 가장 많이 사용할 때는 callback 함수로 사용할 때 이다.
여기서 arrow function은 이전글에 포스팅 해놨다!!!

callback함수란, 인자로 전달되는 함수

arrow function을 연습하기 위해 array의 반복문으로 많이 사용되는 map,forEach 메서드를 함께 보도록 하자.
Array.map()
Array.forEach()

Array.map()

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

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

map 메서드의 return 값은 수정된 값으로 다시 생성된 배열입니다.
수정 수정이 중요 포인트이다.

  • map 메소드의 리턴 값은 수정된 값으로 다시 생성된 배열이다
const arr = [1,2,3,4];
arr.map((arr) => console.log(arr));
  • map 메소드에 인자로 넘어간 함수를 원래대로 한다면
const arr = [1,2,3,4];
arr.map(function newarr(arr) {
  console.log(arr)
});

Assignment 1

▼ 코드

const moreThan100 = nums => 
  nums.map(nums => {
    if (nums >= 100){
      return true;
    }else {
      return false;
    }
  })
console.log(moreThan100([100,9,30,7]))

▼ 결과

▼ 이걸 풀어서 써본다면

function moreThan100(nums){
  return nums.map(function (nums){
    if(nums >= 100){
      return true;
    }else {
      return false;
    }
  })
}
const result = moreThan100([100,9,30,7]);
console.log(result);

결과는 같다!

나는 아직 arrow function에 익숙하지 않고 헷갈려서 이렇게 바꿔가면서 해봐야 그나마 이해된다고 해야할지...ㅠㅠ 왜 난 아직도 화살표랑 친해지지못하는것인가.. 😫

Assignment 2

▼ 코드

const formatDate = dates => {  
  const result = dates.map(dates => {
    const dateArr = dates.split('-');
    return `${dateArr[0]}${dateArr[1]}${dateArr[2]}`;
  });
 return result;
}

console.log(formatDate(['2019-03-21', '2019-04-21', '2019-05-21']))

▼ 결과

split메서드를 이용해서 dates 배열을 ('-') 기준으로 끊어서 년/월/일 요소로 가진 배열 인덱스를 이용해서 리턴했다.

0개의 댓글