공부하는 블로그

클로저 (Closure) 본문

Develop/JavaScript

클로저 (Closure)

모아&모지리 2018. 2. 20. 10:10

함수내에 함수 정의 및 선언에서 설명한 것과 같이 내부함수는 정의 및 선언되 함수내의 변수에 접근하여 사용할 수 있다.

이는 전역변수를 선언하고 함수 내에서 사용하는 것과 같은 의미라고 볼 수 있다.

이렇게 자신을 둘러싼 함수내의 변수를 접근할 수 있는 내부함수를 Closure라고 하며,

Closure를 통해 함수내의 지역변수에 값을 수정하거나 접근하여 사용할 수 있다.


ex) 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!Doctype html>
<html>
<head>
    <title> </title>
    <script> 
        
    // 이 함수는 외부함수로 자신만의 변수 유효범위를 가지고 있다.
    function outerFunc() {
    // 이 변수는 지역변수로 외부에서 접근할 수 없다.
    var num = 0;
    // 이 함수는 내부함수로 num이라는 변수에 접근할 수 있다.
    // 이러한 내부함수를 "closure"라고 한다.
    function innerFunc() {
    // num의 값을 1증가시켜서 반환한다.
    return num++;
    }
    // 외부함수를 실행시키면 내부함수를 반환한다.
    return innerFunc;
    }
    var func = outerFunc();
        alert(func()); // Closure를 사용하면 outerFunc 지역변수에 접근하여 값을 지정하거나 수정할 수 있다.
        alert(func());
 
    </script>
</head>
<body>
</body>
</html>
cs


18년 3월 19일 추가


클로저 개념 정리: 함수 내부에 만든 지역변수가 사라지지 않고 계속해서 값을 유지하고 있는 상태를 말한다.

내부함수에서 내부함수를 포함하고 있는 함수(외부함수)의 변수 A를 사용하는 구조로 표현 할 때 내부 함수를 클로저 함수라고 부른다.

// 변수가 메모리에서 제거되지 않고 계속해서 값을 유지하는 상태를 클로저라고 부르며 내부에 있는 함수를 클로저함수라고 부름


문법


클로저를 사용하면 좋은점

연관있는 변수와 기능(중첩함수)을 하나의 함수로 묶어 독립적으로 실행시킬 수가 있다. 달리 말하면 함수 내부에 데이터가 만들어지기 때문에 함수 외부에서 수정 할 수 없는 보호된 데이터를 만들 수 있습니다.

'Develop > JavaScript' 카테고리의 다른 글

JavaScript 객체  (0) 2018.02.20
JavaScript 정규표현식  (0) 2018.02.20
arguments 객체  (0) 2018.02.20
(JavaScript)현재 시간을 구하는 방법  (0) 2018.02.20
(JavaScript) 자바 스크립트 시작하기  (0) 2018.02.20