[JavaScript] 선언적 함수

아래와 같은 방식으로 생성한 함수를 선언적 함수라고 한다.

function func() {

}

 

 

자바스크립트에서는 동일한 이름의 함수를 정의할 수 있다.

<script>
	function func() { alert('함수 A'); }
	function func() { alert('함수 B'); }
 	func(); 	// 함수 B
</script>

위와 같이 정의해도 오류가 발생하지 않으며, func()은 재정의된다.

따라서 마지막에 함수를 실행하게 되면 '함수 B'가 출력하게 된다.

 

 

마찬가지로 익명 함수를 재정의 하여도 오류가 발생하지 않는다. 결과는 위와 같다.

<script>
	var func = function() { alert('함수 A'); };
	var func = function() { alert('함수 B'); };
	func();
</script>

 

 

변수를 선언하기 이전에 함수를 먼저 호출하면 오류가 발생한다.

<script>
	func();
	var func = function() { alert('함수 A'); };
	var func = function() { alert('함수 B'); };
</script>

 

 

하지만 선언적 함수를 사용하면 오류가 발생하지 않는다.

<script>
	func();
	function func() { alert('함수 A'); };
	function func() { alert('함수 B'); };
</script>

웹 브라우저는 script 태그 내부의 내용을 한 줄 씩 읽기 전에 선언적 함수부터 읽는다.

따라서 func() 함수 호출은 제일 마지막에 실행된다.