본문 바로가기
Computer Science/JavaScript

자바스크립트 Chapter 7 Expression vs Statement

by Write and Remember 2019. 4. 25.

자바스크립트 핵심 컨셉 33가지

 

Chapter 7 Declaration vs Expression

 

7장에서 다루는 내용은

 

함수 선언과 표현이다.

 

자바스크립트에서 함수를 생성할 때

 

사용하는 방법은 세 가지가 있다.

 

1. Function Declaration(함수 선언식)

 

function [name](param1, param2, ...param3) {

}

 

function 키워드를 함수 이름 앞에 놓으면 된다.

 

함수 선언식의 특징은 호이스팅된다.

 

이 때문에 함수를 선언하기 전에

 

함수를 실행할 수 있다.

 

const num1 = 10;
const num2 = 20;

const result = sum(num1, num2);

console.log(result); // 30 (sum 함수 선언 전에 실행)

function sum(param1, param2) {
	return param1 + param2;
}

 

위 사례의 자바스크립트 호이스팅에 의존하는 대신

 

함수를 먼저 선언을 하고 실행하는 것이 좋은 방법이다.

 

2. Function Expression(함수 표현식)

 

const [name] = function(param1, param2, ...param3) {

}

 

익명 함수가 생성되고 변수에 지정을 한다.

 

const num1 = 10;
const num2 = 20;

const result = sum(num1, num2); // sum is not defined

const sum = function(param1, param2) {
	return param1 + param2;
}

console.log(result);

 

표현식의 한계는

 

함수가 정의될 때까지 실행할 수 없다.

 

const num1 = 10;
const num2 = 20;

const sum = function(param1, param2) {
	return param1 + param2;
}

const result = sum(num1, num2); // 30

 

위의 표현식 사례는 정상적으로 작동한다.

 

3. Named function expression(기명 함수 표현식)

 

1번과 2번 접근 방식의 결합

 

const num1 = 10;
const num2 = 20;

const sumVariable = function sumFunction(param1, param2) {
	return param1 + param2;
}

 

익명 함수가 아니고 sumFunction 이름을 가진 함수를

 

sumVariable 변수에 할당해주었다.

 

const result = sumFunction(num1, num2); // sumFunction is not defined

 

function 키워드에 이름을 추가했기 때문에

 

sumFunction 해당 이름으로 실행되지 않는다.

 

const result = sumVariable(num1, num2); // 30

 

할당된 변수명 sumVariable만이

 

참조하고 실행할 수 있다.

 

const num1 = 10;
const num2 = 20;

const sumVariable = function sumFunction(param1, param2) {
  let sum = param1 + param2;

  if (sum === 30) {
    sum = sumFunction(sum, 10);
  }

  return sum;
}

const result = sumVariable(num1, num2)

console.log(result) // 40

 

sumFunction 함수 안에서는

 

sumFunction 사용이 가능하다.

 

재귀 호출, 디버깅 할 때 이점이 있다.

 

세 가지 방식 중 어떤 방식만

 

사용하라는 건 없지만

 

각각의 방식의 특징을 잘 알고

 

사용하는 게 중요한 것 같다.

댓글0