JS arrow function

화살표 함수를 사용하면 function 키워드를 사용해서 함수를 만드는 것 보다 간단하게 표현할 수 있다.

// function
const sum = function(a, b) {
	return a + b;
};

//arrow function
const sum = (a, b) => a + b;

 

() 안에 매개변수를 넣고 화살표 오른쪽에 함수 본문을 넣는다.

 

매개변수 지정 방법

//매개변수가 없을 경우
const ex = () => { ... };

//매개변수가 하나인 경우 괄호 생략 가능
const ex = a => { ... };
const ex = (a) => { ... };

//매개변수가 여러개인 경우
const ex = (a, b, c) => { ... };

 

함수 본문 지정 방법

// 함수 본문이 한 줄인 경우 
const ex = a => a + 1;    // return, 중괄호 생략 가능
const ex = a => { return a + 1; };    // 중괄호를 사용했을 경우 return 써줘야 함

// 함수 본문이 여러 줄인 경우
const ex = () => {
	let a = 5;
    return a + 3;
};

// 객체를 반환하는 경우
const ex = () => ( {a: 1, b: 2} );    // 괄호 안에 써줘야 함
const ex = () => { return {a: 1, b: 2}; }    //위와 동일

---

화살표 함수는 자신의 this를 가지지 않는다. 따라서 화살표 함수 내에서 this를 호출하면 바로 바깥 범위의 this를 찾는다. 나중에 this에 대해 정리할 때 자세히 공부해야겠다.