자바스크립트 함수 선언

1. 함수를 생성하는 방법

  - 함수 선언문(function statement)

    · 반드시 함수명의 정의되어야 한다.

fucntion add(x, y){
	return x + y;
}//세미콜론을 붙이지 않는 것이 관습

  - 함수 표현식(function expression)

    · 함수 변수를 사용한다.

var add = function(x, y){
	return x + y;
}; //세미콜론을 붙이는 것이 관습
   //자바스크립트 파서는 }로 함수가 끝났다고 판단하지 않기 때문에 오류가 날 가능성이 있다.
var plus = add; // call by reference

  - Function() 생성자 함수

    · 거의 사용하지 않지만 소스 분석 때 볼 가능성이 있으므로 알아두자

var add = new Function('x', 'y', 'return x + y');

console.log(add(3,4)); // 출력값 : 7

 

2. 함수 리터럴

  - 자바스크립트에서는 함수도 일반 객체처럼 값으로 취급된다.

   -> 함수도 객체 리터럴처럼 함수 리터럴을 이용해 함수를 생성할 수 있다.

 

3. 함수 표현식 주의사항

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

console.log(add(3, 4));  // 출력값 : 7
console.log(sum(3, 4));  // Uncaught ReferenceError : sum is not defined

 

  - 함수 표현식에서 사용된 함수 이름이 외부 코드에서 접근 불가능하다.

    · 함수 표현식에서 사용된 함수 이름은 정의된 함수 내부에서 재귀호출, 디버거 등에서 함수 구분할 때 사용된다.

  - add는 자바스크립트 엔진에 의해 아래와 같이 변경된다.

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

4. 함수표현식을 사용한 재귀 함수 구현

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

5. 함수 호이스팅

  - 함수 선언문 형태로 정의한 함수의 유효 범위는 코드의 맨 처음부터 시작한다.

  함수 선언이 소스코드에서 해당 함수를 실행하는 부분보다 뒤에 있다 하더라도 함수 선언을 '끌어올리는 것(hoist)'

add(2, 3); // 5

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

add(3, 4); // 7

  - 함수 호이스팅 때문에 add(2, 3)이 오류가 나야함에도 불구하고 정상적으로 동작함을 볼 수 있다.

    ∴ 함수 표현식로 구현하라

  - 함수 호이스팅이 발생하는 원인은 자바스크립트의 변수 생성과 초기화의 작업이 분리돼서 진행되기 때문