[자바스크립트]- 함수의 호이스팅 / 스코프(함수의 유효범위)

일반함수의 호이스팅

 

일반 함수 정의문(=이름이 있는 함수)의 경우 호이스팅 기능을 지원한다. 
함수의 호이스팅은 함수 정의문보다 함수 호출문이 먼저 등장하더라도 해당 함수를 정상적으로 실행하는 것을 말한다. 

일반 함수가 정의되면 자바스크립트 엔진 메모리 공간 안에 함수의 이름을 이용해 미리 저장해둔다. 
저장된 일반 함수는 해당 함수보다 호출문이 먼저 등장하더라도 호이스팅에 의해 정상 실행이 된다. 

하지만 익명함수 즉, 이름이 없는 함수의 경우 호이스팅 기능이 적용되지 않는다. 
그렇기 때문에 함수정의가 먼저 이루어진 다음 그 후에 함수 호출문이 등장해야 함수가 실행된다. 

기계보다 버튼이 먼저 눌러지더라도 기계가 정상 작동된다.

함수들을 한꺼번에 모아서 맨 위나 아래에 모아놓고 호이스팅 기능으로 버튼을 출력한다.  
브라우저가 코드를 해석해서 읽어나갈 때 일반함수들을 먼저 메모리 공간에 저장해놓고 대기타고 있기 때문에 호이스팅이 가능하다. 
그래서 메인기능 중요한 기능은 일반함수로 만든다. 

[기본형]
1. 일반 함수 정의문

함수명(); <- 함수호출문이 먼저 등장

function 함수명(){
    자바스크립트 코드;
} -> 호이스팅에 의해 정상 실행됨.

함수보다 함수호출을 먼저 해도 함수가 정상실행됨. 

2. 익명 함수 정의문
let 변수명 = function(){
  자바스크립트 코드;
}
        
변수명(); <-익명 함수 호출문. 함수보다 먼저 호출할 수 없다. 호이스팅 기능 X

---

함수 스코프

 

함수의 스코프란 함수의 유효범위를 뜻한다. 

함수도 변수처럼 전역함수(global function)와 지역함수(local  function)로 나눠진다.

 

전역 함수는 자바스크립트 어디서든 사용할 수 있는 함수를 말한다. 

지역 함수는 함수 스코프 안에서만 사용할 수 있는 함수를 말한다. 

 

[기본형]

<script>

↓전역 함수. 스크립트 내부 전역에서 사용할 수 있다. 
function 함수명(){
	자바스크립트 코드;
}  


function 함수명1(){
    ↓지역함수. 함수 안에 들어있는 함수로, 지역의 스코프를 가짐. 
	function 함수명2(){
    	자바스크립트 코드;
        
        함수명2 호출();자리
  }
}  

</script>

 * 지역함수는 전역에서 함수호출문을 부르면 실행되지 않는다. 

지역함수를 실행시킬려면 안쪽에 호출문이 있어야한다. 

함수명1이 실행되야 함수명2가 실행될 수 있어서 보안이 잘 유지되는 함수가 된다. 

 

      //전역함수

      function myFnc() {

        alert("전역함수");

      }

      //전역함수outerFnc가 실행되야 innerFnc가 실행될 수 있다.

      function outerFnc() {

         //지역함수

        function innerFnc() {

          alert("지역함수");

        }

        innerFnc(); // 지역함수 호출. 지역함수를 실행시킬려면 안쪽에 호출문이 있어야한다.

      }

      myFnc();  //전역함수 호출

      outerFnc(); //전역함수 호출

 

지역함수는 바깥의 전역함수와 이름이 겹치더라도 유효범위가 달라서 파괴될 위험성이 적다.  

outerFnc 전역함수를 먼저 호출되야 innerFnc를 호출할 수 있다.