본문 바로가기
JS/시나리오 코드

var 키워드와 호이스팅

by 개발자공부 2024. 7. 19.
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body>
    <h2>index2.html 파일입니다.</h2>

    <script>
      sayHello(); // 함수는 호이스팅이 된다.

      // ES 5에서 var 키워드를 많이 사용했다. (호이스팅 동작을 하는 녀석)

      var n1 = 10;
      var n2;
      var n3 = null;

      // var 키워드를 사용하면 호이스팅(Hoisting) 동작이 발생한다.
      // 1. 변수 호이스팅
      // 2. 함수 호이스팅

      // 1 - 변수 호이스팅
      var hValue = 10; // 변수 이름만 해당 스코프(스크립트와 스크립트 사이) 맨 위로 끌어올려진다.

      //2 - 함수 호이스팅 -- 함수 선언문은 해당 스코프의 맨 위로 올라간다.
      function sayHello() {
        console.log("안녕 스크립트야~");
      }

      // 함수 호출은 괄호 열고 닫기() --> 수행하라는 의미
      sayHello();

      console.log(sayHi);
      // sayHi(); // 함수 표현식은 호이스팅 되지 않는다.
      // 3. 주의!!!!!
      // 함수 표현식은 호이스팅 되지 않는다.

      // 함수를 변수에 담을  수 있다.
      var sayHi = function () {
        console.log("sayHi~~~~~~~~~");
      };
      sayHi();
      console.log(sayHi()); // 그냥 var 이름만 넣으면 함수 자체가 표현된다. 함수를 >>실행<< 하려면 괄호 필수
    </script>
  </body>
</html>

'JS > 시나리오 코드' 카테고리의 다른 글

배열  (0) 2024.07.19
객체 리터럴 표기법  (0) 2024.07.19
new 키워드와 생성자 함수  (0) 2024.07.19
let 키워드 주요 특징  (0) 2024.07.19
형 변환  (0) 2024.07.19