JavaScript, 싱글 톤을 사용하는 동안 적절한 캡슐화를 유지하는 방법은 무엇입니까?

Question

는 나는이 코드 리뷰에 설명 된대로 내가 전역 네임 스페이스뿐만 아니라 실제로 더 나은 캡슐화와 상속을 오염 아니에요 있도록 더 나은 내 자바 스크립트를 구조화 시작하려면 : https://codereview.stackexchange.com/q/64556/42628

그래서,이 예 (here is a fiddle of it) 걸릴. ..

window.myPage = { 
    init:function(){ 
     //local "Private" declarations 
     var gridHandle1 = new myPage.MyGrid(); 
     gridHandle1.loadGridData(); 
    }, 
    MyGrid: function(){ 
     /* local "Private" declarations */ 
     var dataLoadTimes = 0; 
     var gridDrawn = true; 
     $('#debug').append('grid is drawn<br>'); 

     //This needs to be a public method because 
     //other functions need to reload the grid 
     //at various times. So I will use "this." 
     //instead of "var". "var" would make it a 
     //private method. 
     this.loadGridData = function() { 
      dataLoadTimes = dataLoadTimes+1; 
      $('#debug').append('grid data has been loaded '+dataLoadTimes+' times<br>'); 
     }; 

     this.loadGridData(); 
    } 
}; 

myPage.init(); 
// console.log(gridHandle1); // <--- fails, GOOD, it's not in the global namespace 
// console.log(gridDrawn); // <--- fails, GOOD, it's not in the global namespace 

나는 모든 것이 여기에 무슨 이해하고 "loadGridData는"전용 "에는 myGrid"에 해당하기 때문에 나는 그것을 좋아하지, 그것은 캡슐을 깰 것 "에는 myGrid"외부에서 자신의 기능되는 어떤 사업이 없습니다. 그러나이 방법을 수행하면이 라인 ...

멋진

var gridHandle1 = new myPage.MyGrid();

, 그것은 나를이 같은 많은 그리드를 만들 수 있습니다 ...

var gridHandle1 = new myPage.MyGrid(); 
var gridHandle2 = new myPage.MyGrid(); 
var gridHandle3 = new myPage.MyGrid(); 

을 필요로하지만,이 시나리오에서 난 몰라 많은 그리드가 필요합니다. 나는 오직 하나만 필요로한다. 그래서 내 질문은 어떻게 모든 코드가 동일하게 작동하지만 "클래스"방식을 사용하지 않고 생성자 함수를 사용하여 객체를 인스턴스화하는 싱글 톤으로 수행 할 수 있도록이 코드를 조정할 것인가입니다.

Answer 1

이 작업을 수행하고 끝내려면 몇 가지 방법이 선호됩니다.

개인적으로 나는 다음과 같은 코드 : (JQuery와없이 - 나는 그것을 사용하지 않는)

var myPage = { 
    ua: {} 
} 

$(function() { 
    myPage.mainLayout = new dhtmlXLayoutObject(document.body, "2U"); 
    myPage.mainTabBar = myPage.mainLayout.cells("b").attachTabbar(); 
    myPage.initTab(myPage.mainTabBar); 
}); 


myPage.initTab=function(tb){ 
    tb.xyz(); 
}: 


myPage.ua.load=function(id){ 
    myPage.ua.innerLayout = myPage.mainTabBar.tabs(id).attachLayout("1C"); 
    myPage.ua.grid  = myPage.ua.innerLayout.cells("a").attachGrid(); 
} 

myPage.ua.search = function() { 
    myPage.ua.grid.clearAndLoad([theUrl], "json"); 
}; 

은 가끔 ua을 정의하고 언젠가 나는 myPgae에 묶여 모든 것을 유지.