너의 전차를 들어라!(JavaScript의 변수)

그 핵심은 조립이 하나의 조작 순서 문제라는 것이다.JavaScript 코드는 컴파일링과 실행의 두 단계를 거칩니다.

성명var,let,const과function)은 코드를 컴파일하는 동안 먼저 읽는다.

부치(thing = value와 함수 호출(someFunction())는 실행 과정에서 초 단위로 읽는다.

var, let와 const 성명 간의 주요 차이점은 초기화 방식에 있다.var와 let는 변수를 사용하지 않거나 어떤 값도 가리키지 않는 상황에서 초기화할 수 있다.값이 없는 상태에서 초기화 const 를 시도하면 인용 오류가 발생합니다.
코드의 어느 위치에서든 var 변수와 let 변수를 설명하고, 다른 어느 위치에서든 변수를 분배할 수 있습니다.const를 사용할 때는 반드시 성명과 값을 동시에 부여해야 한다.
컴파일 단계에서 변수 성명은 코드의 맨 위, function 성명의 아래, 그리고 기타 모든 내용의 위로 올라갔다.
몇 가지 예제 코드:

    console.log(thisVar)
    var thisVar = "Hoisted" 

    // compiles to: 
    var thisVar
    console.log(thisVar)
    thisVar = "Hoisted"

이 코드를 실행하려고 하면 다음과 같은 결과가 발생합니다.

    console.log(thisVar)
    var thisVar = "Hoisted"

    //OUTPUT: 
    > undefined

읽기 var thisVar 성명은 함수 호출 (이 예는 console.log() 을 한 후에 결과가 undefined 될 수 있습니다. 프로그램이 변수가 존재하는 것을 알고 있지만 console.log() 실행할 때 어떤 값을 가리키는지 알 수 없기 때문입니다.
향상된 또 다른 중요한 부분은 코드에서 설명하기 전에 호출function하는 능력이다.
앞에서 말한 바와 같이 var 변수와 function 성명은 모두 컴파일 기간에 먼저 읽은 것이다.함수 호출은 실행 단계에서만 읽기/실행됩니다.이 코드 처리 순서에 따라 우리는 이렇게 할 수 있다.

    belowCall()

    function belowCall(){
        console.log("I was called before I was declared!")
    }

    //OUTPUT:
    > undefined
    > I was called before I was declared!

왜 이러지?컴파일 단계에서function 호출은 기본적으로 보이지 않기 때문이다.컴파일 단계에서 모든 function 호출을 건너뛰고 호출할 때 실행할 코드를 읽은 다음, 실행 단계에서 이 호출을 읽고 실행합니다.
그러나 함수(함수 표현식)를 가리키는 변수를 사용하여 이 작업을 시도하면 문제가 발생합니다.

    varFunction();

    var varFunction = function(){
        console.log("I was called before I was assigned!")
    }

    //OUTPUT:
    > TypeError: varFunction is not a function

무슨 꿍꿍이수작이야!?다음은 젠장맞은 것이다.

    // How the compiler reads the code above: 

    var varFunction; 

    varFunction(); 

    varFunction = function(){
        console.log("I was called before I was assigned!")
    }

기억하다변수 값은 실행 단계에서 읽지만 함수 호출 후에 읽습니다.
위에서 발생한 일은 코드를 알려주고 var 라는 varFunction 성명이 있는데, 우리는 varFunction() 호출을 시도하고 varFunction 그것이 무엇을 가리키는지 알려주려고 한다.
코드가 실행될 때, 우리 자바스크립트 프로그램은 varFunction 함수 표현식인지, 존재하는 변수인지만 모른다.따라서 자바스크립트는 이전의 undefined 성명처럼 되돌아오지 않고var "헤이, 이 함수를 호출하라고 했는데 아직 알려주지 않아서 화가 났어!"
그래.그럼 var의 잘못일지도 몰라요.우리 let로 대체해 보자...

    thisFunction();

    let thisFunction = function(){
        console.log("I was also called before I was assigned!")
    }

    //OUTPUT: 
    > ReferenceError: can't access lexical declaration `thisFunction' before initialization

그래도 안 돼!
그러나 이것은 적어도 도움이 된다. 왜냐하면 자바스크립트가 우리에게 준 오류는 기본적으로 '헤이, 네가 어떤 물건을 순서를 잘못 놓은 것 같다.' 라고 말하는 것이기 때문이다.함수 표현식을 호출한 후에도 그것을 분배할 수 없지만, let 을 사용할 때 오류 메시지가 최소한 더 많은 정보를 제공합니다.
(방주로 코드에서 다른 let 변수를 사용하려고 시도할 때 값을 부여하기 전에 발생하는 오류와 같거나 const 성명/값을 사용하여 비슷한 작업을 시도할 때 발생하는 오류와 같습니다)
중요한 수확:
영원히 사용하지 마세요 var 성명.그냥그러지 마.그것들은 심각한 파괴를 초래할 것이며, 이미 크게 개선된 let 와 const 성명으로 대체되고 시대에 뒤떨어질 것이다.
컴파일/실행 순서를 기억하십시오: 함수 성명 > 변수 성명 > 함수 호출 > 변수 부여.이 순서는 컴파일링과 실행 단계에서 코드에 무엇이 나타날지 이해하는 데 도움이 됩니다.