본문 바로가기
프로그래밍/JavaScript

자바스크립트 클로저 란?

by 원피스랜드 2020. 12. 23.
반응형



클로저란 무엇인가 ?

클로저는 외부함수(포함하고 있는)의 변수에 접근할 수 있는 내부 함수를 일컫습니다. 스코프 체인(scope chain)으로 표현되기도 합니다. 클로저는 세가지 스코프 체인을 가집니다: 클로저 자신에 대한 접근(자신의 블럭내에 정의된 변수), 외부 함수의 변수에 대한 접근, 그리고 전역 변수에 대한 접근. 이렇게 3단계로 구분할 수 있습니다.


내부 함수는 외부 함수의 변수뿐만 아니라 파라미터에도 접근할 수 있습니다. 단, 내부 함수는 외부 함수의 arguments 객체를 호출할 수는 없습니다. (하지만, 외부 함수의 파라미터는 직접 호출할 수 있습니다.)

 

1. 클로저 예제 : 

function showName(firstName, lastName) {

    var nameIntro = "Your name is ";

    // 이 내부 함수는 외부함수의 변수뿐만 아니라 파라미터 까지 사용할 수 있습니다.

    function makeFullName() {

        return nameIntro + firstName + " " + lastName;

    }

    return makeFullName();

}

showName("Michael", "Jackson"); // Your name is Michael Jackson


결과 : "Your name is Michael Jackson"


2. jquery의 전형적인 클로저 사용예

 



$(function() {

    var selections = [];

    $(".niners").click(function() { // 이 클로저는 selections 변수에 접근합니다.

        selections.push(this.prop("name")); // 외부 함수의 selections 변수를 갱신함

    });

});​





반응형

댓글