기술 블로그

[TIL] 클로저 본문

프론트엔드/Javascript

[TIL] 클로저

jaegwan 2023. 11. 6. 21:23
반응형
클로저는 함수와 그 함수가 선언된 렉시컬 환경의 조합- mdn

 

function outer(){
  const name = 'kyle';
  console.log(name)
  return function inner(){
    const greeting = 'hello!'
    console.log(greeting,name)
  }
}
const getKyle = outer() //kyle 
getKyle() //hello!kyle

inner함수는 자신이 생성될 때의 환경을 "기억"한다.

이 환경은 클로저가 선언된 시점의 변수뿐만 아니라, 그 변수들이 존재했던 외부 함수의 스코프를 포함한다.

 

여기서 스코프는 변수가 가지는 유효 범위를 의미한다.

 

렉시컬 환경(Lexical Environment)은 코드가 작성된 구조와 위치에 기반하여 변수와 함수가 어디서 접근 가능한지를 결정하는 환경을 말한다. 즉, 코드를 작성할 때 변수와 함수가 어떤 위치에 있는지에 따라 그들의 스코프가 결정되는 것이다.

 

렉시컬 환경은 두가지 요소를 포함한다.

  • 환경 레코드(Environment Record): 현재 컨텍스트에 관련된 식별자(변수, 함수, 매개변수 등)의 모든 선언을 저장하는 구조입니다. 이는 식별자와 그에 연결된 값을 매핑하는 역할을 합니다.
  • 외부 렉시컬 환경 참조(Outer Lexical Environment Reference): 외부 렉시컬 환경에 대한 참조로, 현재 렉시컬 환경이 생성될 때의 외부 환경을 가리킨다. 이를 통해 스코프 체인이 형성되며, 현재의 실행 컨텍스트가 자신의 외부 환경에 있는 변수를 "기억"하고 접근할 수 있게 된다.

 

즉 함수는 자신이 환경된 렉시컬 환경 (렉시컬 환경 - 외부 렉시컬 환경 참조)을 기억하여 데이터 은닉과 캡슐화, 상태 유지, 모듈패턴구현 등을 수행할 수 있다.

반응형

'프론트엔드 > Javascript' 카테고리의 다른 글

2제곱수 확인  (0) 2023.11.20
[TIL] 객체에 정렬 곁들이기  (0) 2023.11.09
[TIL] 깊은 복사  (0) 2023.10.23
[TIL]꼬리 재귀  (0) 2023.10.13
[TIL]동기와 비동기  (0) 2023.10.13
Comments