Object-oriented--javascript of prototype mode

JavaScript does not have the concept of classes, but object-oriented flags do have a class concept. There is no way for a solution with class abstraction repetition to be implemented through inheritance in JavaScript. But every function of JavaScript automatically adds a name called the prototype attribute, which is an object that We can refer to all instances through a prototype chain to prototype, thus simulating the way the class is.

The prototype pattern implements an interface that is used to create clones of the current object, enabling the creation of duplicate objects.

The inheritance in JavaScript allows you to clone a copy of a parent class to a subclass by prototyping it. We can define a class of all types of parent classes to implement inherited functions, all other classes inherit the parent class. The Code for class is as follows:

Function class () {}class.extend = function (prop) {var _super = this.prototype; Initializing = true;var prototype = new this ();initializing = false; Fntest = /xyz/.test (function () {xyz;})? /\b_super\b/:/.*/;for (Var name in prop) {Prototype[name] = typeof prop[name]  ==  "function" &&typeof _super[name] ==  "function" &&fntest.test (prop[ Name])? (function (NAME,FN) {return function () {var tmp = this._super;this._super = _super[ Name];var ret = fn.apply (this,arguments); this._super = tmp;return ret;};}) (Name,prop[name]):p rop[name];} Function class () {if (!initializing) {if (!this.ctor) return;elsethis.ctor.apply (this,arguments);}} class.prototype = prototype; class.prototype.constructor = class; class.extend = arguments.callee;return class;};

The 23rd line of code overrides class (), defines ctor as a constructor, lines 8th through 19th to clone the properties and methods of the parent class to subclasses based on the variable type of prop, implements inheritance and overloading functionality, and defines _super to implement the function of invoking the parent class method.

Here is an application of the class function, by simulating the way the game is played, the class diagram:

650) this.width=650; "Src=" Http://s1.51cto.com/wyfs02/M02/8B/61/wKioL1hMDEbjHLfRAAApGL1RQ78824.png-wh_500x0-wm_3 -wmp_4-s_3236169846.png "title=" class diagram. png "alt=" wkiol1hmdebjhlfraaapgl1rq78824.png-wh_50 "/>

：

650) this.width=650; "Src=" Http://s5.51cto.com/wyfs02/M00/8B/65/wKiom1hMDLrRbbuBAABfV6CgQJ8464.png-wh_500x0-wm_3 -wmp_4-s_37890131.png "title=". png "alt=" wkiom1hmdlrrbbubaabfv6cgqj8464.png-wh_50 "/>

Implementation code:

<script>var mouse = null,shark = null;var player = new  Player (20,500); Function metmouse () {mouse = new mouse (10,10,5,100); Console.log ("In (" +mouse.x  +  ","  + mouse.y + ");d Ocument.getelementbyid (" Mouseid "). style.display =   "Block"; setinterval (function () {if (!mouse.isdie ()) Player.hurt (Mouse.att); Elseconsole.log ("The Mouse is Dead");},2000 );} Function metshark () {Shark = new shark (10,15,10,120); Console.log ("In" ("+shark.x + " , " + shark.y +");d Ocument.getelementbyid ("Sharkid") .style.display =  "block"; SetInterval (function () {if (!shark.isdie ()) Player.hurt (Shark.att); Elseconsole.log ("The Shark is Dead");},2000);} Function attackmouse () {mouse.hurt (player);} Function attackshark () {shark.hurt (player);} </script>
Monster's Code:
var Monster = Class.extend ({ctor:function (_x,_y,_att,_blood) {this.x = _x,this.y = _y,this.att = _att;this.blood = _blood; },attack:function (player) {Player.hurt (This.att);},hurt:function (player) {this.blood-= Player.att;console.log (" Monsters subject to "+ Player.att +" attack "), Console.log (" Monster Current Volume: "+ This.blood);},isdie:function () {return this.blood <= 0;}});
Player's Code:
var Player = Class.extend ({ctor:function (_att,_blood) {This.att = _att;this.blood = _blood;},hurt:function (_att) { This.blood-= _att;console.log ("player receives" + _att + "damage") Console.log ("The player's current blood volume is:" + This.blood);});
Shark class
var Shark = Monster.extend ({attack:function (player) {_super.attack (player);p Layer.hurt; Console.log (" The Shark Monster gives the player additional 20 damage "),},hurt:function (player) {console.log (" Shark monster skin thick, reduce 10 damage "); This.blood = This.blood-player.att + 10; Console.log ("Shark receives" + (PLAYER.ATT-10) + "point damage"), Console.log ("Shark Current amount of blood:" + This.blood);});

This article from "Go one stop two look back three" blog, please make sure to keep this source http://janwool.blog.51cto.com/5694960/1881559
Object-oriented--javascript of prototype mode