Arrow Functions

우리는 JavaScript에서 함수를 선언할 때, 아래와 같은 방법을 사용하여 함수를 선언하곤 한다. 

function callMe(name) {
	console.log(name);
}

const callMe = function(name) {
	console.log(name);
}

 

이와 다른 Arrow Function이라고 불리우는 방법으로 함수를 선언할 수도 있다.

Arrow Function은 function keyword를 생략했기 때문에 일반적인 함수 선언보다 짧게 선언할 수 있으며, JavaScript에서 this로 생겼던 많은 문제들을 해결해준다는 장점도 가지고 있다. 

this를 함수에서 사용할 때에 항상 원하는 객체를 참조하지 않았던 것을 생각해보면, 이 Arrow Function에서는 this가 원하는 객체를 나타낸다는 것을 알 수 있을 것이다. 

// parameter가 있을 수도
const callMe = (name) => {
	console.log(name);
}

// parameter가 여러 개 있을 수도
const callMe = (name, age) => {
	console.log(name, age);
}

// 비어있을 수도
const callMe = () => {
	console.log('Max!');
}

만약 parameter가 하나라면 아래와 같이 괄호를 생략할 수 있다. 두 개 이상이라면 괄호는 생략할 수 없다.

const callMe = name => {
	console.log(name);
}

또한 아래와 같이 return문 하나만 존재한다면, 1줄로 짧게 작성할 수 있다.

const returnMe = name => {
	return name;
}

// 동일한 결과
const returnMe = name => name