자바스크립트 개념 1

Jun·2021년 6월 17일
0

스코프에 대해

스코프는 폴더 구조에 비유할 수 있다. 다른 directory 에서는 폴더이름이 같아도 상관없지만
같은 directory 에서는 폴더이름을 같게 생성할수 없다. 스코프에는 전역스코프 지역 스코프 있는데 전역 스코프는 코드 어디에서도 사용할 수 있어 전역 변수이고,
지역 스코프는 함수 내부에 있는 지역 변수이다.
var은 함수 코드 함수 몸체 만을 지역 스코프로 인정함 이외에는 전역스코프. 함수의 코드 블록만 지역 스코프로 인정 하지만 let 또는 const 키워드는 블록 레벨 스코프 지원함.
요약
함수레벨 스코프와 / 블록레벨 스코프/ 레시컬 스코프가있다.

  • 함수레벨 스코프

    • 코드 블록이 아닌 함수에 에서만 허용하는 지역 스코프. (var가 이에 해당함)
  • 렉시컬 스코프

    • 정적 스코프 라고도 불린다. 스코프가 변경이 되지않고 함수가 생성되는 순간 상위 스코프가 정적으로 정해진다. (대부분의 언어가 이런식으로 동작한다.)
    • 함수를 어디에 정의했는지 보다 어디에 정의 했는지가 중요하고 이에 따라서 상위 스코프를 정한다.
  • 블록레벨 스코프

    • 함수,if문 for문 while문 try/catch 문 등을 지역 스코프로 인정하는 것을 블록 레벨 스코프 라고부름. ( let const 가 이에 해당함.)

클로져에 대해

function outer(){
    const x = 100;
    const inner = function(){
        console.log(x);
    }
    return inner
}

const displayX = outer();
displayX();

클로저는 렉시컬 환경이다. 렉시컬 환경이란 함수가 생성되어질때 상위 함수의 스코프를 기억하고있어 외부 함수의 변수 참조를 가능하게한다. 외부함수보다 내부함수의 생명 주기가 길어야하고 외부함수의 생명주기가 끝나도 내부함수가 외부함수의 변수를 참조할수 있어야 한다.
상위 변수에 묶여있는 함수 === 클로져

클로져의 사용 예제

클로져 조건

  • 함수내 또다른 함수가 있어야한다. (상위함수에 하위함수가 있어야함).
  • 외부함수가 호출되어 내부 함수를 리턴하여 종료되더라도 내부함수는 여전히 외부함수의 변수를 참조할 수 있어야한다.
  • 내부함수는 익명함수여야하며 외부함수로 리턴되어야함.
function foo() {
 const x = 10;
 const y = 20;

 function bar() {
   console.log(x);
 }

 return bar;
}

const closure = foo();
closure();

------------------------

function changeNum() {
 let num = 0;

 return function () {
   return num++;
 };
}

let increaseNum = changeNum();

console.log(increaseNum());
console.log(increaseNum());
console.log(increaseNum());

변수 선언, 초기화, 할당

변수란 = 메모리 공간에 정보들을 저장하기 위해 사용하는 이름.
변수 선언이란 = 값을 저장하기 위한 메모리 공간을 확보하고 변수 이름과 확보된 메모리 공간의 주소를 연결 해서 값을 저장 할 수 있게 준비 하는것
선언 = 변수를 생성하는 것. 메모리 공간을 확보하고 변수 이름과 메모리 공간의 주소를 연결 시켜주는 것.
할당 = 변수에 값을 저장하는 것을 할당 이라고 한다.
초기화 = 선언한 변수에 최초로 값을 지정해주는것 자동으로 할당이 되지않기 때문에 초기화를 해줘야한다.

가비지 컬렉터란?

할당한 메모리 공간을 검사하여 더이상 사용되지 않는 메모리를 해제하는 것말 말한다.
어떠한 식별자도 참조하지 않는 메모리 공간을 의미함. 자바스크립트 엔진은 메모리를 자동으로 관리함.

호이스팅

자바스크립트 엔진은 한줄씩 순차적으로 실행하기에 앞서 모든 선언들 (함수포함) 을 찾아 먼저 실행한다.
호이스팅은 변수 선언을 최상위로 끌려 올려 진 것처럼 동작하는 것.
var은 런타임 이전에 선언 단계와 초기화 단계가 한번에 실행되기 때문에 선언문 이전에 var을 참조할 수 있다.
하지만 let 또는 const는 선언과 초기화가 따로 이뤄진다. 런타임이 실행되면 선언 단계가 실행되지만 초기화 단계는 이뤄지지 않는다.
그래서 초기화가 이루어 질때까지 referenceError가 발생한다. 선언단계 (런타임 시작) 부터 초기화가 이루워져 참조가 가능 하기 전까지를 Temporal Dead Zone 이라고 한다.
let 이 호이스팅이 발생하는 것처럼 보이지만 reference error가 나와 참조가 불가능 하는 것을 보면 호이스팅이 이뤄지나 초기화가 이뤄지지않는 다는 것을 알수 있다.

0개의 댓글