javascript - 在单个命名空间下组合 javascript 伪类对象

Question

我有一些类从 Java 移植到 JavaScript。我想将它们合并在一个库中。

例如:

var myLibrary = {
    version: 1.0,
    ...more code...
};

现在我想添加到这个库中的一个类(它是从 Java 移植到 JavaScript 的!)如下:

Edit: new version below

这个类工作得很好，但封装它却很困难。我想做这样的事情:

var ticker = new myLibrary.jTicker(30,10);
var otherObj = new myLibrary.object2();

问题似乎是我无法添加原型(prototype)内容。就像我需要在封装之外定义它们一样。甚至有可能将它们包含在里面吗？我知道我可以将原型(prototype)内容作为内部函数并使用 this.that = this hack，但我宁愿不这样做。

这个问题的原因是我已经将一个游戏分成了 6 个左右的 Java 类，我可以轻松地将它们移植到 JavaScript(如 jTicker 类)，并且我想将它们全部组合在同一个库命名空间中。

编辑:感谢@Jamiec的建议，我已经完成了一个小型实用程序库。它包含两个这样的伪类。它包含一些跨浏览器垫片。我把它分享给大家，让大家看看所使​​用的技术，让大家都能从中受益。

ccLibrary.js:

/*****************************/
/*    Crawford Computing     */
/*  JavaScript IIFE Library  */
/*****************************/
/* Author: Jonathan Crawford */
/* Created: Nov 2016         */
/*****************************/
/* Current Version: 1.1      */
/* Version 1.1: added util   */
/* Version 1.0: added ticker */
/*****************************/
/*Please credit me if you use*/
/*my code in whole or in part*/
/*****************************/
var ccLibrary = (function(){    
    /************************************************************************/
    /*                           Ticker Class                               */
    /************************************************************************/
    /* Author: Jonathan Crawford                                            */
    /* Created: Nov 2016                                                    */
    /* version 3.0 IIFE encapsulated version                                */
    /************************************************************************/
    /*construct:                                                            */
    /*var testTicker = new ccLibrary.jTicker(viewLength,spaceSize);         */
    /*add a message                                                         */
    /*testTicker.addMessage(number,message);                                */
    /*this will get increment the start index and return the ticker         */
    /*var temp = testTicker.getTicker();                                    */
    /*call that in a timed loop and stick it wherever                       */
    /*to remove/change                                                      */
    /*if(testTicker.keyExists(number);){testicker.removeMessage(number);}   */
    /*then add the updated version                                          */
    /*testTicker.addMessage(number,newMessage);                             */
    /*message numbers need not be added in order(but will display in order) */
    /*numbers may be skipped, i.e 0,1,5,6,9 is a valid key list             */
    /*testTicker.removeMessage(number);                                     */
    /************************************************************************/
    var Ticker = function(length,spaces) {
        //make space even
        if (spaces%2 != 0) { spaces += 1; }
        //set space size]
        this.spaceSize = spaces;
        //set length
        this.viewLength = length;
        //start position
        this.position = 0;
        this.key = 0;
        //all messages
        this.messages = {};
    }
    //add message
    Ticker.prototype.addMessage = function(key,msg) {
        var halfspace = "";
        var half = this.spaceSize / 2;
        for (var i = 0; i < half; i++) { halfspace += "\u00A0"; }
        var temp = halfspace + msg + halfspace;
        this.messages[key] = temp;
    }
    //remove message
    Ticker.prototype.removeMessage = function(key) {
        delete this.messages[key];
    }
    //does key exist?
    Ticker.prototype.keyExists = function(key) {
        return (key in messages);
    }
    //get string snipit
    Ticker.prototype.getTicker = function() {
        this.position += 1;
        //set pointer to next key when end of current message reached 
        var stop = false;
        for (key in this.messages) {
            if (stop) { //execute once
                this.key = key;
                stop = false; //if this does not run we can fix it
                break; //or key will match and it will excute again
            }
            else {
                // only execute when key matches and position is past end of message
                if (key == this.key && this.position > this.messages[this.key].length-1) {
                    this.position = 0;
                    stop = true; //set flag for an execution on next key
                }
            }
        }
        while(stop){ //if new key never set
            for (key in this.messages) {
                this.key = key; //we want the first key
                stop = false;
                break;
            }
        }
        var temp = this.messages[this.key].substring(this.position);
        var work = false;
        for (key in this.messages) {
            //starting at next key
            if (work) { temp += this.messages[key]; }
            //work rest of keys
            if(key == this.key){ work = true; }
        }
        //contiue if short
        for (key in this.messages) { 
            temp += this.messages[key]; 
            if (temp.length > this.viewLength) { break; }
        }
        //return exactely enough
        return temp.substring(0,this.viewLength);
    }

    /****************************************/
    /*        Javascript Utilities          */
    /****************************************/
    /* Author: Jonathan Crawford            */
    /* Created: October,  2015              */
    /****************************************/
    /* Change History:                      */
    /* Current Ver. 2.0  Nov 2015           */
    /* Version 2.0:IIFE encapsulated version*/
    /* Version 1.1: Added fixDate           */
    /*   and isIE functions.                */
    /* Version 1.0: First Version           */
    /*  Made from Textbook.                 */
    /****************************************/
    /*construct:                            */
    /*var util = new ccLibrary.Utilities(); */
    /*call members:                         */
    /*if(util.isIE()){}                     */
    /*util.$(id) is getElementById(id)      */
    /*add text to element                   */
    /*util.setText(id)                      */ 
    /*add event                             */
    /*util.addEvent(obj,type,fn)            */ 
    /*remove event                          */
    /*util.removeEvent(obj,type,fn)         */ 
    /****************************************/
    var Utilities = function(){
        if (!Date.now) { //Older Browser Fix for Timings
            Date.now = function now() {
                return new Date().getTime();
            }
        }
    }
    Utilities.prototype.isIE = function() {
        var myNav = navigator.userAgent.toLowerCase();
        return (myNav.indexOf('msie') != -1) ? parseInt(myNav.split('msie')[1]) : false;
    }
    Utilities.prototype.$ = function(id) { //Shortcut to the element
        if (typeof id == 'string') {
            return document.getElementById(id);
        }
    }
    Utilities.prototype.setText= function(id, message) {
        if ( (typeof id == 'string') && (typeof message == 'string') ) {
            var output = this.$(id);
            if (!output) return false;
            if (output.textContent !== undefined) {
                output.textContent = message;
            } else {
                output.innerText = message;
            }
            return true;
        }
    }
    Utilities.prototype.addEvent = function(obj, type, fn) {
        if (obj && obj.addEventListener) {
            obj.addEventListener(type, fn, false);
        } else if (obj && obj.attachEvent) {
            obj.attachEvent('on' + type, fn);
        }
    }
    Utilities.prototype.removeEvent = function(obj, type, fn) {
        if (obj && obj.removeEventListener) {
            obj.removeEventListener(type, fn, false);
        } else if (obj && obj.detachEvent){
            obj.detachEvent('on' + type, fn)
        }
    }

    return{
        version:"1.1",
        Ticker:Ticker,
        Utilities:Utilities
    };
})();

Answer 1

使用 IIFE

var myLibrary = (function(){

   var jTicker = function(length,spaces) {
    //make space even
    if (spaces%2 != 0) { spaces += 1; }
    //set space size]
    this.spaceSize = spaces;
    //set length
    this.viewLength = length;
    //start position
    this.position = 0;
    this.key = 0;
    //all messages
    this.messages = {};
   }

   // you can have all your prototype code here here

   return{
      version:"1.0",
      jTicker:jTicker
   };

})();

使用

var myInstance = new myLibrary.jTicker(10,30);