Dynamically modifying Constructors in JavaScript?

Question

I'm looking to do something a little bit fancy with constructor functions in Javascript, and I'm not quite sure how to do it.

I want to be able to define Constructor functions, and then pass them into another function (a "modifer") like this:

function OriginalConstructor() {
    // Do constructor things here
    // Like defining methods and properties
}

NewConstructor = modifyConstructor(OriginalConstructor);

And the resulting "NewConstructor" should be functionally equivalent to this:

function NewConstructor(id, data) {
    this.id = id;
    this.data = data;
    // Do stuff from the original constructor here
    // i.e. the same methods and properties defined in the original constructor
}

Does anybody know how to go about creating the "modifyConstructor" function?

Not sure I get it, you want to return a new constructor with the same methods and prototype, or just return a new instance of the passed constructor ? — adeneo
– adeneo, Commented Aug 22, 2014 at 16:14
Sounds like classic subclassing with a super() call. Or should they share the same prototype? — Bergi
– Bergi, Commented Aug 22, 2014 at 16:30
see also Is it possible to redefine a JavaScript class's method? — Bergi
– Bergi, Commented Jul 30, 2015 at 12:20

Bergi · Accepted Answer · 2014-08-22 16:37:31Z

You create a function that sets the properties as you defined and calls the original constructor. For example:

function modifyConstructor(Constr) {
    function NewConstructor(id, data) {
        this.id = id;
        this.data = data;

        // Call original constructor
        Constr.apply(this, Array.prototype.slice.call(arguments, 2));
    }
    // Setting the constructor property might not be a good idea depending on
    // the use case
    NewConstructor.prototype = Object.create(Constr.prototype, {
        constructor: {value: NewConstructor, writable: true, configurable: true}
    });
    return NewConstructor;
}

This basically implements NewConstructor as a subclass of whatever Constr is.

Linial · Accepted Answer · 2014-08-22 16:18:50Z

0

Your example looks like a bad practice.

This way it is much easier to maintain,

I'd go like so:

function OriginalConstructor(id, number){

   this.id = id;
   this.number = number;

}
var Obj = new OriginalConstructor();

function newConstructor(Obj){

   this.id = Obj.id;
   this.number = Obj.number * 2;

}

newObject = new newConstructor(Obj);

What you receive from that is: an Obj that was originally created by original constructor, and it's data and state never changed and a newObject which was created by the modifiedConstructor which modifies an object based on a new constructor.

answered Aug 22, 2014 at 16:18

Linial

1,1449 silver badges22 bronze badges

3 Comments

Felix Kling Over a year ago

It seems it should be new newConstructor(Obj);. You should point out though that newObject has none of the other properties that Obj might have. So it's a different result from what the OP described in their question.

Linial Over a year ago

Fixed the first one, About the second one, what do you mean newObject has none of the other properties that Obj might have, it was created based on the data that Obj holds.

Felix Kling Over a year ago

If there are any properties set on OriginalConstructor.prototype, newObject doesn't have them.

Collectives™ on Stack Overflow

Dynamically modifying Constructors in JavaScript?

2 Answers 2

Comments

3 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Linked

Related