[JavaScript] 기초 #11 - 함수 표현식, 화살표 함수(arrow function)

 

함수 선언문 VS 함수 표현식

함수 선언문	함수 표현식
function sayHello() {     console.log(‘Hello’); }	let sayHello = function() {     console.log(‘Hello’); }
어디서든 호출 가능 (호이스팅)   sayHello();   function sayHello() {     console.log(‘Hello’); }	함수 표현식 이후에 호출 가능   function sayHello() {     console.log(‘Hello’); }   sayHello();

 

-         자바스크립트는 위에서 아래로 차례대로 한 줄 씩 읽으면서 실행 (인터프리터 언어)

-         자바스크립트는 실행 전 초기화 단계에서 코드의 모든 함수 선언문을 찾아 생성하기 때문에 어디서든 함수를

          호출해서 사용할 수 있다.  

-         하지만 함수 표현식은 코드에 도달해야만 생성되기 때문에 함수 표현식 이후에 함수를 호출해서 사용할 수 있다.

-         그렇기 때문에 함수 표현식보다 함수 선언문이 더 자유롭다.

 

 

화살표 함수(arrow function)

기본형식

let add = (num1, num2) => {
	return num1 + num2;
}

       

코드가 한 줄만 있는 return문은 소괄호로 표현 가능, return 전에 여러 줄의 코드가 있으면 불가

let add = (num1, num2) => (
	num1 + num2;
)

 

 let add = (num1, num2) => {
	const result = num1 + num2;
	return result;
}

 

return문이 한 줄이면 소괄호 생략 가능

let add = (num1, num2) => num1 + num2;

 

인수가 하나면 괄호 생략 가능

let sayHello = name => `Hello, ${name}`;

 

인수가 없으면 괄호 생략 불가

let showError = () => {
	alert(‘error’);
}

 

※      화살표 함수는 ES6 이후 굉장히 활발히 사용되고 있기 때문에 잘 알아두자.

 

 

 

↓[코딩앙마] 자바스크립트 기초 강좌 링크

https://www.youtube.com/watch?v=Zwaxqf1gsTg