일반적인 프로그래밍 언어에서의 함수 선언과 비슷한 형식이다
function 함수명(){
로직
}
//예시
function fucDeclarations(){
return 'function';
}
fucDeclarations(); // 'function'
JS 언어의 특징을 이용한 선언 방식
var 함수명 = function(){
로직
}
//예시
var funcExpression = function() {
return 'expression';
}
funcExpression(); // 'expression'
함수 선언식은 호이스팅에 영향을 받지만, 함수 표현식은 호이스팅에 대한 영향을 받지 않는 특징이 있다.
호이스팅이란 코드 구현 위치와 관계없이 자바스크립트 해석시 맨 위로 끌어 올려지는 현상을 말한다.
예를 들어보자
//실행
sayHello();
expresssionHello();
//선언식
function sayHello(){
console.log("hello");
}
//표현식
var expresssionHello = function(){
console.log("hello");
}
실행을 한다면 자바스크립트는 호이스팅에 의해 아래와 같이 인식할 것 이다.
//선언식
function sayHello(){
console.log("hello");
}
var expresssionHello;
sayHello(); //"hello"
expresssionHello(); // Uncaught TypeError: expresssionHello is not a function
expresssionHello = function(){
console.log("hello");
}
함수 표현식 expresssionHello에서 var도 호이스팅이 적용되어 지기 때문에 상단으로 끌어올려진다.
하지만 실제 expresssionHello 에 할당된 function은 호출도니 이후에 선언되기에, expresssionHello은 함수로 인식하지 않고 변수로 인식한다.