본문 바로가기
JavaScript

자바스크립트 모듈 패턴

by SSaMKJ 2013. 10. 2.

자바스크립트 모듈 패턴


closer 를 이용한 private 변수 선언


var SpriteFactory = (function () {
    "use strict";// 엄격한 문법. 참조1
    var index = 0,//--- private 영역 시작
        sprites = {},
        Sprite = function (config) {
            return {
                index: index++,
                x: config.x || 0,//config.x가 있으면 해당 값을 x에 넣고, 없으면
// 0을 넣는다.
                y: config.y || 0,// ||는 or이기 때문에 앞에 것이 true 즉, 값이
// 있으면 그 값을 가지고 가고, 없으면 다음을 확인한다.
                width: config.width || 0,
                height: config.height || 0,
                background: config.background || '#fff'
            };
        };//--- private 영역 끝

    return {
        generateSprite: function (config) {// public 함수
            config = config || {};
            var s = new Sprite(config);// 새로운 요정(Sprite) 클래스를 만든다.
            sprites['sprite_' + s.index] = s;// map 처럼 사용한다.
        },
        deleteSprite: function (index) {// public 함수
            var sprite = this.getSprite(index);// index는 private이기 때문에 외부에서
// 통제를 할 수 없기 때문에, 해당 클래스만 null로 바꿔도 무방.
            if (sprite) { sprite = null; }
        },
        getSprite: function (index) {// public 함수
            if (sprites.hasOwnProperty('sprite_' + index)) {
                return sprites['sprite_' + index];
            }
        }
    };
}());

SpriteFactory.generateSprite({});
SpriteFactory.generateSprite({
    x: 90,
    y: 20
});

theSprite = SpriteFactory.getSprite(1);

(출처:http://yahooeng.tumblr.com/post/62383009835/javascript-modules-amd-and-the-road-ahead)

(참조1:http://msdn.microsoft.com/ko-kr/library/ie/br230269(v=vs.94).aspx)

주석은 내가.


closer는 리턴형 함수라고 말 할 수 있다. 자세한 사항은 링크(http://learningfinest.blogspot.kr/2013/10/understand-javascript-closures-with-ease.html?spref=fb)참조.


private 시작영역~ private 영역 끝

이 부분은 외부에서 접근이 불가하다. 왜냐하면 SpriteFactory가 리턴하는 것은 generateSprite(), deleteSprite(), getSprite 이렇게 밖에 없기 때문이다.


그 해당 리턴 함수를 closer라 부르며, 자바로 치면 public method가 되는 것이다.


응용하면 javaScript에서도 private 변수 선언이 가능해진다.



'JavaScript' 카테고리의 다른 글

javascript clone object - deep copy  (0) 2014.01.14
window.open post 방식으로 띄우기  (0) 2013.12.29
console log 찍기.  (0) 2013.07.26
javaScript에서 함수를 동적으로 생성하기.  (0) 2013.07.26
javaScript : uniqueId 만들기.  (0) 2013.07.26

댓글