JavaScript & TypeScriptМодуль 4: Массивы и объекты
Методы объектов
Object.keys, values, entries и другие
Цель урока
В этом уроке ты научишься:
- Получать ключи, значения и пары
- Копировать и объединять объекты
- Замораживать объекты
Получение ключей и значений
Object.keys
let user = {
name: "Иван",
age: 25,
city: "Москва"
};
let keys = Object.keys(user);
console.log(keys); // ["name", "age", "city"]Object.values
let user = {
name: "Иван",
age: 25,
city: "Москва"
};
let values = Object.values(user);
console.log(values); // ["Иван", 25, "Москва"]Object.entries
let user = {
name: "Иван",
age: 25
};
let entries = Object.entries(user);
console.log(entries);
// [["name", "Иван"], ["age", 25]]
// Перебор
for (let [key, value] of Object.entries(user)) {
console.log(key + ": " + value);
}Object.fromEntries
let entries = [
["name", "Иван"],
["age", 25]
];
let user = Object.fromEntries(entries);
console.log(user); // { name: "Иван", age: 25 }
// Преобразование Map в объект
let map = new Map([["a", 1], ["b", 2]]);
let obj = Object.fromEntries(map);
console.log(obj); // { a: 1, b: 2 }Копирование объектов
Object.assign
let user = { name: "Иван" };
let details = { age: 25, city: "Москва" };
// Копирование в новый объект
let combined = Object.assign({}, user, details);
console.log(combined);
// { name: "Иван", age: 25, city: "Москва" }
// Изменение существующего
Object.assign(user, details);
console.log(user);
// { name: "Иван", age: 25, city: "Москва" }Spread-оператор (рекомендуется)
let user = { name: "Иван" };
let details = { age: 25 };
let combined = { ...user, ...details };
console.log(combined); // { name: "Иван", age: 25 }
// С переопределением
let updated = { ...user, name: "Пётр" };
console.log(updated); // { name: "Пётр" }Поверхностное копирование
Object.assign и spread создают поверхностную копию. Вложенные объекты копируются по ссылке.
let user = {
name: "Иван",
address: { city: "Москва" }
};
let copy = { ...user };
copy.address.city = "Питер";
console.log(user.address.city); // "Питер" — изменился!Глубокое копирование
let user = {
name: "Иван",
address: { city: "Москва" }
};
// Способ 1: JSON (простой, но с ограничениями)
let copy1 = JSON.parse(JSON.stringify(user));
// Способ 2: structuredClone (современный)
let copy2 = structuredClone(user);
copy2.address.city = "Питер";
console.log(user.address.city); // "Москва" — не изменилсяЗаморозка объектов
Object.freeze
let config = {
apiUrl: "https://api.example.com",
timeout: 5000
};
Object.freeze(config);
config.timeout = 10000; // Игнорируется
config.newProp = true; // Игнорируется
delete config.apiUrl; // Игнорируется
console.log(config);
// { apiUrl: "https://api.example.com", timeout: 5000 }Object.seal
let user = { name: "Иван", age: 25 };
Object.seal(user);
user.age = 30; // Работает
user.city = "Москва"; // Игнорируется
delete user.name; // Игнорируется
console.log(user); // { name: "Иван", age: 30 }Проверка состояния
console.log(Object.isFrozen(config)); // true
console.log(Object.isSealed(user)); // trueСводная таблица
| Метод | Описание |
|---|---|
Object.keys() | Массив ключей |
Object.values() | Массив значений |
Object.entries() | Массив пар [ключ, значение] |
Object.fromEntries() | Объект из пар |
Object.assign() | Копирование/объединение |
Object.freeze() | Полная заморозка |
Object.seal() | Запрет добавления/удаления |
Практика
Задание 1: Ключи и значения
Задача: Выведи все ключи объекта через запятую.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
brand, model, year
Задание 2: Объединение
Задача: Объедини два объекта.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
{"theme":"dark","lang":"ru"}Задание 3: Преобразование
Задача: Преобразуй объект в массив пар и обратно с изменением.
Запустите код для проверки
Loading...
Ваш вывод:
Ожидаемый результат:
{"apple":200,"banana":100}Проверь себя
- Чем
Object.freezeотличается отObject.seal? - Как создать глубокую копию объекта?
- Что возвращает
Object.entries?