单一命名空间下结合JAVASCRIPT伪类对象(Combining javascript pseud

2019-09-28 17:52发布

我有一些类我从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();

这个问题似乎是我无法添加原型的东西。 这就像我需要定义它们的封装之外。 它甚至有可能包括他们里面? 我明白我可以把原型的东西,内在的功能和使用this.that =这个技巧,但我宁可不要。

这样做的原因的问题是,我已经打破了游戏分为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);


文章来源: Combining javascript pseudo-class objects under a single namespace