Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Що робить Object.defineProperty()?». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

`Object.defineProperty()` - це **потужний вбудований метод JavaScript**,
який дозволяє **створювати або змінювати властивості об'єктів із тонким контролем** -
наприклад, робити їх **тільки для читання, прихованими, обчислюваними** тощо.

---

## Синтаксис

```javascript
Object.defineProperty(obj, propName, descriptor);
```

| Аргумент | Опис |
|---|---|
| `obj` | Об'єкт, у якому створюється чи змінюється властивість |
| `propName` | Ім'я властивості (рядок або `Symbol`) |
| `descriptor` | Об'єкт-дескриптор - задає, **як працює властивість** |

---

## Приклад - звичайна властивість

```javascript
const user = {};

Object.defineProperty(user, 'name', {
  value: 'Tim',
  writable: true,      // можна змінювати
  enumerable: true,    // видно при переборі (for...in / Object.keys)
  configurable: true   // можна видалити чи змінити
});

console.log(user.name); // "Tim"
```

Це те саме, якби ти написав:

```javascript
const user = { name: 'Tim' };
```

Але з `defineProperty` ти можеш **точно керувати поведінкою властивості**.

---

## 1. `writable` - чи можна змінювати

```javascript
const user = {};
Object.defineProperty(user, 'name', {
  value: 'Tim',
  writable: false
});

user.name = 'Oleh'; // не зміниться
console.log(user.name); // "Tim"
```

`writable: false` робить властивість **тільки для читання**.

---

## 2. `enumerable` - чи видно властивість при переборі

```javascript
const user = {};
Object.defineProperty(user, 'secret', {
  value: '12345',
  enumerable: false
});

console.log(Object.keys(user)); // [] не видно
console.log(user.secret);       // можна прочитати напряму
```

Зручно для "внутрішніх" даних.

---

## 3. `configurable` - чи можна видалити або перевизначити

```javascript
const user = {};
Object.defineProperty(user, 'name', {
  value: 'Tim',
  configurable: false
});

delete user.name; // не спрацює
Object.defineProperty(user, 'name', { value: 'Oleh' }); // помилка
```

`configurable: false` робить властивість **назавжди "зафіксованою"**.

---

## 4. Геттер і сеттер через дескриптор

`Object.defineProperty()` можна використовувати для створення **обчислюваних властивостей**:

```javascript
const user = { firstName: 'Tim', lastName: 'Cooper' };

Object.defineProperty(user, 'fullName', {
  get() {
    return `${this.firstName} ${this.lastName}`;
  },
  set(value) {
    const [first, last] = value.split(' ');
    this.firstName = first;
    this.lastName = last;
  }
});

console.log(user.fullName); // "Tim Cooper"
user.fullName = 'Oleh Shevchenko';
console.log(user.firstName); // "Oleh"
```

Якщо вказані `get` або `set`, то `value` і `writable` використовувати не можна.

---

## 5. Переглянути поточні налаштування властивості

```javascript
console.log(Object.getOwnPropertyDescriptor(user, 'fullName'));
```

Приклад виводу:

```javascript
{
  get: [Function: get],
  set: [Function: set],
  enumerable: false,
  configurable: false
}
```

---

## 6. Створити кілька властивостей одразу

```javascript
Object.defineProperties(user, {
  age: { value: 25, writable: true },
  city: { value: 'Kyiv', enumerable: true }
});
```

`defineProperties()` - аналог, але для групи властивостей.

---

## Підсумок

| Атрибут | За умовчанням | Що робить |
|---|---|---|
| `value` | `undefined` | Значення властивості |
| `writable` | `false` | Чи можна змінювати значення |
| `enumerable` | `false` | Чи видно властивість при переборі |
| `configurable` | `false` | Чи можна видалити / змінити дескриптор |
| `get` | `undefined` | Функція-геттер |
| `set` | `undefined` | Функція-сеттер |

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати458 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.