자바스크립트 객체, Scope, Closure에 관하여...

자바스크립트에서 너무너무 중요한 부분을 배우게 되었다...
일단 26일에 배운 객체를 다루는 새로운 방법을 나열해 보자.

객체 안의 배열만 골라낼 때 Array.isArray(obj[arr]) 이런식으로 사용하자.
객체 안에서 obj[odd] % 2 !== 0 && typeof obj[odd] === 'number' 과 같은 계산식 적용된다.
부등호를 사용할 때는 >=, <= 이런식으로 사용하자.

Primitive(원시) & Reference(주소or 참조) 자료형
원시 자료형이 할당될 때에는 변수에 값(value) 자체가 담기고, 1개의 정보만 담고 있다.

ex) let word = 'boolaboolla'

참조 자료형이 할당될 때는 보관함의 주소(reference)가 담긴다.

let x = {foo:3} 

let x = {foo:3} 선언 후 let y = x; 할당하고 y.foo = 2 이런식으로 바꾸면 x값도 바뀐다.
같은 주소를 참조하고 있기 때문에...

재할당 할것만 let으로 선언한다. 기본적으로 const 키워드로 선언하면, 재할당은 불가능.
const는 값이 변하지 않는 변수, 즉 상수를 정의할 때 사용한다.

Scope = 변수의 유효범위
함수 안에 있는 변수는 밖에서 사용할 수 없다.
함수가 선언되면 함수 자신만의 Scope를 가진다.

※ JS는 기본적으로 function 단위로 자신만의 Scope를 가짐.

local에서 Global을 참조할 수 없음.
※ 만약 함수 안에서 같은 이름의 전역변수를 다시 선언하지 않고 가져와 쓴다면 그 전역변수의 값은 함수의 계산대로 바뀐다.

Block = {}중괄호로 시작하고, 끝나는 단위
function = 함수를 정의하는 단위

for 문에 쓰인 i의 경우 그 블럭 {}의 범위를 벗어나면 쓸 수 없다.
즉, console.log()를 밖에서 쓰면 i값을 확인해 볼 수 없다.

Global Scope에서 선언된 함수, var키워드를 이용해 선언된 변수는 window 객체와 연결됨

※ 선언 키워드 없이 변수를 초기화 또는 재지정 하면 전역 변수로 취급된다.
※ 실수를 방지하고 싶을 때 'use strict'; 를 사용하자. (파일을 저장한 상태에서만 사용 가능)

Closure = 외부 함수의 변수에 접근할 수 있는 내부 함수로 어떤 경우에 유용한지 알아두자.

function outerFn() {
   let outerVar = 'outer';
   console.log(outerVar);

   function innerFn() {      //여기서부터
      let innerVar ='inner';
      console.log(innerVar);
   }   //여기까지의 함수가 클로저 함수이다.
   return innerFn;
}

클로저는 "함수와 함수가 선언된 어휘적(lexical) 환경의 조합"을 말한다.
tip. outerFn()() 이런식으로 함수를 연속으로 실행할 수 있다.

커링: 함수 하나가 n개의 인자를 받는 대신, n개의 함수를 만들어 각각 인자를 받게 한다.

function adder(x) {  // X값이 100
   return function(y) { // (2) 값이 y로
      return x + y; // 100 + 2 리턴
   }
}
adder(2)(3); //5
 
let add100 = adder(100); ※ X의 값을 고정해 놓고 재사용할 수 있다.
add100(2) = // 102
add100(10) = // 110

클로저 모듈 패턴: 변수를 스코프 안쪽에 가두어 함수 밖으로 노출 시키지 않는 방법

function makeCounter() {
    let privateCounter = 0;
    return {
        increment: function() {
            privateCounter++;
        },
        decrement: function() {
            privateCounter--;
        },
        getValue: function() {
            return privateCounter;
        }
    }
}

엄청나게 중요한 정보들이 내 머리로 쏟아져 내렸다. 급하게 생각하지 말고 천천히 확실하게 이해하고 넘어가자.