JavaScript 기초 : 함수 표현식 / 화살표 함수

함수 표현식 (Function Expression)

함수 표현식은 함수를 변수에 할당하는 방식이다.

함수 선언식과는 달리 호이스팅이 되지 않기 때문에 함수가 정의된 이후에만 호출할 수 있다.

 

// 변수에 함수를 바로 담는다.
let varA = function funcA() {
	console.log("function A");
};

varA(); // varA에 함수를 담았기 때문에 바로 변수로 바로 호출할 수 있다.
// varA에 할당하며 생성된것이기 때문에 funcA를 바로 호출할 수는 없다.

// 따라서 다음과 같이 익명함수로 생성할 수 있다
let varB = function () {
	console.log("function B");
};

varB();

// [주의] 함수표현식으로 만들어진 함수는 호이스팅되지 않는다.

 

 

화살표 함수 (Arrow Function)

함수 표현식에서 function 키워드를 생략하고 =>로 표현할 수 있다. 

let varC = () => {
	return 1;
};

 

위와 같이 값을 반환하기만 하는 함수라면 더 간단하게 표현이 가능하다. {}와 return을 생략할 수 있다.

let varC = () => 2;

 

매개변수가 필요한 경우에는 다음과 같이 표현할 수 있다

let varC = (value) => value + 1;
console.log(varC(2)); // 3이 출력된다

 

값을 반환하기만 하는것이 아니라 추가 작업이 필요한 경우엔 {}를 추가해 준다.

let varC = (value) => {
	console.log(value);
    return value + 1;
};
console.log(varC(10)); // 12가 출력된다