0

So I was thinking if a literal object can inherit properties and methods from a class. Here is the code

var Foo = function(val1, val2) {
    this.prop1 = val1;
    this.prop2 = val2;
}

var bar = {
    //how to inherit properties from Foo class; also add new property
    prop3: 'val3'
};
vincent thorpe
  • 171
  • 1
  • 10
  • 1
    @Jonasw Though this may not be a question suitable for SO, I was wondering how those of us who were taught to learn by asking questions are supposed to keep up with the obviously superior people like you who apparently just learn things? Maybe you can instruct us on your superior "Don't ask questions to learn" technique? (Sorry I asked 2 questions there, I don't know any other way) – gforce301 Jun 09 '17 at 18:48
  • @gforce301 No! Please still ask. Im glad to help. But the question looks like as he will find his answer in the next chapter of his book/part of his tutorial. And its not his first question today... – Jonas Wilms Jun 09 '17 at 18:50
  • _"please learn first, then ask. Looks like youre currently doing learning by asking"_ ? Of course one can learn by asking. There is no monopoly on the routes to learning. If one already is learned, why would they need to ask any questions at all? Except to themselves – guest271314 Jun 09 '17 at 18:53
  • @guest271314 im sorry, was maybe a bit to rude – Jonas Wilms Jun 09 '17 at 18:56
  • Im not going throught any book. I just have this question and I couldn't find anywehere. so I decided to post here my question. but thanks anyway – vincent thorpe Jun 09 '17 at 18:57
  • @user271314 i appreciate that feedback. error backward propagated – Jonas Wilms Jun 09 '17 at 19:23

3 Answers3

0

Theres no inheritance in your code. Inheritance would look like this:

var Foo = function(val1, val2) {}
Foo.prototype={
    prop1:val1,
    prop2:val2
};

var bar = {
//how to inherit properties from Foo class; also add new property
prop3: val3
};

And now you could do:

Object.setPrototypeOf(bar, /*to*/ Foo.prototype);

or creating another object:

var instance=new Foo();
Object.assign(instance,bar);
Jonas Wilms
  • 132,000
  • 20
  • 149
  • 151
  • actually I was thinking of doing something like this: `var Foo = function(val1, val2) { this.prop1 = val1; this.prop2 = val2; }; var bar = { prop3: 'val3', inherit_from_Foo: function(val1, val2) { Foo.call(this, val1, val2); } };` – vincent thorpe Jun 09 '17 at 19:10
  • @vincent thorpe so you want inheritance from a constructor function? – Jonas Wilms Jun 09 '17 at 19:14
  • @vincent thorpe https://stackoverflow.com/questions/7785955/inherit-parent-constructor-arguments – Jonas Wilms Jun 09 '17 at 19:15
  • Not necessarily I just trying to find a way to do inheritance from class to a literal object – vincent thorpe Jun 09 '17 at 19:15
  • @vincent thorpe then you could go with setPrototypeOf wich simply sets the[[proto]] prototype – Jonas Wilms Jun 09 '17 at 19:18
  • but It will still be a literal object if I do that?. because I just will have a single object with all properties from a class, plus aditional properties and methods. I heard that literal objects have a better performance than constructors – vincent thorpe Jun 09 '17 at 19:26
  • @vincent thorpe everything is an object in js. it does not matter how you do it, js uses prototypal inheritance. – Jonas Wilms Jun 09 '17 at 19:33
0

You could achieve this by creating an instance of Foo and then adding properties to that instance like so:

var Foo = function(val1, val2) {
    this.prop1 = val1;
    this.prop2 = val2;
}

var x = new Foo('valOfProp1', 'valOfProp2');

x.prop3 = 'valOfAddedProp';
Steven B.
  • 8,962
  • 3
  • 24
  • 45
0

You may do as follows;

var Foo = function(val1, val2) {
    this.prop1 = val1;
    this.prop2 = val2;
};

Foo.prototype.getProp = function(p){
  return this[p]; // NOT!! this.p
};

var bar = {
    //how to inherit properties from Foo class; also add new property
    prop3: "val3"
};

Object.setPrototypeOf(bar,Foo.prototype);
console.log(bar.getProp("prop1"));
console.log(bar.getProp("prop2"));
console.log(bar.getProp("prop3"));
Redu
  • 25,060
  • 6
  • 56
  • 76