* 생활코딩 : JavaScript - Execute Context

소스코드

    n0='n0';
    var v0='v0';
    let l0='l0';
    const c0 = 'c0';
    console.log(v0, n0, l0, c0);
    console.log(window.v0, window.n0, window.l0, window.c0);
    function fn2(){
        n2='n2';
        console.log(n0, n1, n2);
        var v2='v2';
        console.log(v0, v2);
        // console.log(v1)
        let l2='l2'; 
        console.log(l0, l2);
        // console.log(l1);
        const c2='c2;';
        console.log(c0, c2);
        // console.log(c1);
    }
    function fn1(){
        n1='n1';
        var v1='v1';
        let l1='l1';
        const c1='c1';
        fn2();
    }
    fn1();
    console.log(n2);
    // console.log(v2, l2, c2);

Global

• 어디서 실행하건 Global에는 접근이 가능하다.
  • 어디서든 접근이 가능하다는 의미에서 Global인 것이고, JavaScript에서는 window라는 객체에 저장된다.

Scope

• 각각의 call stack에서 접근가능한 것들이 나타나는게 scope이다.
  
• 각 call stack의 코드들이 접근할 수 있는 변수들이 담겨있는 것이 scope이다.
• 각 call stack이 폴더라면 그에 해당하는 scope의 변수들은 파일들이라고 봐도 된다.
• 처음 생기는 execute context는 전역에서 접근할 수 있다고 하여 global execute context라고 한다.
• 다음으로 함수를 위해 생긴 것은 function execute context라고 한다.
• 자료형 없이 변수를 선언하면, function 안에서 선언했더라도 Global 객체로 들어간다.
• Global은 바쁘고, 많은 것이 저장된 곳이다.
  • 큰 소프트웨어를 만든다고 했을 때, Global 안에서 변경되거나 삭제되는 등 수정될 가능성이 높다. 따라서 이럴 땐 되도록 Global scope가 아닌 다른 scope에 해당 변수로 접근이 가능하도록 해줘야 한다.
• 여러 scope들이 연결되어 있는 것은 scope chaining이라고 한다. global, script, local scope들이 연결되어 있다.
• function안의 let과 const는 function 안의(local) scope에 생긴다.
• fn2 함수에서 n0와 n1, n2는 모두 global 안에 있기 때문에 fn2에서 접근이 가능하다.
• var은 local로 들어간다.

예상하지 못한 일이 생겼을 때, debugger에서 scope를 통해 어떻게 접근이 잘못되고 있는지 파악할 수 있어야 한다.