CODEWITHSUNDEEP
javascriptinheritanceprototype-oriented
Jonas G. Drange
Jonas G. Drange

Reputation: 8845

Javascript behaviour reuse: What side effects will this approach have?

I'm trying to understand pure prototype-based JavaScript and one specific thing I'm struggling with is reuse (inheritance).

For my project I landed this way of creating objects that can be reused.

// very generic prototype
var Apparatus = (function(){
    var self = Object.create({});
    self.state = false;
    self.on = function() { this.state = true; };
    return self;
})();

// more specific prototype
var Radio = (function(){
    var self = Object.create(Apparatus);
    self.frequency = 0;
    self.setFrequency = function(f) { this.frequency = f; }
    self.getFrequency = function() { return this.frequency; } 
    return self;
})();

I then want to "instantiate"/copy the Radio object, creating two different radios.

var kitchenRadio = Object.create(Radio);
kitchenRadio.state = false;
kitchenRadio.on();

var carRadio = Object.create(Radio);
carRadio.state = false;

console.log(kitchenRadio.state, carRadio.state);
// true false

This works, but will it continue to? Can anyone predict any unwanted outcomes?

Upvotes: 2

Views: 120

Answers (1)

Jonas G. Drange
Jonas G. Drange

Reputation: 8845

Like @pimvdb said, remove state and this works well.

// very generic prototype
var Apparatus = (function(){
    var self = Object.create({});
    self.on = function() { this.state = true; };
    return self;
})();

// more specific prototype
var Radio = (function(){
    var self = Object.create(Apparatus);
    self.setFrequency = function(f) { this.frequency = f; }
    self.getFrequency = function() { return this.frequency; } 
    return self;
})();

I then use Object.create(Object, params) to instantiate it.

Upvotes: 2

Related Questions