샌드박스 패턴

🔶 샌드박스 패턴(sandbox pattern)

• 샌드박스 패턴은 어떤 모듈이 다른 모듈과 그 모듈의 샌드박스에 영향을 미치지 않고 동작할 수 있는 환경을 제공하는 것
• 샌드박스에서는 단일 전역 변수가 생성자 ( 격리된 샌드박스에 있는 코드를 전달하는 이 생성자를 이용하여 객체를 생성함)

장점

1. 단 하나의 전역변수에 의존하는 네임스페이스 패턴의 단점을 여러 개의 샌드박스 객체를 생성함으로 극복
2. 외부 요인으로부터 코드를 격리할 수 있다.
3. 점으로 연결된 긴 이름을 쓸 필요가 없다
4. 런타임(Runtime)에 탐색 작업을 거치지 않게 해준다.

🔹 예시 코드

function Sandbox() {
	    // argument를 배열로 바꾼다
	var args = Array.prototype.slice.call(arguments),
	    // 마지막 인자는 콜백 함수 
	    callback = args.pop(),
	    // 모듈은 배열로 전달될 수도있고 개별 인자로 전달 될 수도 있다
	    modules = (args[0] && typeof args[0] === "string") ? args : args[0],
	    i;

	// 함수가 생성자로 호출되도록 보장(new를 강제하지 않는 패턴)
	if (!(this instanceof Sandbox)) {
		return new Sandbox(modules, callback);
	}

	// this에 필요한 프로퍼티들을 추가
	this.a = 1;
	this.b = 2;

	// "this객체에 모듈을 추가"
	// 모듈이 없거나 "*"(전부)이면 사용 가능한 모든 모듈을 사용한다는 의미입니다.
	if (!modules || modules === '*' || modules[0] === '*') {
		modules = [];
		for (i in Sandbox.Modules) {
			if (Sandbox.modules.hasOwnProperty(i)) {
				modules.push(i);
			}
		}
	}

	// 필요한 모듈들을 초기화
	var m_length = modules.length;
	for (i=0; i<m_length; i+=1) {
		Sandbox.modules[modules[i]](this);
	}

	// 콜백 함수 호출
	callback(this);
}

// 필요한 프로토타입 프로퍼티들을 추가
Sandbox.prototype = {
	name: "nextree",
	getName: function () {
		return this.name;
	}
};

Sandbox ('ajax', 'dom', function (box) {
	// console.log(box);
});

• new키워드를 사용하지 않고 ‘ajax’와 ‘dom’이라는 가상의 모듈을 사용하는 객체를 생성
• 사용할 모듈들을 앞쪽 인자(argument)로 전달해주고, 마지막 인자로는 콜백 함수를 전달