본문 바로가기

Webstoryboy

Category

Explanation

JAVASCRIPT

[Javascript] 클로저

클로저

 


클로저

 

Sample1

화살표 함수를 사용하는 기본 예제입니다.

html
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>javascript</title>
    
</head>
<body>
    <button type="button" onclick="myFunction()">+</button>
    <span id="count">0</span>
    
    <script>
        // var counter = 0;
        // function add(){
        //     return counter += 1;
        // }
        // function myFunction(){
        //     document.getElementById("count").innerHTML = add();
        // }

        //변수가 지역변수로 인식하여 한번밖에 작동되지 않는다.
        // function add(){
        //     var counter = 0;
        //     return counter += 1;
        // }
        // function myFunction(){
        //     document.getElementById("count").innerHTML = add();
        // }

        var add = (function(){
            var counter = 0;
            return function(){return counter += 1;}
        })();
        function myFunction(){
            document.getElementById("count").innerHTML = add();
        }
    </script>
</body>
</html>

 

더보기

인스타그램 보기 바로가기

포트폴리오 스터디 바로가기

유튜브 영상보기 바로가기