ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 클로저 (Closure)
    개발공부/CS 2023. 11. 24. 16:55

    클로저의 동작 원리를 이해하면 코드의 유연성, 안정성, 모듈화 등 여러 측면에서 이점을 얻을 수 있다고 한다.

    그래서 오늘은 클로저에 대해 공부하여 프론트엔드 개발자로서 필요한 소양을 쌓아보자!

     

    클로저 (Closure)

    먼저 클로저에 대한 정의를 살펴봤다.

     

    함수가 선언된 시점에서의 환경(스코프)를 기억하고 있는 함수

     

     

    위에 내용은 정말 간단하게 이해할 수 있도록 정리한 것이고, 실제로 찾아봤을 때는 아래와 같은 문구를 확인할 수 있었다.

     

    함수가 속한 렉시컬스코프를 기억하여 함수가 해당 구간 밖에서 실행되어도 그 스코프에 접근할 수 있게 해주는 기능!

    // one: 렉시컬 환경에는 올라갔지만 초기화되지 않아 사용 불가
    // addOne: 렉시컬 환경 O, 사용 가능
    
    let one; // 사용 가능 (하지만 값은 undifined)
    one = 1; // 사용 가능 (값도 1로 초기화 됨)
    
    function addOne(num) {
    	console.log(one + num);
    }
    
    addOne(5);

     

    위의 방식으로 JS에는 없는 캡슐화라는 개념을 구현할 수 있고, 정보 은닉과 캡슐화가 가져다주는 이점들을 얻을 수 있다.

     

     

    렉시컬스코프

    함수를 어디서 호출하는지가 아니라 어디에 선언하였는지에 따라 결정된다.

    JS는 렉시컬 스코프를 따르기 때문에 함수를 선언한 시점에 상위 스코프가 결정된다.

    728x90

    '개발공부 > CS' 카테고리의 다른 글

    브라우저 저장소의 차이점  (0) 2023.11.30
    REST API  (0) 2023.11.24
    호이스팅 (hoisting)  (0) 2023.11.20
    주소창에 google.com을 입력하면 일어나는 일  (0) 2023.11.13
    브라우저 렌더링 원리  (0) 2023.11.09
Designed by Tistory.