함수 정의 (함수 선언문, 함수 표현식)

 

💡 함수 선언문 : 표현식이 아닌 문
💡 함수 표현식 : 표현식인 문

 

함수의 구성 요소

 

함수 선언문

// 함수 선언문
function add(x, y) {
	return x + y;
}

// 함수 참조
// console.dir console.log와는 달리 함수 객체의 프로퍼티까지 출력한다.
// 단, Node.js 환경에서는 console.log와 같은 결과가 출력된다.
console.dir(add); // fadd(x, y)

// 함수 호출
console.log(add(2, 5)); // 7

// 함수 선언문은 함수 이름을 생략할 수 없음
// 함수 선언문은 표현식이 아님
function (x, y) {
  return x + y; 
}

// SyntaxError: Function statements require a function name

• 함수 선언문은 표현식이 아닌 문 (표현식이 아닌 문은 변수에 할당할 수 없다.)
• 함수 선언문은 함수 리터럴과 형태가 동일
• 함수 리터럴은 함수 이름을 생략할 수 있으나 함수 선언문은 함수 이름을 생략할 수 없음
• 함수는 함수 이름으로 호출하는 것이 아니라 함수 객체를 가리키는 식별자로 호출

 

 

표현식인 문과 표현식이 아닌 문

// 변수 선언문은 값으로 평가될 수 없으므로 표현식이 아니다.
var x;
// 1, 2, 1 + 2, x = 1 + 2는 모두 표현식이다.
// x = 1 + 2는 표현식이면서 완전한 문이기도 하다.
x = 1 + 2;

var x;

// 할당은 그 자체가 표현식이지만 완전한 문이기도 하다. 
// 즉, 할당문은 표현식인 문이다.
x = 100;

// 표현식이 아닌 문은 값처럼 사용할 수 없다.
var foo = var x; // SyntaxError: Unexpected token var

// 표현식인 문은 값처럼 사용할 수 있다.
var foo = x = 100;
console.log(foo); // 100

 

 

기명 함수 리터럴도 중의적인 코드다.

 

 

함수 선언문으로 해석

foo는 자바스크립트 엔진이 암묵적으로 생성한 식별자다.

 

// 기명 함수 리터럴을 단독으로 사용하면 함수 선언문으로 해석된다.
// 함수 선언문에서는 함수 이름을 생략할 수 없다.
function foo() { console.log('foo'); }
foo(); // foo

• foo는 함수 몸체 내부에서만 유효한 식별자인 함수 이름이므로 foo 함수를 호출할 수 없어야 한다. 식별자 foo를 선언한 적도 없고 할당한 적도 없는데 호출이 가능한 이유는?
  • 자바스크립트 엔진은 함수 선언문을 해석해 함수 객체를 생성한다.
  • 이때 함수 이름은 함수 몸체 내부에서만 유효한 식별자이므로 함수 이름과는 별도로 생성된 함수 객체를 가리키는 식별자가 필요하다.
  • 함수 객체를 가리키는 식별자가 없으면 생성된 함수 객체를 참조할 수 없으므로 호출할 수도 없다.
  • 따라서 자바스크립트 엔진은 생성된 함수를 호출하기 위해 함수 이름과 동일한 이름의 식별자를 암묵적으로 생성하고, 거기에 함수 객체를 할당한다.

 

 

함수는 함수 이름으로 호출하는 것이 아니라 함수 객체를 가리키는 식별자로 호출한다.

 

 

함수 리터럴 표현식으로 해석

함수 이름 bar는 함수 몸체 내에서만 참조할 수 있는 식별자이므로 함수를 호출할 수 없다.

 

// 함수 리터럴을 피연산자로 사용하면 함수 선언문이 아니라 함수 리터럴 표현식으로 해석된다.
// 함수 리터럴에서는 함수 이름을 생략할 수 있다.
(function bar() { console.log('bar'); });
bar(); // ReferenceError: bar is not defined

• 함수 리터럴에서 함수 이름은 함수 몸체 내에서만 참조할 수 있는 식별자다라고 했다.
• 이는 함수 몸체 외부에서는 함수 이름으로 함수를 참조할 수 없으므로 함수 몸체 외부에서는 함수 이름으 로 함수를 호출할 수 없다는 의미다.
• 즉, 함수를 가리키는 식별자가 없다는 것과 마찬가지다.
• 따라서 위 예제 의 bar 함수는 호출할 수 없다.

 

 

함수 표현식

// 기명 함수 표현식
const add = function foo(x, y) {
  return x + y;
}
console.log(add(2,5)); // 7

// 함수 이름으로 호출하면 ReferenceError 발생
console.log(foo(2,5)); // ReferenceError : foo is not defined

• 함수 표현식은 표현식인 문
• 함수는 일급 객체이므로 함수 리터럴로 생성한 함수 객체를 변수에 할당할 수 있음
  • 값의 성질을 갖는 객체를 일급 객체라 한다.
• 함수 리터럴의 함수 이름은 생략할 수 있다. 이러한 함수를 익명 함수라 한다.
  • 함수 표현식의 함수 리터럴은 함수 이름을 생략하는 것이 일반적이다.
• 함수를 호출할 때는 함수 이름이 아니라 함수 객체를 가리키는 식별자를 사용
  • 함수 이름은 함수 몸체 내부에서만 유효한 식별자이므로 함수 이름으로 함수를 호출할 수 없다.