Object.defineProperty

🎓 Статические методы конструктора Object

---

^{• Object.assign()
• Object.create()}

---

🎓 Object.defineProperty()

Этот метод позволяет создать объекту свойство с дескриптором

• Первый аргумент метода - ссылка на объект, которому добавляется свойство
• Второй аргумент - имя свойства ( строка )
• Третий аргумент - объект дескриптора свойства

☕ 1️⃣

Добавим свойство type объекту sample и сделаем это свойство неперечислимым

var sample = {
    name: "figure",
    size: 100,
    color: "red"
}
Object.defineProperty ( sample, 'type', {
    value: "svg",
    enumerable: false
})

Object.keys ( sample )

Результат:

► (3) ["name", "size", "color"]

---

🎓 геттер и сеттер свойства

Вычисляемые свойства

☕ 2️⃣

Добавим еще одно свойство объекту sample

Свойство operation будет с геттером и сеттером

⚠️ Когда определяются атрибуты get() и set() в дескрипторе свойства, нельзя использовать атрибуты writable и value

Object.defineProperty ( sample, "operation", {
    get: () => this.operation ? 
               this.operation.substr ( 0, 1 ) : "?",
    set: newVal => this.operation = newVal + "***"
})

Результат:

▼ {name: "figure", size: 100, color: "red", type: "svg"}
    color: "red"
    name: "figure"
    size: 100
    operation: (...)
    type: "svg"
  ► get operation: () => {…}
  ► set operation: newVal => this.operation = newVal + "***"
  ► __proto__: Object

---

☕ 3️⃣

var course = 28

var thing = {
    name: "Утюг",
    mark: "Tefal",
    priceUSD: 20
}

Object.defineProperty ( thing, "priceUAH", {
    get: function () {
        return this.priceUSD * course
    },
    set: function ( newPriceUAH ) {
        this.priceUSD = newPriceUAH / course
    }
})

console.log ( thing.priceUAH )

Результат:

560

Теперь выполним присваивание значения вычисляемому свойству ( вызывая под капотом сеттер этого свойства ):

thing.priceUAH = 450

console.log ( thing.priceUDS )

Результат:

8.928571428571429

Выведем в консоль дескриптор вычисляемого свойства priceUAH

console.log (
    Object.getOwnPropertyDescriptor ( thing, "priceUAH" )
)

Результат:

▼ {get: ƒ, set: ƒ, enumerable: true, configurable: true}
    configurable: true
    enumerable: true
  ► get: ƒ priceUAH()
  ► set: ƒ priceUAH( newPriceUAH )
  ► __proto__: Object

---

^{• Object.defineProperties()
• Object.entries()
• Object.freeze()
• Object.getOwnPropertyDescriptor()
• Object.getOwnPropertyDescriptors()
• Object.getOwnPropertyNames()
• Object.getOwnPropertySymbols()
• Object.getPrototypeOf()
• Object.is()
• Object.isExtensible()
• Object.isFrozen()
• Object.isSealed()
• Object.keys()
• Object.preventExtensions()
• Object.seal()
• Object.setPrototypeOf()
• Object.values()}

---

🔗 MDN