기록하는 개발자

<React 파헤치기-05> ES6주요문법 - 3. 화살표 함수 본문

Web/React

<React 파헤치기-05> ES6주요문법 - 3. 화살표 함수

밍맹030 2021. 12. 10. 17:28
728x90

화살표 함수는 표현식을 사용하는 함수로 '=>'를 이용하여 함수를 선언한다. 화살표 기둥 '='를 사용하기 때문에 'fat arrow function' 이라고도 부른다.

 

기존 자바스크립트 function

function mul(a, b){
	return a*b;
}

var mul = function(a,b){
	return a*b;
};

 

ES6의 화살표 함수 사용 방법

// <1>
const mul = (a,b) => {
	return a*b;
}

// <2>
const mul = (a,b) => a*b;

// <3>
cosnt addMul = (a,b) => ({add : a+b, multiply : a*b});

1 - 앞선 코드의 기존 함수 표현식을 화살표 함수로 변경한 것이다.

2 - 함수의 본문 내용이 비어있고 return만 존재한다면 중괄호를 생락하고 => 뒤에 표현식을 넣을 수 있다.

3 - return 값이 객체인 경우 괄호로 결과값을 감싸 표현할 수 있다.

728x90