함수정의

자바스크립트에서 함수를 생성하는 방법은 3가지가 있다.

1. 함수 선언문
2. 함수 표현식
3. Function() 생성자함수

 

우선 함수 선언문과 함수 표현식에서 함수를 생성하는 함수 리터럴의 개념을 보자

• 자바스크립트에서 함수는 일반 객체처럼 값으로 취급된다.
• 때문에 객체 리터럴 방식으로 일반 객체를 생성하는 것처럼, 함수 리터럴을 이용해 함수를 생성할 수 있다.

function add(x,y){
  return x+y;
}

 

 

1. 함수선언문 방식으로 함수 생성하기

• 함수 선언문 방식은 앞에서 설명한 함수 리터럴 형태와 같다.
• 다만 주의할 점은 반드시 함수명이 정의되어 있어야 된다는 점이다.

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

console.log(add(1, 2)); //3

 

2. 함수 표현식 방식으로 함수 생성하기

• 자바스크립트에서는 함수도 하나의 값처럼 취급된다(일급객체)
• 따라서 함수도 숫자나 문자열처럼 변수에 할당하는 것이 가능하다.
• 함수 리터럴로 하나의 함수를 만들고, 여기서 생성된 함수를 변수에 할당한다.

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

console.log(add(2, 3)); //5

함수 변수 add가 실제로 참조하는 두 수를 더하는 함수의 이름이 없다.. 이를 익명함수라고 한다!

참고로 함수 이름이 포함된 함수 표현식을 기명 함수 표현식이라고 한다. 예를들어

var add = function sum(x, y) {
    return x + y;
}

console.log(add(2, 3)); //5
console.log(sum(3, 4));
//Uncaught ReferenceEerror : sum is not defined 에러발생

sum(3,4)는 에러가 난다. 왜 에러가 날까??

• 바로 함수표현식에서 사용된 함수 이름이 외부 코드에서는 접근이 불가능하기 때문이다.
• 함수 표현식에 사용된 함수 이름은 정의된 함수 내부에서 해당 함수를 재귀적으로 호출하거나, 디버거 등에서 함수를 구분할 때 사용된다.

 

그렇다면 함수 선언문으로 정의된 add() 함수는 어떻게 함수이름으로 호출이 가능한지 의문이 생긴다.

함수 선언문 형식으로 정의된 add()함수는 자바스크립트 엔진에 의해 다음과 같이 바뀐다!

var add=function add(x,y){
    return x+y;
}

 

아직 이해가 잘 안될 수 있으니 팩토리얼을 구하는 함수를 통해 한번 더 확인하자

 

var factorialVar = function factorial(n) {
    return n * factorial(n - 1);
};

console.log(factorialVar(3)) //6
console.log(factorial(3)) // factorial is not defined

• factorialVar는 외부 코드에서 접근이 가능하지만 factorial은 외부에서 접근이 안되는것을 확인할 수 있다.
• 하지만 factorial 함수 내부에서는 factorial에 접근하는 것이 가능하다!

 

3. Function() 생성자 함수 생성하기

var add = new Function('x', 'y', 'return x+y');
console.log(add(3, 4)); //7

• 사실 생성자 함수를 사용해 함수를 생성하는 방법은 자주 사용되지 않는다.
• 하지만 다른 사람이 작성한 소스를 분석할 때 나올 수도 있으니 알아놓기만 하면 될듯

 

 

 

참고

book.naver.com/bookdb/book_detail.nhn?bid=7400243