View source code: https://github.com/a-mean-blogger/text-game-maker-js/blob/master/src/base-objects/i-object.js
Interface Class
**There is no "interface class" in JavaScript. It just means the role of this class is interface. This class should be extended and creates new classes
A interface class to create instances that doesn't need to repeat. (for example: frame of game). TM.IObject is the base class of all other Text Game Maker JS classes. all other classes are extended from this class.
Created | instance is created by Constructor. |
Activated | activated by init function. |
Inactivated | inactivated by inactivate function. |
new TM.IObject(data, skipInit)
true
, it will not execute init when an instance is created.true
after calling init function, false
after calling inactivate. The Object status(active/inactive) can be checked by this property.true
- active, false
- inactive) if different behaviors are required.When you extends TM.IObject functions above, create new functions with there name starts "_" instead of extending them directly. The functions blow with "_" will be executed when the TM.IObject functions are called.
**View example source code: i-object-tutorial.js
Let's create a Frame class extending TM.IObject that draw a game frame. It will be easy to understand if you compare below with the full source code(i-object-tutorial.js).
var TMS = new TM.ScreenManager();
//============================= // Frame //============================= // Object Type: TM.IObject // Description: a sample game frame object var Frame = function(data){ this.data = { x: undefined, y: undefined, frame: [ '+-----------< My Frame >-----------+\n', '| |\n', '| |\n', '| |\n', '| |\n', '| |\n', '| |\n', '| |\n', '+------------------------------------+\n' ], todayText: null, }; TM.IObject.call(this, data); }; Frame.prototype = Object.create(TM.IObject.prototype); Frame.prototype.constructor = Frame;
Frame class is created extending TM.IObject.
this.data is the structures and default values of class. data passed as the parameter will overwrite this.data. undefined
in this.data means the value should be passed as data parameter, null
in this.data means no default value for them. Therefore x, y should be passed as data parameter to create instance of this class.
skipInit is not passed to TM.ILoopObject.call so init will be executed when an instance created.
위에서 설명한 것 처럼, 함수를 직접 상속받지 말고 함수이름 앞에 _를 붙여 코드를 작성하면 해당 함수 호출시 같이 호출됩니다. TM.IObject는 init, inactivate를 가지고 있으므로 _init, _inactivate를 작성해 줍니다.
// TM.IObject functions implementation Frame.prototype._init = function(){ this.updateTodayText(); this.drawFrame(); this.drawTodayText(); }; Frame.prototype._inactivate = function(){ this.drawTodayText(true); this.drawFrame(true); };
함수가 활성화될 때와 비활성화될 때 호출되어야 하는 함수들을 기록하였습니다. 다음으로 이 함수들을 작성해 줍시다.
// Frame functions Frame.prototype.updateTodayText = function(){ var today = new Date(); var year = today.getFullYear(); var month = today.getMonth()+1; var date = today.getDate(); this.data.todayText = year+'-'+month+'-'+date; }; Frame.prototype.drawFrame = function(remove){ TMS.cursor.move(this.data.x, this.data.y); for(var i=0; i<this.data.frame.length; i++){ if(remove) TMS.deleteText(this.data.frame[i]); else TMS.insertText(this.data.frame[i]); } }; Frame.prototype.drawTodayText = function(remove){ TMS.cursor.move(this.data.x+2, this.data.y+1); if(remove) TMS.deleteText(this.data.todayText); else TMS.insertText(this.data.todayText); };
These are custom functions of the class.
var myFrame = new Frame({x:2,y:2});
Create a myFrame instance their data is {x:2, y:2}.
Type these commands into the browser console on this page to test.
//inactivate myFrame myFrame.inactivate(); //re-activate(initialize) myFrame myFrame.init(); //create new Frame's instance (myFrame2)
var myFrame2 = new Frame({x:4,y:4});
Comments
Login with SNS account to write comments. see details