JavaScript의 네임 스페이스 스키마

나는 Java의 세계에서 왔습니다. Java에는 패키지 (예 : "com.mycompany.billing")와 패키지 내에있는 클래스 (예 : "BillProcessor")가 있습니다. 내가 일하는 회사는 새로운 프로젝트를 시작하고 좋은 네임 스페이스 스키마를 결정해야합니다. Java에서 JavaScript로 어떻게 수행되는지 예상하고 있습니다. 예를 들어, "com.mycompany.billing"네임 스페이스와 "BillProcessor.js"와 같은 파일에있는 클래스가 있습니다. 또한 단위 테스트가 필수적이므로 단위 테스트가 쉬운 구조가 필요합니다.JavaScript의 네임 스페이스 스키마

누군가 좋은 접근 방법을 제안 할 수 있습니까?

나는 좋은 해결책을 생각해 냈습니다. 제발 조언 해주세요. 예를 들어 결제 페이지를 만듭니다. 4 개 파일이 있습니다

는

$ {루트} /billing.html - 신용 카드

$ {루트}에 이름 입력 상자가 들어 /js/com/mycompany/common/common.js -이 초기화는

$ {루트} /js/com/mycompany/common/Url.js 처리 로깅 및 오류 - 클래스 Ajax 호출을 수행하는 데 사용됩니다

$ {루트}/JS/COM/mycompany/aproject /billing.js - 결제 페이지의 내용을 초기화합니다.

예를 들어, common.js에는 다음이 포함됩니다.

var com_mycompany_common_common = function() { 

    function log(message) { 
     console.log((new Date()) + ': ' + message); 
    } 

    function init() { 
     window.onerror = function(message) { 
      log('Unhandled error: ' + message); 
     } 
    } 

    return { 
     log: log, 
     init: init 
    } 
}(); 

$(document).ready(function() { 
     try { 
      com_mycompany_common_common.init(); 
     } catch (e) { 
      console.log('Error during initialization: ' + e); 
     } 
});

Url.js :

function com_mycompany_common_Url(url) {  
    this.url = url; 
} 

com_mycompany_common_Url.prototype.addParameter(name, value) { 
    this.url += '?' + name + '=' + value; 
} 

com_mycompany_common_Url.prototype.ajax() { 
    com_mycompany_common_common.log('Send ajax to: ' + this.url); 
}

billing.js

billing.html

<!DOCTYPE html> 

<html> 
    <head> 
     <title>Billing</title> 
    </head> 
    <body> 
     Enter name on credit card: <input type="text" id="ccName" /><br><br> 
     <button id="submitButton">Submit Payment</button> 

     <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
     <script type="text/javascript" src="js/com/mycompany/common/common.js"></script> 
     <script type="text/javascript" src="js/com/mycompany/common/Url.js"></script> 
     <script type="text/javascript" src="js/com/mycompany/aproject/billing.js"></script> 
    </body> 
</html>

출처

2012-01-27 SBel

http://eloquentjavascript.net/chapter9.html은 주제를 자세히 설명합니다. – millimoose

[FullCalendar의 소스 코드] (https://github.com/arshaw/fullcalendar) –

@TomIngram을 통해 찾아 보시기를 제안드립니다. 내가보고있는 것을 좋아합니다. JavaScript에 대한 객체 지향 접근법을 올바르게 이해하고 있습니까? 흠, 그는 내가 생각하기에는 좋지 않은 자동화 된 단위 테스트 접근법을 사용하지 않고있는 것을 알고 있습니다. – SBel

var com_mycompany_aproject_billing = function() { 

    function init() { 
     $('#submitButton').click(function() { 
      Url url = new com_mycompany_common_Url('http://bla.com/process/billing'); 
      var creditCardName = $('#ccName').val(); 
      url.addParameter('name', creditCardName); 
      url.ajax(); 
     } 
    } 

    return {init: init}; 
}(); 

$(document).ready(function() { 
     try { 
      com_mycompany_aproject_billing.init(); 
     } catch (e) { 
      console.log('Error during initialization: ' + e); 
     } 
});

사람들이 달성하기 위해 객체 리터럴 패턴을 사용하는 대부분의 시간 JavaScript에서 이름 공간.

더 많은 정보를 원하시면 : 그래서 같은 http://msdn.microsoft.com/en-us/scriptjunkie/gg578608

은 할 수 있습니다 "둥지"네임 스페이스 :

var MyCompany = MyCompany || {}; 
MyCompany.Billing = MyCompany.Billing || {}; 
// etc...

일부 네임 스페이스 지정 물건 커버 또 다른 ScriptJunkie 기사 : http://msdn.microsoft.com/en-us/scriptjunkie/hh377172.aspx

출처

2012-01-27 19:20:34 rusty

감사합니다. 지금 알아 보겠습니다. – SBel

내가 ON이 질문을 게시하도록하겠습니다을 https://codereview.stackexchange.com/questions/8393/approach-to-organizing-javascript-for-an-html-page 내가 대답 할거야.

출처

2012-01-28 13:02:27 SBel

JavaScript의 네임 스페이스 스키마

답변

관련 문제