Arrow function (화살표 함수)

welcome·2021년 11월 3일

화살표 함수


Arrow function은 function 키워드 대신 화살표(=>)를 사용하여 보다 간략한 방법으로 함수를 선언하는 방법
하지만 모든 경우 화살표 함수를 사용할 수 있는 것은 아니다.

기본문법

매개변수 지정 방법

() => { ... } // 매개변수가 없을 경우
x => { ... } // 매개변수가 한 개인 경우, 소괄호를 생략할 수 있다.
(x, y) => { ... } // 매개변수가 여러 개인 경우, 소괄호를 생략할 수 없다.

함수 몸체 지정 방법
x => { return x * x }  // single line block
x => x * x             // 함수 몸체가 한줄의 구문이라면 중괄호를 생략할 수 있으며 암묵적으로 return된다. 위 표현과 동일하다.
() => {           // multi line block.
  const x = 10;
  return x * x;
};           

화살표함수의 예외


this는 기본적으로 실행컨텍스트가 생성될때(함수가 호출될때) 결정되지만 화살표함수의 경우에는 this를 바인딩하는 과정이 생략되 함수의 내부에는 this가 없으며 접근하고자 하면 스코프체인상 가장가까운 this에 접근하게 됩니다.

화살표함수 사용하면 안되는 경우

  • 메소드
  • prototype
  • 생성자함수
  • addEventlistener

0개의 댓글