Странное поведение Object.defineProperty() в JavaScript

Я играл с нижеприведенным кодом JavaScript. Понимание Object.defineProperty() и я столкнулся со странной проблемой с ним. Когда я пытаюсь выполнить приведенный ниже код в браузере или в коде VS, вывод не такой, как ожидалось, тогда как если я пытаюсь отладить код, вывод правильный

Когда я отлаживаю код и оцениваю профиль, я вижу свойство name & age в объекте. Но во время вывода оно показывает только свойство name

//Code Snippet 
let profile = {
  name: 'Barry Allen',
}

// I added a new property in the profile object.
Object.defineProperty(profile, 'age', {
  value: 23,
  writable: true
})

console.log(profile)
console.log(profile.age)

Ответ 1

Вы должны установить enumerable в true. В Object.defineProperty его false по умолчанию. По данным МДН.

перечислимый

true если и только если это свойство отображается при перечислении свойств соответствующего объекта.
По умолчанию false.

Не перечисляемый означает, что свойство не будет показано в Object.keys() или for..in ни в консоли

let profile = {
    name: 'Barry Allen',
}

// I added a new property in the profile object.

Object.defineProperty(profile , 'age', {
    value: 23,
    writable: true,
    enumerable: true
})
console.log(profile)
console.log(profile.age)

Ответ 2

По умолчанию свойства, которые вы определяете с помощью defineProperty, не перечисляются - это означает, что они не будут отображаться, когда вы перебираете их Object.keys (что и делает консоль фрагмента). (Аналогично, свойство length массива не отображается, потому что оно не перечисляемо.)

Смотри MDN:

перечислимый

Значение true, если и только если это свойство отображается при перечислении свойств соответствующего объекта.

По умолчанию false.

Сделайте это перечислимым вместо этого:

//Code Snippet 
let profile = {
  name: 'Barry Allen',
}

// I added a new property in the profile object.
Object.defineProperty(profile, 'age', {
  value: 23,
  writable: true,
  enumerable: true
})

console.log(profile)
console.log(profile.age)

Ответ 3

Всякий раз, когда вы используете метод объекта ".defineProperty". Вы должны лучше определить все свойства дескриптора. Потому что, если вы не определили дескриптор другого свойства, он принимает значения по умолчанию для всех из них, что ложно. Таким образом, ваш console.log проверяет все перечисляемые свойства: true и регистрирует их.

//Code Snippet 
let profile = {
  name: 'Barry Allen',
}

// I added a new property in the profile object.
Object.defineProperty(profile, 'age', {
  value: 23,
  writable: true,
  enumerable : true,
  configurable : true
})

console.log(profile)
console.log(profile.age)