러닝 자바스크립트 7장 정리

 

스코프 

 - 변수와 상수, 매개변수가 언제 어디서 정의되는지 결정해준다. 

 

function f(x) {

       return x + 3;

}

f(5);              // 8

x;                 // undefined

 - x의 스코프가 함수 f이다.  ( 함수를 실제 호출할 떄까지는 함수 바디의 정해진 매개변수가 존재하지 않아야 한다. )

 

 

정적 스코프 

function f1() {

    console.log ('one');

}

function f2() {

    console.log ('two');

}

f2();

f1();

f2();

 - f1이 f2보다 먼저 정의 됐지만 f2가 먼저 실행된다. 

 

const x = 3;

 

function f() {

       console.log(x);

       console.log(y);

}

{

     const y = 5;

     f();

}

 - 함수 f는 자신이 정의될 때 접근할 수 있었던 식별자에는 접근할 수 있지만 호출할 때 스코프에 있는 식별자에 접근할 수는 없다. 

 - 자바스크립트의 정적 스코프는 전역 스코프, 블록 스코프, 함수 스코프에 적용된다. 

 

 

전역스코프 

 - 프로그램을 시작할 때 암시적으로 주어지는 스코프 

 

let name = "Irena";

let age = 25;

 

function greet() {

       console.log ('Hello, ${name}!' );

}

function getBirthYear() {

    return new Date(). getFullYear() - age;

}

 - 함수가 호출하는 컨텍스트(스코프)에 대단히 의존적이다. 

 - 전역스코프에 의존하지 않는것이 중요하다. 

 

 

블록 스코프 

 - 해당 블록의 스코프에서만 보이는 식별자이다. let, const 는 식별자를 블록스코프에서 선언한다. 

 

console.log ('before block');

{

        console.log('inside block');

        const x = 3;

        console.log(x);           // 3 

}

console.log ('outside block; x = ${x}');    //undefined

 - x는 블록안에서 정의되었다. 블록을 나가는 즉시 x도 스코프 밖으로 사라진다. 

 

 

변수 숨기기 

{        //block 1 

   const x = 'blue';

   console.log(x);        // "blue"

}

console.log (typpeof x);

{        /block 2

    const x = 3;

    console.log(x);        // 3

}

console.log (typeof x);     //undifined

 - x는 다른 스코프에 있는 이름만 같은 두개의 변수이다. 

 

 

계층적인 스코프 이해 

{

let x = { color : "blue" };

let y = x;                         // y와 x는 같은 객체를 가리킨다. 

let z = 3;

{ 

    let x = 5;                    // 바깥의 x는 가려졌다. 

    console.log(x);             // 5

    console.log(y.color);      // "blue"

    y.color = "red";

    console.log(z);             // 3  z는 숨겨지지 않았다. 

}

console.log(x.color);          // "red"  

console.log(y.color);          // "red"

console.log(z);                 // 3 

}

 

 

클로저 

 - 함수가 특정 스코프에 접근할 수 있도록 의도적으로 그 스코프에서 정의하는 것 

 

let globalFunc;         정의되지 않은 전역 함수 

{ 

    let blockVar = 'a';           // 블록 스코프에 있는 변수 

    globalFunc = function() { 

            console.log(blockVar);

      }

}

globalFunc();     // "a"

 - globalFunc는 블록 안에서 값을 할당받는다. 

 - 블록스코프와 부모인 전역스코프가 클로저를 형성한다. 이 함수는 어디서 호출하던 클로저에 들어있는 식별자에 접근

   가능하다. 

 

 

즉시 호출하는 함수 표현식 

(function() {

     // IIFE 바디

}) ();

 - IIFE의 형태 

 

const message = (function()  {

  const secret = "I'm secret!";

  return 'The secret is ${secret.length} characters long.';

}) ();

console.log (message);

 - 변수 secret은 IIFE의 스코프안에서 안전하세 보호되며 외부에서 접근이 불가능하다.