Prototypal inheritance: Object.create vs Object.assign

Question

I am currently reading Kyle Simpson's You Don't know JS, trying to understand the whole prototype pattern.

It says we can achieve prototypal inheritance between Foo and Bar as follows:

      function Foo(name) {
        this.name = name;
      }
      
      Foo.prototype.myName = function () {
        return this.name;
      };
      
      function Bar(name, label) {
        Foo.call(this, name);
        this.label = label;
      }
      
      // here, we make a new `Bar.prototype`
      // linked to `Foo.prototype`
      Bar.prototype = Object.create(Foo.prototype);
      
      // Beware! Now `Bar.prototype.constructor` is gone,
      // and might need to be manually "fixed" if you're
      // in the habit of relying on such properties!
      
      Bar.prototype.myLabel = function () {
        return this.label;
      };
      
      var a = new Bar("a", "obj a");
      
      console.log(a.myName()); // "a"
      console.log(a.myLabel()); // "obj a"

I understand the link is made in the line

Bar.prototype = Object.create(Foo.prototype);

so that Bar's prototype points to an object whose prototype is Foo.prototype.

I was wondering why don't we just do this:

Bar.prototype = Object.assign({}, Foo.prototype);

We achieve the same result and now we have one level of prototype chain lookup for all methods instead of two.

How do you figure that the prototype chain is shorter with Object.assign? — Scott Marcus
– Scott Marcus, Commented Apr 26, 2018 at 20:05
@ScottMarcus you can run the snippet with Object.assign 😉 — mohsinulhaq
– mohsinulhaq, Commented Apr 26, 2018 at 20:09
It might be one level lower, but it's not the same object - changing stuff in Foo.prototype will not be reflected on your assigned prototype. — pishpish
– pishpish, Commented Apr 26, 2018 at 20:19
@destoryer It's not, I agree. But I am saying that it produces the exact same effect of inheritance. — mohsinulhaq
– mohsinulhaq, Commented Apr 26, 2018 at 20:21
If you are to add a function on Foo.prototype, you would not be able to use it. — pishpish
– pishpish, Commented Apr 26, 2018 at 20:22

Bergi · Accepted Answer · 2018-04-26 20:23:11Z

1

We achieve the same result

No, we don't. Bar.prototype would then not inherit from Foo.prototype, instead it would have its own properties. Sure, the values from Foo.prototype would be copied over, but that's just a snapshot of Foo.prototype from the time Object.assign was called instead of a live connection.

answered Apr 26, 2018 at 20:23

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

mohsinulhaq Over a year ago

So, would you say it is better to use Object.assign when I am not changing for example, Foo at runtime? (which I think mostly would be the case if inheritance is my goal).

Bergi Over a year ago

No, it would not be better. Copying the properties requires more memory and does not allow engines to optimise method calls like inheritance does.

Collectives™ on Stack Overflow

Prototypal inheritance: Object.create vs Object.assign

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related