почему свойство, добавленное с defineProperty, не отображается, несмотря на то, что перечисляемое значение имеет значение true?

Question

Я не понимаю, почему свойство "зарплата" не отображается, несмотря на то, что оно перечислимо:

class People {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
}
Object.defineProperty(People.prototype, 'salary', {
    value: 3000,
    enumerable: true,
    writable: true
});

Выполнение:

> var p = new People('Jack', 46);
> console.log(p)
People { name: 'Jack', age: 46 }
> console.log(p.propertyIsEnumerable('salary'));
false
> console.log(p.salary)
3000

Почему для * 1007 указано false*?

Однако, если я изменяю свойство, оно вдруг начинает перечисляться:

> p.salary = 4500
4500
> console.log(p)
People { name: 'Jack', age: 46, salary: 4500 }
> console.log(p.propertyIsEnumerable('salary'));
true

Что происходит? Почему оно становится перечислимым только после модификации? Почему это не перечислимо с самого начала?

Answer 1

Консоль, которую вы используете, регистрирует только собственные значения свойств объекта, а не те, которые получены из прототипа. Это не обязательно верно для всех консолей:

class People {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
}

Object.defineProperty(People.prototype, 'salary', {
    value: 3000,
    enumerable: true,
    writable: true
});

var p = new People('Jack', 46);
//compare with the browser console
console.log(p);

А почему свойство «не перечисляемо» - это потому, что Object#propertyIsEnumerable не пересекает цепочку прототипов:

var a = { foo: 1 };
var b = Object.create(a);
b.bar = 2;

console.log(`a:
  a.foo: ${a.foo}
  a.hasOwnProperty("foo"): ${a.hasOwnProperty("foo")}
  a.propertyIsEnumerable("foo"): ${a.propertyIsEnumerable("foo")}`);

console.log(`b:
  b.foo: ${b.foo}
  b.hasOwnProperty("foo"): ${b.hasOwnProperty("foo")}
  b.propertyIsEnumerable("foo"): ${b.propertyIsEnumerable("foo")}
  b.bar: ${b.bar}
  b.hasOwnProperty("bar"): ${b.hasOwnProperty("bar")}
  b.propertyIsEnumerable("bar"): ${b.propertyIsEnumerable("bar")}`);

Что касается того, почему он «становится перечислимым» при его изменении - правда в том, что это не так - когда вы добавляете новое свойство в объект, вытеперь получаю , что , а не тот из прототипа. Свойство прототипа не изменилось:

var a = { foo: 1 };
var b = Object.create(a);

console.log(`b before adding a property:
  b.foo: ${b.foo}
  b.hasOwnProperty("foo"): ${b.hasOwnProperty("foo")}
  b.propertyIsEnumerable("foo"): ${b.propertyIsEnumerable("foo")}`);
  
b.foo = 2;

console.log(`b after adding a property:
  b.foo: ${b.foo}
  b.hasOwnProperty("foo"): ${b.hasOwnProperty("foo")}
  b.propertyIsEnumerable("foo"): ${b.propertyIsEnumerable("foo")}`);
  
console.log(`a after adding a property to b:
  b.foo: ${a.foo}`);