23.2.15[Arrow Function]

참고 사이트 및 영상

Arrow Function이 뭐지?

언제 나왔을까?

• ES6 이후에 나온 함수를 표현하는 새로운 방식

기존에 함수를 쓰는 표현 방식이 있는데 왜 쓸까?

1. 함수 본연의 기능을 잘 표현

• 본디 함수를 쓰는 이유는 두 가지다. 여러 기능을 하는 코드를 한 단어로 묶고 싶을 때, 입출력 기능을 만들고 싶을 때인데 화살표 함수는 두 번째 기능인 입출력 기능을 직관적으로 표현해준다.

2. (), {} 도 생략이 된다.

• 함수의 인자가 1개면 ()도 생략이 된다.
• return이 한 줄이라면 {}과 return 이 생략된다.

var 두배만들기 = x => x * 2 ;
// 확실히 직관적이다.
console.log( 두배만들기(4) );
console.log( 두배만들기(8) );

this는 어떻게 처리할거야?

• 함수가 쓰인 위치에 따라 내부의 this는 변한다.
• 하지만 화살표 함수는 어디서 쓰든 this값을 변화시키지 않는다.

내 느낌 : this를 좀 전역적으로 쓰는 느낌? 맞는지는 모르겠으나 window를 출력한다니 그런 느낌이 든다.

• 고로 내가 예측한 this값이 달라질 수 있다는 점에서 단점으로 작용할 수도 있다.

this 같은 이슈가 발생할 수 있으므로 function을 완전히 대체하는 신문법은 아니라는 점을 알고 있어야 한다.

면접용 정리

이제야 왜 this 어쩌구 하는 값에서 이슈가 있는지 알았다.

• "일반 함수 표현식보다 단순하고 간결한 문법으로 사용할 수 있는 방법으로 타이핑을 적게 만들고 함수를 동적으로도 만들 수 있는 장점이 있습니다. 또한 일반 함수식에서 사용하는 this를 가지지 않으며 argument를 지원하지 않습니다. 다만 남발하지 못하는 경우는 new와 함께 호출하거나, 이벤트 메소드에 콜백함수로는 사용할 수 없습니다."