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

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

Допрацюйте відповідь до «Readonly властивості». Ваші зміни проходять модерацію перед публікацією.

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

Контент

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

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

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

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

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

у JavaScript властивість можна зробити **"тільки для читання"** (read-only),
щоб її **не можна було змінити, видалити або перевизначити**.

Є кілька способів - від простого до максимально суворого.

---

## 1. Через `Object.defineProperty()`

Це **основний спосіб** задати властивість із потрібними атрибутами.

```javascript
const user = {};

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

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

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

delete user.name;       // не видалиться
console.log(user.name); // "Tim"
```

`writable: false` робить властивість **тільки для читання**.
Якщо також вказати `configurable: false`, її **неможливо навіть видалити**.

---

### Як це виглядає у дескрипторі

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

Виведе:

```javascript
{
  value: 'Tim',
  writable: false,
  enumerable: true,
  configurable: false
}
```

---

## 2. Через `Object.freeze()` (заморозити весь об'єкт)

Якщо хочеш зробити **всі властивості незмінними одразу**,
можна "заморозити" об'єкт:

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

Object.freeze(user);

user.name = 'Oleh';  // не зміниться
user.city = 'Kyiv';  // не можна додати нове
delete user.age;     // не можна видалити

console.log(user); // { name: 'Tim', age: 25 }
```

`Object.freeze()` робить:

- усі наявні властивості `writable: false` і `configurable: false`;
- забороняє додавати нові.

---

## 3. Через `getter` без `setter` (обчислюване, але тільки для читання)

```javascript
const user = {
  firstName: 'Tim',
  lastName: 'Smith',

get fullName() {
    return `${this.firstName} ${this.lastName}`;
  }
};

console.log(user.fullName); // "Tim Smith"
user.fullName = 'Oleh Petrov'; // не спрацює
```

Якщо в об'єкті є `get`, але **немає** `set`,
то ця властивість автоматично стає **тільки для читання**.

---

## 4. Через `Object.seal()` (часткова захист)

Якщо не хочеш "заморожувати" об'єкт повністю,
а просто заборонити додавання і видалення властивостей:

```javascript
const user = { name: 'Tim' };
Object.seal(user);

user.name = 'Oleh'; // можна змінити
delete user.name;   // не можна видалити
user.age = 30;      // не можна додати
```

На відміну від `freeze()`, `seal()` дозволяє змінювати значення,
але забороняє змінювати структуру об'єкта.

---

## ПІДСУМОК

| Спосіб | Що робить | Змінювати значення | Додавати/видаляти |
|---|---|---|---|
| `Object.defineProperty(obj, key, { writable: false })` | Робить конкретну властивість read-only | Ні | Так |
| `Object.freeze(obj)` | Заморожує весь об'єкт | Ні | Ні |
| `Object.seal(obj)` | Забороняє видаляти і додавати властивості | Так | Ні |
| Геттер без сеттера | Обчислювана властивість "тільки для читання" | Ні | Так |

---

**В одній фразі:**

> Щоб зробити властивість тільки для читання,
> використовуй
>
> ```javascript
> Object.defineProperty(obj, 'key', { value: val, writable: false });
> ```
>
> або "заморозь" весь об'єкт з `Object.freeze(obj)`.

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

Для рев’юера

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

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