[Javascript] 함수선언문 vs 함수표현식

핵심
1. 함수선언문과 함수표현식의 차이
2. 상수(constant), 리터럴(Litereal)
3. '식' 과 '문'의 차이

 

1.  함수선언문 vs 함수 표현식

우선 함수는 함수객체를 가리키는 식별자로 호출된다는 것을 알아두자!
함수명으로는 함수 외부에서 함수를 참조할 수 없다.

cf. 함수명은 함수 몸체 내에서만 참조가능한 식별자

 

함수선언문

function foo() {
	console.log("Hello!");
}

foo();

함수 선언문의 경우엔 JS엔진이 함수 객체를 가리키는 식별자를 암묵적으로 생성한다. (함수명과 동일한 이름의 식별자)

그리고 거기에 함수객체를 할당한다.

⇒ 그래서 겉보기엔 이름으로 호출이 가능한 것처럼 보이는 것이다.

 

함수표현식 (함수 리터럴)

- 자바스크립트에서 함수는 일급객체라는 특성을 이용하여 함수 리터럴 방식으로 함수를 정의.

- 변수에 할당 가능.
- 기명보다는 익명함수 즉, 함수명을 생략하는게 일반적임.

(function foo() {
	console.log("foo");
});

foo();  // Reference Error

함수명으로는 외부에서 함수를 참조할 수 없으므로 Reference Error가 나오는것을 확인할 수 있었다.

 

var foo = function() {
	return 10;
};

console.log(foo())

그럼 위의 코드에서 호출할때 쓰이는 foo는 무엇이냐?

=> 함수명이 아니라 식별자로, 이는 할당된 함수를 가리키는 참조값을 저장한다.

 

2. 상수와 리터럴

상수(constant)

상수는 변하지 않는 변수를 뜻한다. 즉, 메모리 공간을 의미하며, 메모리 '값'을 변경할 수 없다.

자바스크립트에서 보통 const 로 선언한다.

 

상수에 넣는 데이터로 숫자나 문자열만 오는게 아닌, 객체도 들어올 수 있다.

변하지 않는다는 말 때문에, 객체 안의 프로퍼티 값까지 변할 수 없다고 생각할 수 있다.

 

하지만 이는 원시값에만 해당되는 말이고, 객체는 참조타입 변수이다.

이 참조타입 변수의 메모리 주소값이 변할 수 없는 것이지, 주소가 가리키는 데이터는 변할 수 있다.

전에 let, const, var의 차이를 다룬 글에서 다시 가져와 봤다.

const obj = {
    name: "bae",
    gender: "male",
    age: 27,
    height: 178,
}

//수정 (주소가 가리키는 데이터는 변할 수 있다)
obj.age = 25

//재할당 (객체 자체의 참조를 변경하는 것은 안된다!)
obj = {
    name: "bae",
    gender: "male",
    age: 25,
    score: 100,
}

 

리터럴(Literal)

그에 반해 리터럴은 데이터(value) 그 자체를 뜻한다.

e.g. 정수 리터럴 - 100

       함수 리터럴 - function(){}

       객체 리터럴 - { name: 'Bae' }

 

cf. 리터럴 표기법이란?

 변수를 선언함과 동시에 값을 지정해주는 표기법

 

3. 식, 문

식 : 하나의 value를 반환하면 '식'이다.    e.g. 함수 표현식

문 : 값을 반환하지 않는다.   e.g. 함수 선언문