스코프와 클로저

dice0314·2023년 4월 27일
0

스코프(scope)

  • 스코프는 변수와 함수의 유효 범위를 결정한다.
  • 자바스크립트는 함수 단위의 스코프를 가집니다.
  • 변수를 참조할 때, 스코프 체인을 타고 가장 가까운 스코프에서부터 차례대로 변수를 검색한다.
  • 스코프 체인은 함수가 정의된 시점에 만들어지며, 실행 중에는 변경되지 않는다.
let name = 'Kim';
if (name) {
  let n1 = name;
  console.log(n1); // 'Kim'
}
// n1은 if내부에서 선언되었으므로 외부에서는 사용이 불가능하다.
console.log(n1); // ReferenceError

❗ 전역변수 사용을 최소화 하는 것이 좋다. 잦은 전역변수의 사용은 의도치 않은 부수효과가 발생할 수 있다.

  • 이를 방지하기 위해 Strict Mode를 사용하면 스코프 외부에 전역 변수가 있더라도 스코프 내부에서 선언하지 않았다면 값을 할당할 수 없다.
'use strict';

블록 스코프(Block scope)

  • 중괄호로 둘러싼 범위(if문, for문 등)
  • 화살표 함수

함수 스코프(function scope)

  • function 키워드를 사용한 함수

var, let, const의 차이

1. var

  • 블록 스코프를 무시한다.(예외 있음)
  • 함수 스코프에 영향을 받는다.
  • 값의 재할당이 가능하다.
  • 이름이 똑같은 변수를 재선언 가능하다.
  • var의 사용은 권장되지 않는다.

2. let

  • 블록, 함수 스코프에 영향을 받는다.
  • 값의 재할당이 가능하다.
  • 이름이 똑같은 변수를 재선언 불가능하다.

3. const

  • 블록, 함수 스코프에 영향을 받는다.
  • 값의 재할당이 불가능하다.
  • 이름이 똑같은 변수를 재선언 불가능하다.

클로저

  • 함수와 그 함수 주변의 상태의 주소 조합이다.
  • 함수가 선언될 당시의 스코프를 기억하여, 함수가 해당 스코프 밖에서 호출되어도 스코프 내의 변수와 함수에 접근할 수 있도록 해주는 것이다.
  • 클로저는 함수가 외부에서 호출된 후에도 내부 변수를 기억하고 접근할 수 있는 것을 말한다.
  • 내부 함수가 외부 함수의 변수를 사용하는 경우, 내부 함수와 외부 함수 모두 클로저가 될 수 있다.
  • 함수가 반환되지 않고 내부에서만 실행되는 경우에는 클로저가 아니게 된다.
  • 클로저는 함수가 정의되는 순간 생성된다.
function outerFunction() {
  const outerVar = 'outer';

  function innerFunction() {
    const innerVar = 'inner';
    console.log(innerVar); // inner
    console.log(outerVar); // outer
  }

  return innerFunction;
}
profile
정리노트

0개의 댓글