Arrow function 문법

자바스크립트에서 아래와 같이 함수를 만들었다.

//1
function myfunction(){
  ...
}
  
//2
var myfunction = function(){
  ...
}

ES6 문법을 사용하면 함수를 아래와 같이 만들 수 있다.

var myfunction = () => {
  ...
}

사용 예시를 보자.



var makeDouble = (x) => { return x * 2 }

console.log(makeDouble(4));
// 8 출력
console.log(makeDouble(8));
//16 출력

Arrow function을 이용할때 파라미터가 한개면 () 생략이 가능하다. 또 {}안의 내용이 return 한줄이라면 생략가능하다.

var makeDouble = x => return x * 2 ;

주의할점

Arrow function을 사용하면 내부에서 this값을 사용할 때 밖에 있던 this값을 그대로 사용한다.

이전에

var object1 = {
  myfunction1 : function(){console.log(this)}
}

에서 this는 object1을 가르켰지만,

var object2{
  myfunction2 : () => {console.log(this)}
}

여기서 this는 object2를 가르키지 않고 window를 출력한다.