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

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

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

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

Контент

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

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

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

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

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

**`Object.values()`, це вбудований метод JavaScript, який повертає масив усіх значень власних (не успадкованих) перелічуваних властивостей об'єкта.** Це дзеркало `Object.keys()`: той віддає імена властивостей, а цей, самі дані.

## Теорія

### TL;DR

- Повертає **масив значень** властивостей об'єкта.
- Тільки **власні** властивості, нічого з прототипу.
- Тільки **перелічувані** (enumerable) властивості.
- Порядок значень точно відповідає порядку ключів у `Object.keys()`.
- Числові ключі сортуються за зростанням, тому значення можуть іти не в порядку запису.
- Разом з `Object.keys()` і `Object.entries()` утворює трійку методів для роботи з об'єктом як з колекцією.

### Швидкий приклад

```javascript
const user = {
  name: 'Maria',
  age: 25,
  city: 'Kyiv'
};

console.log(Object.values(user));
// ['Maria', 25, 'Kyiv']
```

Повернулися **тільки значення** властивостей об'єкта, без їхніх імен.

### Синтаксис

```javascript
Object.values(obj)
```

- `obj`, об'єкт, з якого потрібно отримати значення.
- Повертає **масив значень** у тому самому порядку, що й `Object.keys()`.

Типи значень зберігаються: числа залишаються числами, булеві, булевими, вкладені об'єкти потрапляють у масив за посиланням.

### Які властивості потрапляють у результат

1. Повертає **тільки власні властивості**, не успадковані:

```javascript
   const person = { species: 'human' };
   const user = Object.create(person);
   user.name = 'Maria';

console.log(Object.values(user)); // ['Maria']
   ```

2. Повертає **тільки перелічувані** властивості:

```javascript
   const obj = {};
   Object.defineProperty(obj, 'hidden', { value: 42, enumerable: false });
   obj.visible = 10;

console.log(Object.values(obj)); // [10]
   ```

3. Порядок значень відповідає порядку ключів:

```javascript
   Object.keys(obj);   // ['visible']
   Object.values(obj); // [10]
   ```

Значення за символьними ключами метод теж не повертає: `Symbol` у цій трійці методів не бере участі.

### Приклад з числовими ключами

```javascript
const fruits = { 3: 'апельсин', 1: 'яблуко', 2: 'банан' };

console.log(Object.values(fruits));
// ['яблуко', 'банан', 'апельсин'], сортується за числовими ключами
```

Цілочисельні ключі рушій завжди впорядковує за зростанням, тому значення виходять не в тому порядку, у якому їх записали в літералі. Якщо порядок критичний, беріть масив або `Map`.

### Перебір значень

```javascript
const product = { name: 'Сорочка', price: 2500, inStock: true };

Object.values(product).forEach(value => console.log(value));
```

Виведе:

```javascript
Сорочка
2500
true
```

Оскільки результат, це звичайний масив, з ним працюють усі методи масивів. Класичний приклад, сума значень:

```javascript
const cart = { apples: 120, bread: 45, milk: 80 };

const total = Object.values(cart).reduce((sum, price) => sum + price, 0);
console.log(total); // 245
```

### Трійка Object.keys, Object.values і Object.entries

| Метод | Що повертає |
| --- | --- |
| `Object.keys(obj)` | масив ключів |
| `Object.values(obj)` | масив значень |
| `Object.entries(obj)` | масив пар `[ключ, значення]` |

Підсумок по самому методу:

| Що робить | Повертає | Враховує прототип | Тип даних |
| --- | --- | --- | --- |
| Отримує всі **значення** властивостей | Масив значень | Ні | `Array` |

### Типові помилки

- **Очікувати успадковані значення.** Усе, що лежить у прототипі, у результат не входить, як і у `Object.keys()`.
- **Розраховувати на порядок оголошення при числових ключах.** Ключі `1`, `2`, `3` завжди сортуються за зростанням, і значення йдуть за ними.
- **Шукати значення за індексом.** `Object.values(obj)[0]`, це не «перша додана властивість», а перший ключ у порядку, який визначає рушій. Надійніше звертатися за іменем: `obj.name`.
- **Плутати з `Object.entries()`.** `values` втрачає імена властивостей, тому, якщо ключ потрібен у циклі, беріть `entries`.
- **Передавати `null` або `undefined`.** `Object.values(null)` кине `TypeError`. Для рядка результатом будуть окремі символи: `Object.values('ab')` поверне `['a', 'b']`.
- **Вважати результат копією даних.** Значення-об'єкти копіюються за посиланням, тому зміна такого елемента масиву змінить і вихідний об'єкт.

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

Для рев’юера

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

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