2016-11-26 2 views
1

Java에서 JavaScript로 포팅 한 클래스가 있습니다. 도서관에서 그들을 결합하고 싶습니다. 예를 들어단일 네임 스페이스에서 javascript 의사 클래스 객체 결합

는 :

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

지금 나는 (!이 자바 스크립트 자바에서 포팅 된)이 라이브러리에 추가 할 클래스는 다음과 같습니다

Edit: new version below 

이 클래스로 아름답게으로 작동 그러나 캡슐화하는 것은 어렵다는 것을 증명합니다. 다음과 같이하고 싶습니다.

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

문제는 프로토 타입 물건을 추가 할 수없는 것 같습니다. 마치 캡슐화 밖에서 정의 할 필요가 있습니다. 그것들을 내부에 포함시킬 수 있습니까? 프로토 타입 물건을 내부 기능으로 넣고 this.that = this 해킹을 사용할 수 있지만 오히려하지 않을 것입니다.

이 질문에 대한 이유는 게임을 자바에서 6 개 정도의 클래스로 나누었 기 때문에 (jTicker 클래스와 같이) JavaScript로 쉽게 포팅 할 수 있고 모든 라이브러리를 동일한 라이브러리 네임 스페이스에 결합하고 싶습니다 .

편집 : @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 
    }; 
})(); 

답변

1

사용 인생

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); 
+0

않습니다 나는 인생에 더 많은 jTicker 같은 개체를 추가 할 수 있습니다이 평균? 그냥 다 돌려 보내야 해? 정말 고맙습니다! –

+1

ES6 모듈이있는 경우 왜 IIFE가 필요한가요? –

+0

이것은 Jure Javascript, 모듈 없음, 프레임 워크 없음입니다. –

관련 문제