Arrow Function in JS (=>)

Hyunsol Park·2020년 8월 12일

Arrow Function in JS (=>)

  • ES6 (ECMA Script 6)에 만들어진 방식이다.
  • function(함수)의 syntax를 더 간단히 표현하기 위해 만들어졌다.

예를 들면 'hey'라는 문자열을 return하는 hello라는 function을 만든다고 했을때 전통적으로는 아래와 같이 쓴다:

hello = function(){
return('hey')};

그런데 ES6로 넘어오면서 arrow function을 써서 이를 더 간단한 syntax으로 표현할 수 있게 되었다:

hello = () => {return('hey')}

위에 코드를 보면 'function'이라는 단어가 없어지고 ()=>로 대체된 것을 알 수 있다. 여기서 더 나아가 만약 함수에 statement가 한가지 밖에 없다면 더 간단하게 표현할 수 있다:

hello = () => 'hey'

위를 보면 return이 없어졌다.

복습 삼아서 한가지 예를 더 들어 보겠다.

before ES6:

myAge = function(age){
	if(age > 20){
		return ('adult')
	} else {
		return ('underaged')
	}
}

myAge(21); //returns adult

ES6:

myAge = (age) => {
	if(age > 20){
		return ('adult')
	} else {
		return ('underaged')
	}
}

myAge(21); //returns adult

참고 문서:

https://www.w3schools.com/js/js_arrow_function.asp

0개의 댓글