JavaScript inheritance extension class method implementation

JavaScript does not have native inheritance syntax, which is really confusing, but the wisdom of the vast majority of people is endless. Recently, is tasting a little from the source of the sweetness of learning, do not share it is difficult to calm the mood of excitement. Shortly before the video playback plugin was remodeled, Videojs was found to be an excellent open source project. After a period of time in-depth study of its source code, found that its inheritance mechanism is very good, and short, so decided to pull it out, made a separate library, convenient for later use in the project.

Define a namespace var xut = {};/** * Core Object/class for objects so use inheritance + contstructors * * @class * @constructor */xut. Coreobject = xut[' coreobject '] = function () {};/** * Create a new object that inherits from this object * * var Animal = Coreobject.extend (); * var Horse = animal.extend (); * * @param {object} props Functions and properties to being applied to the * new Object ' s prototype * @ return {Xut. Coreobject} An object this inherits from Coreobject * @this {*} */xut.  Coreobject.extend = function (props) {var init, subobj; Props = Props | |  {};  Set up the constructor using the supplied Init method//or using the init of the parent object/make sure to check The unobfuscated version for external libs init = props[' init ' | | Props.init | | this.prototype[' init ' | | This.prototype.init | |  function () {}; In Resig's simple class inheritance (previously used) the constructor//are a function that calls ' this.init.apply (AR guments) '//HowEver that would prevent us from using ' Parentobject.call (this), '//in a child constuctor because the ' this ' in ' this.in  It '//would still refer to the child and cause an inifinite loop. We would instead has to does//' ParentObject.prototype.init.apply (this, argumnents); '//Bleh.  We ' re not creating a _super () function, so it's good to keep//the parent constructor reference simple.  Subobj = function () {init.apply (this, arguments);  };  Inherit from this object ' s prototype Subobj.prototype = Xut.obj.create (This.prototype); Reset the constructor property for Subobj otherwise//instances of Subobj would has the constructor of the parent Ob  Ject subObj.prototype.constructor = subobj; Make the class extendable subobj.extend = Xut.  Coreobject.extend; Make a function for creating instances Subobj.create = Xut.  Coreobject.create; Extend Subobj ' s prototype with functions and other properties from props for (var name in props) {if (Props.hasown PrOperty (name)) {Subobj.prototype[name] = Props[name]; }} return subobj;}; Xut.obj = {};xut.obj.create = Object.create | |  function (obj) {//create a new function called ' F ' which is just an empty object.  function F () {}//the prototype of the ' F ' function should point to the//parameter of the anonymous function.  F.prototype = obj;  Create a new constructor function based off of the ' F ' function. return new F ();};/ * * Create A new instace of this Object class * * var MyAnimal = animal.create (); * * @return {xut. Coreobject} An instance of a Coreobject subclass * @this {*} */xut. Coreobject.create = function () {//Create a new object that inherits from this object ' s prototype var inst = Xut.obj.cre  Ate (This.prototype);  Apply This constructor function to the new object This.apply (inst, arguments);  Return the new object return inst;};

Project Address: Https://github.com/bjtqti/mini-extend

About its use, I'll take the time to elaborate on git, first a simple case, interested readers can analyze the beauty of its own:

var Animal = Xut. Coreobject.extend ({    init:function (name) {        this.name = name;    }}); Animal.prototype.getName = function () {    return this.name;} Animal.prototype.makeSound = function () {    alert (' xxx ');}  var Bird = Animal.extend (); var Dog = Animal.extend ({    makesound:function () {        alert (' Wang ... ')    }}); var B = new Bird (' bage '); var d = new Dog (' Wang ');d. MakeSound () B.makesound ()

Subclasses can easily inherit the functionality of the parent class, and subclasses can also be very free to modify the functionality of the parent class without affecting its subclasses. This is for programmers familiar with Php/java and other languages, this is nonsense, but JS with this bedrooms line of code to achieve this level, it is very difficult.

JavaScript inheritance extension class method implementation