[JavaScript] 클로저 (Closure)

안녕하세요. J4J입니다.

 

이번 포스팅은 클로저에 대해 적어보는 시간을 가져보려고 합니다.

 

 

 

클로저란?

 

클로저는 내부 함수가 외부 함수의 환경을 기억하는 것을 의미합니다.

 

예를 들어 다음과 같은 코드가 있다고 가정해보겠습니다.

 

<script>
    function Log() {
        const message = 'message comment: ';

        function getLog(contents) {
            return message + contents;
        }

        return getLog;
    }

    const myLog = Log();
    console.log(myLog('hi!')); // message comment: hi!
</script>

 

 

코드를 해석해보면 myLog라는 변수에는 getLog함수가 저장되어 있는 상황입니다.

 

그리고 myLog에 파라미터를 집어넣어 getLog함수를 실행시켜 봤더니 'message comment: hi!'라는 값이 출력이 되었습니다.

 

일반적으로 getLog함수만을 위와 같이 정의하여 사용하게 된다면 message라는 변수값을 찾지 못해 에러가 발생되는 것이 정상적입니다.

 

하지만 이런 생각과 달리 위의 코드는 정상적으로 실행되었고 심지어 Log함수에서 저장한 message변수값이 그대로 담겨 같이 출력되었습니다.

 

이처럼 getLog라는 내부함수가 Log라는 외부 함수의 환경을 기억하고 있는 것을 클로저라고 합니다.

 

그리고 참고적으로 getLog함수에서 Log함수에 있는 message변수를 사용할 수 있는 이유는 getLog함수의 Lexical Scope이기 때문입니다.

 

 

반응형

 

 

장점

 

클로저 사용이유이기도 하며 장점이기도 한 특징들은 다음과 같은 것들이 있습니다.

 

• 정보 은닉
• 전역변수 사용의 최소화

 

 

가장 먼저 정보 은닉입니다.

 

예를 들어 AES, SHA와 같은 암호화 방식을 사용하여 평문을 암호화한다고 가정해보겠습니다.

 

<script>
    function encrypt() {
        const secretKey = 'secretKey';

        function getEncrypt(plain) {
            return secretKey + plain;
        }

        return getEncrypt;
    }

    const myEncrypt = encrypt();
    console.log(myEncrypt('plainString')); // secretKeyplainString
</script>

 

 

올바른 암호화는 아니지만 만약 위와 같이 코드를 작성한 뒤 myEncrypt함수를 모듈화 하여 다른 곳에서 재사용된다면 해당 모듈을 사용하는 입장에서나 또는 코드를 훔쳐보는 나쁜 사람들(?)은 비밀키가 무엇인지를 명확히 확인할 수 없게 됩니다.

 

왜냐하면 getEncrypt함수에는 secretKey에 대한 정보가 담겨있지 않기 때문이죠.

 

이처럼 어떤 값인지를 명확히 확인할 수 없게 함으로 써 정보 은닉의 장점을 얻을 수 있습니다.

 

 

다음으로 전역변수 사용의 최소화는 말 그대로입니다.

 

값이 변하지 않는 전역 변수 값을 대신하여 클로저를 이용함으로 써 보다 깔끔한 코드를 만들 수 있다는 장점을 제공해줍니다.

 

 

단점

 

클로저의 단점은 함수는 종료되었지만 메모리가 남아있다는 것입니다.

 

내부 함수에서 외부 함수의 변수값을 사용해야 되기 때문에 외부 함수는 종료되었지만 메모리에서 해제되지 않고 계속 저장되어 있어야 합니다.

 

그렇기 때문에 메모리를 효율적으로 사용해야 되는 환경에서 클로저의 사용은 좋은 방법이 아니라고 생각합니다.

 

 

 

 

이상으로 클로저에 대해 간단하게 알아보는 시간이었습니다.

 

읽어주셔서 감사합니다.