你可以在JS库代码结构中混合使用JavaScript Object Literals和Prototypes吗？

Question

我正在构建一个当前使用Object Literals的JavaScript库，我现在正在重建它以使用Prototypes。

以下是我当前应用程序的一部分，您可以看到在templates对象下组织了几个模板解析功能......

用于保持相关功能的对象文字格式

templates: {

    parse: function(template, data){

    },


    sidebarTemplate: function() {

    },

    sidebarPanelTemplate: function(panelOptionsObj) {

    },

    sidebarPanelBackButtonTemplate: function(panelOptionsObj) {

    },


    sidebarPanelLoaderTemplate: function(panelOptionsObj) {

    },
},

现在，下面是我的新Prototype设计的格式......

原型格式

/**
 * Example Prototype Library Structure
 * 
 * @param  {[type]} $         [description]
 * @param  {[type]} window    [description]
 * @param  {[type]} document  [description]
 * @param  {[type]} undefined [description]
 * @return {[type]}           [description]
 */
(function($, window, document, undefined) {

    'use strict';

    var defaults = {
        fullScreen: true
    };

    var SideBar = function(element) {

        // You can access all CoreJS variables and functions like this.
        this.core = $(element).data('corejs');

        this.$el = $(element);
        this.core.s = $.extend({}, defaults, this.core.s)

        this.init();

        return this;
    }

    SideBar.prototype.init = function() {

    };

    /**
    * Destroy function must be defined.
    * CoreJS will automatically call your module destroy function 
    * before destroying the gallery
    */
    SideBar.prototype.destroy = function() {

    }

})(jQuery, window, document);

问题

使用我的新Prototype格式，无论如何都要组织相关的功能，例如我上面的模板？

Answer 1

对象中的组相关项

听起来你正试图在PHP中使namespaces像。你可以实现类似的东西：

var Templates = {
    Sidebar: Sidebar,
    Header: Header
};

function Sidebar(width) {
    this.width = width;
}
Sidebar.prototype.setWidth = setWidth;
function setWidth(width) {
    this.width = width;
}

function Header(height) {
    this.height = height; 
}

var x = new Templates.Sidebar(3);
x.setWidth(5)
console.log(x);

只需付出很少的努力，您就可以将组件包装在IIFE中，并使其可注入而不会破坏全局命名空间。

除了使用匿名函数之外，原始方法没有任何问题，因此您无法为它们提供原型方法（因为您无法引用它们）。