Geek Answers Handbook

Problem with javascript inheritance using function prototype

I want to use the concept of inheritance in js, so what I did

function myGarage(x) { var _x = x; Object.defineProperty(this, "BenZ", { get: function () { return _x; }, set: function (value) { _x = value; }, enumerable: true, configurable: true }); } myGarage.prototype = new MyCar(); function MyCar() { var _x =0; Object.defineProperty(this, "Audi", { get: function () { return _x; }, set: function (value) { _x = value; }, enumerable: true, configurable: true }); }

After that, I created an instance for myGarage .

  var g1 = new myGarage(true); var g2 = new myGarage(false); var g3 = new myGarage("null");

The problem is here when I set g1.Audi = 10; all other instances of myGarage Audi will hold the sample value

(eg)

  g1.Audi = 10; var a = g2.Audi // a is 10 var b = g3.Audi; // b is 10

but I set the value to g1.

what i need is another instance should contain default or undefined

+4
source share
3 answers

try the following code, it works great,

 $(document).ready(function () { var g1 = new MyGarage(true); var g2 = new MyGarage(false); var g3 = new MyGarage("null"); g1.Audi = 10; var a = g2.Audi var b = g3.Audi; }); function MyCar() { var _x = 1; Object.defineProperty(this, "Audi", { get: function () { return _x; }, set: function (value) { _x = value; }, enumerable: true, configurable: true }); } function MyGarage(x) { MyCar.apply(this, arguments); var _x = x; Object.defineProperty(this, "BenZ", { get: function () { return _x; }, set: function (value) { _x = value; }, enumerable: true, configurable: true }); } MyGarage.prototype = new MyCar();
0
source

First of all, the garage would not have inherited from the car, but would have preferred to keep many copies of the cars.

Secondly, you do not use the javascript object model, but close it. In the closure model, the object does not own "its data", but is considered as a mute repository for closures that are the actual owners of the data. With the closure model, you lose functions like inheritance.

To use inheritance, you would like to:

 function MyCar() { this.Audi = 0; } MyCar.prototype = { //Todo: name the method properly setAudi: function(audi) { this.Audi = audi; //Do bunch of other stuff here }, constructor: MyCar }; function MyGarage(x) { this.Benz = x; } MyGarage.prototype = Object.create( MyCar.prototype ); MyGarage.prototype.constructor = MyGarage; MyGarage.prototype.garageMethod1 = function() { }; var g1 = new MyGarage(null), g2 = new MyGarage(false), g3 = new MyGarage(true); console.log( g1.Benz, g2.Benz, g3.Benz ); //null false true

The above example has a template that can be softened by many libraries. I have no specific recommendations.

More on the javascript object model: https://developer.mozilla.org/en/JavaScript/Guide/Details_of_the_Object_Model

+3
source

Check out this simple javascript inheritance from John Resig, you will find it awesome: http://ejohn.org/blog/simple-javascript-inheritance/

0
source

More articles:


All Articles