졸업작품에서 함수를 사용할 때 그게 표현식인지 선언문인지도 모르고 막써서 코드가 더러웠지만, 그때는 그게 최선인줄 알았다. 그래서 이번에 함수를 제대로 배우고 코드를 다시 고쳐서 배포해보고싶다.
함수를 선언하는 방법은 선언문, 표현식, 화살표, 생성자로 총 4가지의 방법이 있지만,
여기서는 함수의 선언문과 표현식의 특징과 호이스팅 여부만 다뤘다.
#1
add(1,2) // 3
function add(x, y) {
return x + y;
}
함수 선언문은 var키워드 선언처럼 런타임 이전에 초기화가 돼서 호이스팅이 이루어진다. 그치만 구분을 짓기 위해 함수 호이스팅 이라고 부른다.
함수 선언문은 런타임 이전에 위 코드의 예시로 add라는 이름을 가지는 식별자가 암묵적으로 생기고, 함수 객체를 할당한다. 그리고 함수도 객체 타입이라서 암묵적으로 생성된 식별자는 함수 객체의 참조값을 가리킨다.
여기서 알고 넘어가야 할 것은, 함수의 선언문은 런타임 이전에 함수 이름과 같은 이름으로 식별자를 생성해야 하기 때문에 함수 이름을 생략할 수 없다는 사실이다.
함수 선언문은 함수 호이스팅이 되고, 기명 함수이다.
#2 // 기명
var add1 = function add2(x, y) {
return x + y;
}
#3 // 무기명
var add1 = function (x, y) {
return x + y;
}
위 코드를 보면, 함수 선언문이 add1 변수에 할당되어진 것 처럼 보인다.
function키워드부터 시작되는 구문은 함수 선언문이랑 똑같이 생겼지만, 얘는 선언문이 아니라 표현식이다. 즉 리터럴이다. 동시에 #1코드에서 function키워드 뒤의 구문은 표현식이 아닌 문이다.
그냥 선언문이랑 형태만 똑같다고 생각하면 된다. 그래서 보통은 이런 선언에 있어서 헷갈림을 방지하고자 표현식에서의 함수 이름 add2를 지우고 무기명으로 함수를 할당한다.
add1은 변수(식별자) 이기때문에 지우면 안된다.
함수 표현식 초기화 과정은 변수랑 같게 생각하면 된다. 따라서 var키워드를 사용하여 함수를 할당하면 호이스팅이 발생한다. 그치만 호이스팅은 골치아프니까 굳이 이럴필요는 없다고 생각한다..
함수 표현식은 변수 호이스팅만 되고, 기명으로 선언해도 되지만 무기명으로 사용하면 보기 좋다.