[React JS] Arrow function이란?

 ▶ 화살표 함수(Arrow function) 

var/let/const 함수명 = (매개변수) => {실행문}

 

: 일반 함수 표현식보다 단순하고 간결한 문법

: return 명령어 없이도 함수 실행을 종료시키고 값을 반환.

: 익명함수, 함수를 재사용하지 않을 목적으로 함수에 이름을 붙이지 않는 것.

 

// 매개변수가 없는 경우
var foo = () => console.log('bar');

// 매개변수가 하나인 경우
var foo = x => x;

// 매개변수가 여러개인 경우
var foo = (a, b) => a + b; // 간단하게 한줄로 표현할 땐 "{}" 없이 값이 반환됩니다.

var foo = (a, b) => { return a + b }; // "{}" 사용 > 리턴 존재

var foo = (a, b) => { a + b }; // "{}"를 사용했는데 return이 없을 때 
foo(1, 2); // undefined

var foo = (a, b) => { // 여러줄 썼을 때
	var c = 3;
	return a + b + c;
}


"{}"를 사용하면 값을 반환할 때 return을 사용해야합니다.
"{}"를 사용하지 않으면 undefied를 반환합니다.
"{}"을 사용할 때는 여러줄을 썼을 때 사용합니다.
객체 반환시 "{}" 명시
화살표 함수를 사용해 return과 중괄호{} 생략