> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/web/js/val/obj/prop/create/object.defineproperty.md).

# Object.defineProperty()

[JS](/web/js.md) ⟩ [value](/web/js/val.md) ⟩ [object](/web/js/val/obj.md) ⟩ [property](/web/js/val/obj/prop.md) ⟩ [update](/web/js/val/obj/prop/create.md) ⟩ Object.defineProperty()

{% hint style="success" %} <mark style="color:yellow;">**define**</mark>/<mark style="color:orange;">**update**</mark> a [**property**](/web/js/val/obj/prop.md) on an object, and **return the object**.

```javascript
// 🔸 Object.defineProperty(obj, prop, descriptor)
Object.defineProperty(obj, 'age', {
    get() { ... },            // ES6
    set(value) { ... },       // ES6
    enumerable: true,
    configurable: true,
});

// 🔸 Object.defineProperties(obj, <key/descriptor pairs>)
Object.defineProperties(obj, {

    isMale: {
        value: true,          // ⭐️ data property
        writable: true,
    },

    name: {
        get() { ... },        // ⭐️ accessor property
        set(value) { ... },
    },

});
```

{% endhint %}

{% tabs %}
{% tab title="⭐️ 重點" %}
{% hint style="info" %}

* when <mark style="color:yellow;">**creating**</mark> a <mark style="color:yellow;">**new**</mark>**&#x20;property**, the <mark style="color:orange;">**omitted attributes**</mark> are <mark style="color:red;">**false**</mark> by default.
* when <mark style="color:yellow;">**modifying**</mark> an <mark style="color:yellow;">**existing**</mark> **property**, the <mark style="color:orange;">**omitted attributes**</mark> are left <mark style="color:yellow;">**unchanged**</mark>.
  {% endhint %}

{% hint style="warning" %}
The only reason (I can think of) why <mark style="color:purple;">**Object.defineProperty()**</mark> is [**static**](/web/js/val/class/member/static.md) (instead of an instance method) is that an object <mark style="color:yellow;">**may**</mark>**&#x20;**<mark style="color:red;">**not**</mark>**&#x20;**<mark style="color:yellow;">**inherit methods**</mark> from <mark style="color:blue;">**Object.prototype**</mark>, which means <mark style="color:blue;">`obj.defineProperty()`</mark> may fail if this is the case.

```javascript
// ⭐️ obj.defineProperty()
// we could still define an instance method if we want to.
Object.defineProperty(Object.prototype, "defineProperty", {
    // by default, writable/enumerable/configurable all false
    value: function(prop, descr) {
        return Object.defineProperty(this, prop, descr); 
    }
});
```

{% endhint %}
{% endtab %}

{% tab title="✨ 範例" %}

* replit：[define properties](https://replit.com/@pegasusroe/object-define-properties#index.js)
* [window.name](/web/js/scope/global/object/window/window.name.md)
* [\_\_proto\_\_](/web/js/val/obj/extend/inheritance/__proto__.md)
* [n.toHex()](/web/js/val/prim/num/number+ext/n.tohex.md) - number to binary / octal / hex format.
  {% endtab %}

{% tab title="👥 相關" %}

* use [property descriptor](/web/js/val/obj/prop/attr/property-descriptor.md) to create/update properties.
* class [getter/setter](/web/js/val/class/member/getter-setter.md)
* [arr.last](/web/js/val/builtin/arr/ext/arr.last.md)
* [⭐️ ES6 (2015)](/web/js/feature/es6.md) (shorthand method names)
* [helpers](/web/appendix/gas/app/helpers.md)
  {% endtab %}

{% tab title="📘 手冊" %}

* [Object.defineProperty()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty)
* [Object.defineProperties()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties)
* [Functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions) ⟩ [getter](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get)
  {% endtab %}

{% tab title="🗣 討論" %}

* [Why is it Object.defineProperty() rather than this.defineProperty() (for objects)?](https://stackoverflow.com/questions/13239317/why-is-it-object-defineproperty-rather-than-this-defineproperty-for-objects)
* You could ask [ChatGPT](https://chat.openai.com/chat#) instead if you want to.
  {% endtab %}
  {% endtabs %}
