CH Blog | 기술 블로그

이채현

💡 Javascript closure

• 클로저는 먼저 자바스크립트 변수의 유효범위를 이해해야한다.
• 클로저를 명확히 무엇이다라고 말하기는 어렵다.

function returnX(){
    return 'x';
}

const x = returnX()
console.log(typeof x) // string

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

function returnX() {
    let x = 'x';
    return function returnY() {
        return x + 'y';
    }
}

const x = returnX()
console.log(typeof x) // function => return 값이 함수 덩어리이기 때문에

const x = returnX()();
console.log(typeof x) // string
function sum(num1) {
    return function (num2) {
        return num1 + num2;
    };
}

const sum5 = sum(5); // 숫자5가 계속 바인딩되어 있는 상태
console.log(sum5(10)); // 15

은닉화

function privateData() {
    let temp = 'a';
    return temp;
}

const result = privateData(); // privateData를 실행시켜야만 temp값을 알 수 있다.
console.log(result);

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

function privateData() {
    let temp = 'a';
    return {
        value: () => {
            return temp;
        },
        changeValue: (newVal) => {
            temp = newVal;
        }
    };
}

const private = privateData();
console.log(private.value()); // a
private.changeValue('b');
console.log(private.value()); // b

활용사례