Lo snippet di eredità Javascript di John Resig è deprecato?

Sto cercando un modo semplice per creare due classi, una che eredita dall’altra, e il bambino che ridefinisce uno dei metodi del genitore, e all’interno del nuovo metodo, chiamando i genitori.

Ad esempio, avendo una class Animal and Dog , dove la class Animal definisce un metodo makeSound() che stabilisce come emettere un suono, che Dog quindi sovrascrive nel proprio metodo makeSound() per creare un suono “woof”, ma anche mentre chiamare Animal makeSound() per produrre questa trama.

Ho esaminato il modello di John Resig qui , ma utilizza la proprietà native arguments.callee che è apparentemente ammortizzata nello script ECMA 5. Ciò significa che non dovrei usare il codice di John Resig?

Quale sarebbe un modo pulito e semplice di scrivere il mio codice animale / cane usando il modello di ereditarietà del prototipo di Javascript?

    Significa che non dovrei usare il codice di John Resig?

    Esatto, non quando si utilizza ES5 in modalità rigorosa. Tuttavia, può essere facilmente adattato:

     /* Simple JavaScript Inheritance for ES 5.1 * based on http://ejohn.org/blog/simple-javascript-inheritance/ * (inspired by base2 and Prototype) * MIT Licensed. */ (function(global) { "use strict"; var fnTest = /xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.*/; // The base Class implementation (does nothing) function BaseClass(){} // Create a new Class that inherits from this class BaseClass.extend = function(props) { var _super = this.prototype; // Set up the prototype to inherit from the base class // (but without running the init constructor) var proto = Object.create(_super); // Copy the properties over onto the new prototype for (var name in props) { // Check if we're overwriting an existing function proto[name] = typeof props[name] === "function" && typeof _super[name] == "function" && fnTest.test(props[name]) ? (function(name, fn){ return function() { var tmp = this._super; // Add a new ._super() method that is the same method // but on the super-class this._super = _super[name]; // The method only need to be bound temporarily, so we // remove it when we're done executing var ret = fn.apply(this, arguments); this._super = tmp; return ret; }; })(name, props[name]) : props[name]; } // The new constructor var newClass = typeof proto.init === "function" ? proto.hasOwnProperty("init") ? proto.init // All construction is actually done in the init method : function SubClass(){ _super.init.apply(this, arguments); } : function EmptyClass(){}; // Populate our constructed prototype object newClass.prototype = proto; // Enforce the constructor to be what we expect proto.constructor = newClass; // And make this class extendable newClass.extend = BaseClass.extend; return newClass; }; // export global.Class = BaseClass; })(this); 

    Prototipo di catena con Object.create () + assegna il costruttore

     function Shape () { this.x = 0; this.y = 0; } Shape.prototype.move = function (x, y) { this.x += x; this.y += y; }; function Rectangle () { Shape.apply(this, arguments); // super constructor w/ Rectangle configs if any } Rectangle.prototype = Object.create(Shape.prototype); // inherit Shape functionality // works like Rectangle.prototype = new Shape() but WITHOUT invoking the constructor Rectangle.prototype.constructor = Rectangle; var rect = new Rectangle(); rect instanceof Rectangle && rect instanceof Shape // returns true 

    dalla documentazione Object.create

    informazioni sulla nuova parola chiave

    Questo è qualcosa che ho imparato per ereditarietà usando il concatenamento e permettendo a _super di funzionare.

     /** * JavaScript simple inheritance * by Alejandro Gonzalez Sole (base on John Resig's simple inheritance script) * MIT Licensed. **/ (function (){ var initializing = false, fnTest = /xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.* /; function Class(){}; function inheritClass(superClass){ var self = this; function Class(){ if (!initializing && typeof this._constructor === 'function') this._constructor.apply(this, arguments); } Class.prototype = superClass.prototype; Class.prototype._constructor = superClass; Class.prototype.constructor = Class; Class.extend = extendClass; //currenlty if you inhert multiple classs it breaks Class.inherit = inheritClass; return Class; }; function extendClass(prop) { var self = this; var _super = self.prototype; function Class(){ if (!initializing && typeof this._constructor === 'function') this._constructor.apply(this, arguments); } initializing = true; var prototype = new self(); initializing = false; 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]) : prop[name]; } Class.prototype = prototype; Class.prototype.constructor = Class; Class.extend = extendClass; Class.inherit = inheritClass; return Class; }; Class.extend = extendClass; Class.inherit = inheritClass; })(); //EXAMPLE function Person(){ this.name = "No name"; console.log("PERSON CLASS CONSTRUCTOR") } Person.prototype.myMethod = function (t){ console.log("MY PERSON", t, this.name); return -1; } var TestPerson = Class.inherit(Person).extend({ _constructor: function(){ this._super(); this.name = "JOhn"; console.log("TEST PERSON CONSTRUCTOR"); }, myMethod: function (t){ console.log("TEST PERSON", t, this.name); return this._super(t) } }); var test = new TestPerson(); console.log(test.myMethod("BA")); 

    Lo sto testando sul mio wrapper pixi https://github.com/guatedude2/pixijs-cli , finora ha funzionato molto bene per me.

    L’unico problema che ho riscontrato con questo approccio è che puoi ereditare solo una volta. Se si esegue ereditare nuovamente, sostituirà l’ereditarietà precedente.

    Preferisco il modo in cui TypeScript genera una forma di ereditarietà (seleziona Ereditarietà semplice dal menu a discesa). Quello non usa arguments.callee , ma un prototype __extends .

     var __extends = this.__extends || function (d, b) { function __() { this.constructor = d; } __.prototype = b.prototype; d.prototype = new __(); }; var Animal = (function () { function Animal(name) { this.name = name; } Animal.prototype.move = function (meters) { alert(this.name + " moved " + meters + "m."); }; return Animal; })(); var Snake = (function (_super) { __extends(Snake, _super); function Snake(name) { _super.call(this, name); } Snake.prototype.move = function () { alert("Slithering..."); _super.prototype.move.call(this, 5); }; return Snake; })(Animal); var Horse = (function (_super) { __extends(Horse, _super); function Horse(name) { _super.call(this, name); } Horse.prototype.move = function () { alert("Galloping..."); _super.prototype.move.call(this, 45); }; return Horse; })(Animal); var sam = new Snake("Sammy the Python"); var tom = new Horse("Tommy the Palomino"); sam.move(); tom.move(34);