Arrow function(화살표 함수)

이름 그대로 익명함수를 화살표 형태로 간략하게 쓸 수 있는 새로운 방법

사용 방법

  1. 매개변수가 없을 때

    //ES5
    function() {...}
    
    //ES6
    () => {...}
    
  2. 매개변수가 한 개일 때

    //ES5
    function(x) {
     return x * x
    }
    
    //ES6
    x => x * x
    x => { return x * x}
    
  3. 매개변수가 두 개 이상일 때

    //ES5
    function (x, y) {
     return x + y
    }
    
    //ES6
    (x, y) => x + y
    (x, y) => { return x + y }
    

원래 자바스크립트의 this는 함수 호출 패턴에 따라 this에 바인딩되는 객체가 달라지는데
Arrow function은 항상 자신을 포함하는 외부 scope에서 this를 받는데 이를 Lexical this라 한다.
Arrow function을 사용하면 this를 보다 직관적으로 사용할 수 있다.
(this는 언제봐도 정말 헷갈리는데 나중에 제대로 포스팅 해보려 함)

그냥 함수 표기법으로 this를 바인딩하는 방법이 있지만 따로 작성하지 않고 Arrow function을 쓰는걸로..


'개발 > ES6' 카테고리의 다른 글

5. ES6 Class(클래스)  (0) 2017.04.28
4. ES6 Module(모듈)  (0) 2017.04.28
3. ES6 Template String(템플릿 문자열)  (0) 2017.04.28
2. ES6 Arrow function(화살표 함수)  (0) 2017.04.28
1. ES6 let과 const의 특징 알아보기  (0) 2017.04.28
0. ECMAScript, ES6란?  (0) 2017.04.28

+ Recent posts