javascript Object.create losing property

Question

I am a bit lost and/or too naive. I's like to create an Object with a prototype object holding a function which adds a value to a list created as a property.

But it seems that Object.create ignores the creation of the property. At least, that's what I am making of it.

What is it I am not getting?

Here's an example:

const proto = {
  add(s) {
    this.list.push(s);
  }
}
const props = {
  list: []
}
const newObj = Object.create(proto, props);

console.log('newObj', newObj);
// What happendened to the list property?

newObj.add('test');
// due to undefined list-Property
// an error is being thrown

You didn't follow the required interface for the properties object. — Jared Smith, Jan 29 '19 at 18:26
You are propably right, but according to this https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties it should be ok to define a property like { list: [] } — LongHike, Jan 29 '19 at 18:30
@LongHike They are defining it with an object `{list: {}}`, not an array, `{list: []}`. — RobertAKARobin, Jan 29 '19 at 18:31
Ok, so so an object would "survive" as part of the prototype during creation, but an array is being "purged" or ignored? — LongHike, Jan 29 '19 at 18:38
Use `Object.assign` instead of the second `Object.create` argument — Bergi, Jan 29 '19 at 18:39
@Bergi I see, had I only known I wouldn't have posted this question. So, what can I do? Should I delete my question? — LongHike, Jan 29 '19 at 18:48
Do not use `Object.assign` on the `proto`. If you add `list: []` to the prototype, every `newObj` will "share" the same `list` array. That means if you push something to one `newObj.list`, it will be pushed to all `.list`. — RobertAKARobin, Jan 29 '19 at 18:51
@LongHike No, you don't need to do anything. I'm not even sure whether it's an actual duplicate, that's why I commented "possible". If you could confirm that the old post answers all your questions, I can close this question (not delete it). — Bergi, Jan 29 '19 at 18:53
@Bergi Yes, I herewith confirm that the aforementioned question has already answered my own question. — LongHike, Jan 29 '19 at 19:00

score 2 · Answer 1 · answered Jan 29 '19 at 18:29

The problem is that the properties object has to be formatted in a specific way. See here:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create#Syntax

These properties correspond to the second argument of Object.defineProperties().

You could do it like this:

const props = {
  list: {
      value: []
  }
}

This is the most explicit way of defining a property, and has some interesting effects. But unless you have a need to be so heavy-handed, I would recommend just doing it this way:

newObj.list = []

score 0 · Answer 2 · edited Jun 20 '20 at 09:12

From MDN

propertiesObject

Optional. If specified and not undefined, an object whose enumerable own properties (that is, those properties defined upon itself and not enumerable properties along its prototype chain) specify property descriptors to be added to the newly-created object, with the corresponding property names. These properties correspond to the second argument of Object.defineProperties().

And the argument to Object.defineProperties has the form:

{
   propName: {
     get: function() {},
     set: function() {},
     value: Any
     writable: true,
     enumerable: true,
     configurable: true,
   }
}

Note that you can have either a getter/setter or a value.

javascript Object.create losing property

2 Answers2