Arrow Fuction는 일반적인 함수 표현(선언)식을 축약한 형태로 표시하는 것으로 ES6에서 새로 도입된 방법입니다. 클로저함수를 표현할 때 특히 강점이 있습니다.
// 일반적인 함수 표현식
const add = function (x, y) {
return x + y;
};
// 화살표 함수
const add = (x, y) => {
return x + y;
};
// 함수 내의 statement가 한줄일 경우 {}, ; 생략 가능 => return만 있는 경우 return 까지 생략 가능
const add = (x, y) => x + y;
// 파라미터가 한 개일 경우 () 생략 가능
// 함수내 statement의 명확한 표현을 위해 () 사용 가능
const adder3 = x => (x + 3);그리고 화살표 함수는 다음과 같은 중요한 특징들이 있습니다.
- call, apply, bind(함수의 메소드)를 사용할 수 없습니다.
- 화살표 함수의 실행은 this 객체를 결정짓지 않습니다.
this는 함수 실행시 호출 방법에 의해 결정되는 특별한 객체 입니다. 즉,this객체는 함수가 실행되는 맥락(Execution Context)과 방법에 따라 다르게 결정됩니다.
함수 실행과 관련된 this 결정 패턴에는 다섯 가지가 있으며, 이 때 바인딩되는 객체는 다음과 같습니다.
(1) Global에서 참조: window객체(Browser) / module.exports객체(node.js)
console.log(this);(2) Function 호출: window객체(Browser) / global객체(node.js)
foo();(3) Method 호출: 부모객체(메소드 왼쪽 '.'을 기준으로 왼쪽 객체)
obj.foo();(4) 'new'키워드를 이용한 생성자 호출: 생성된 인스턴스객체
new Foo();(5) call 또는 apply 호출: 첫번째 인자로 전달되는 객체
foo.call()
foo.apply()코드 및 자료 출처: 코드스테이츠(CodeStates)
