我試圖用'The Crockford Way'來構建我的JS，但我有一些顧慮

我想弄清楚如何從一個新頁面開始一些結構。我試圖用'The Crockford Way'來構建我的JS，但我有一些顧慮

頁被稱爲「訂單」，這將有一對夫婦在它的標籤現在：「OrdersTab」和「TasksTab」

我有我的佈局設置，如下所示：

//Namespace for the 'Orders' page. 
var Orders = (function() { 
    "use strict"; 
    var tabs = $('#OrdersTabs').tabs(); 
    var ordersTab = new OrdersTab(); 
    var tasksTab = new TasksTab(); 

    //Public methods: 
    return { 

    }; 
})(); //Load when ready.

我的意圖是讓訂單名稱空間負責加載選項卡。我正在努力理解如何讓OrdersTab和TasksTab與Orders保持一致的'名稱空間'。理想情況下，另一個頁面將無法實例化OrdersTab。

//Namespace for the 'OrdersTab' from the 'Orders' page. 
function OrdersTab() { 
    "use strict"; 
    var ordersGrid = $('#OrdersGrid'); 
    var ordersGridPager = $('#OrdersGridPager'); 

    ordersGrid.jqGrid({ 
     url: '../Orders/GetOrders/', 
     datatype: 'json', 
     colNames: ['Name', 'Description'], 
     colModel: [ 
      { name: 'Name', index: 'Name', sortable: false, width: 150 }, 
      { name: 'Description', index: 'Description', sortable: false, width: 300 } 
     ], 
     gridview: true, 
     height: 'auto', 
     rowNum: 10, 
     pager: ordersGridPager, 
     viewrecords: true 
    }); 

    //Public methods: 
    return { 

    }; 
};

訂單位於Orders.js和OrdersTab位於OrdersTab.js。在我看來，一個新的OrdersTab可能會「意外」由其他人創建，或者該函數名稱意外模糊。是否有可能將OrdersTab包裹在訂單的'名稱空間'中，同時也將其保存在單獨的文件中？我認爲單獨的文件是必要的，以防每個選項卡變得比預期的更大/允許將來引入額外的選項卡。

此外，我想知道是否有可能在兩個文件之間使用相同的安裝結構。對我來說，我分配給Orders的變量似乎很尷尬，但只需使用OrdersTab創建一個函數。也許這是確定和標準的，但我只想知道。

來源

2012-09-19 Sean Anderson

你不能在不允許實例化頁面上包含OrdersTab.js嗎？從性能角度來看，無論如何你都會想要這樣做，而且它似乎可以解決你的問題。 – lbstr

是的，我意識到，當我寫下這個問題時，我想我會留下來看看我是否可以學習其他任何我不正確的事情。 –

有幾種解決方案，從一開始就把所有你不想做的功能放到每個模塊的沙箱中，然後給他們一個消息系統來相互通信（類似於MacOS如何運行）。

一個折中的將是建立一個加載系統到您的基本應用：

var APPNAME = (function() { 
    var load = function (name) { /* load name.js */ }, 
     add = function (name, implementation) { this[name] = implementation; }; 
     public_interface = { 
      load : load, 
      add : add 
     }; 

    return public_interface; 
}());

隨意打造一個承諾制，或調解員制度。有了這些，您可以觸發自定義事件，這些自定義事件在您的應用程序內部處理，以處理依賴和初始化，以及其他所有事件。

那麼你就必須在其他文件中做這樣的事情的能力：

// module-1.js 
APPNAME = APPNAME || {add: function() {}}; // the second part is to die without error 
APPNAME.add("publiclyAccessibleName", function() { /* whatever you need it to be */ });

因此您的實際文檔中，你只需要使用APPNAME.load("modulename");加載「modulename.js」，那麼這將是無論你認爲它是什麼，都可以作爲APPNAME.publicName訪問。

再次，您可以進一步抽象說明......您可以有一個addPublic和一個addPrivate服務或模塊。您可以將模塊存儲在隱藏對象內而不是公共對象中，您可以使用implementation作爲構造函數，或者將其作爲另一個IIFE返回另一個對象。在高級沙箱中，您可能會將它們加載到一個modules對象中，然後在初始化每個模塊時，可以將其初始化函數傳遞給一個可訪問的對象，比如說您的JS庫（jQuery/Dojo），和應用程序的消息傳遞系統。

爲了真正實現沙箱化，該系統對象只是一個實例，而不是一個共享對象，因此篡改它只會封閉該模塊，而不會混淆系統中的其他任何東西。

......當然，到目前爲止，您確實真的參與其中，並且這可以相對安全地擴展大型應用程序。

我不是說你應該走得那麼遠。我所說的是，總是有更多的東西，並且總是可以進一步抽象，完成你所需要的東西。

我喜歡那個JS。

來源

2012-09-19 23:15:47 Norguard

我試圖用'The Crockford Way'來構建我的JS，但我有一些顧慮

回答

相關問題