«Если рабочий хочет хорошо выполнять свою работу, он должен сначала заточить свои инструменты» — Конфуций, «Аналитики Конфуция. Лу Лингун»
титульная страница > программирование > Руководство по освоению объектов JavaScript

Руководство по освоению объектов JavaScript

Опубликовано 27 августа 2024 г.
Просматривать:500

A Guide to Master JavaScript-Objects

Объекты — это фундаментальная часть JavaScript, служащая основой для хранения данных и управления ими. Объект представляет собой набор свойств, и каждое свойство представляет собой связь между ключом (или именем) и значением. Понимание того, как создавать, манипулировать и использовать объекты, имеет решающее значение для любого разработчика JavaScript. В этой статье мы рассмотрим различные объектные функции в JavaScript, предоставив подробные объяснения, примеры и комментарии, которые помогут вам освоить их.

Введение в объекты в JavaScript

В JavaScript объекты используются для хранения коллекций данных и более сложных сущностей. Они создаются с использованием литералов объекта или конструктора Object.

// Using object literals
let person = {
    name: "John",
    age: 30,
    city: "New York"
};

// Using the Object constructor
let person = new Object();
person.name = "John";
person.age = 30;
person.city = "New York";

Свойства объекта

  • Object.prototype: каждый объект JavaScript наследует свойства и методы от своего прототипа.
let obj = {};
console.log(obj.__proto__ === Object.prototype); // Output: true

Методы объекта

1. Объект.назначить()

Копирует значения всех перечисляемых собственных свойств из одного или нескольких исходных объектов в целевой объект. Он возвращает целевой объект.

let target = {a: 1};
let source = {b: 2, c: 3};
Object.assign(target, source);
console.log(target); // Output: {a: 1, b: 2, c: 3}

2. Объект.создать()

Создает новый объект с указанным объектом-прототипом и свойствами.

let person = {
    isHuman: false,
    printIntroduction: function() {
        console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
    }
};

let me = Object.create(person);
me.name = "Matthew";
me.isHuman = true;
me.printIntroduction(); // Output: My name is Matthew. Am I human? true

3. Объект.defineProperties()

Определяет новые или изменяет существующие свойства непосредственно объекта, возвращая объект.

let obj = {};
Object.defineProperties(obj, {
    property1: {
        value: true,
        writable: true
    },
    property2: {
        value: "Hello",
        writable: false
    }
});
console.log(obj); // Output: { property1: true, property2: 'Hello' }

4. Объект.defineProperty()

Определяет новое свойство непосредственно в объекте или изменяет существующее свойство и возвращает объект.

let obj = {};
Object.defineProperty(obj, 'property1', {
    value: 42,
    writable: false
});
console.log(obj.property1); // Output: 42
obj.property1 = 77; // No error thrown, but the property is not writable
console.log(obj.property1); // Output: 42

5. Объект.записи()

Возвращает массив собственных перечислимых пар свойств со строковым ключом [ключ, значение] данного объекта.

let obj = {a: 1, b: 2, c: 3};
console.log(Object.entries(obj)); // Output: [['a', 1], ['b', 2], ['c', 3]]

6. Объект.freeze()

Замораживает объект. Замороженный объект больше нельзя изменить; замораживание объекта предотвращает добавление к нему новых свойств, удаление существующих свойств и изменение значений существующих свойств.

let obj = {prop: 42};
Object.freeze(obj);
obj.prop = 33; // Fails silently in non-strict mode
console.log(obj.prop); // Output: 42

7. Объект.fromEntries()

Преобразует список пар ключ-значение в объект.

let entries = new Map([['foo', 'bar'], ['baz', 42]]);
let obj = Object.fromEntries(entries);
console.log(obj); // Output: { foo: 'bar', baz: 42 }

8. Object.getOwnPropertyDescriptor()

Возвращает дескриптор свойства для собственного свойства (то есть того, которое непосредственно присутствует в объекте, а не в цепочке прототипов объекта) данного объекта.

let obj = {property1: 42};
let descriptor = Object.getOwnPropertyDescriptor(obj, 'property1');
console.log(descriptor);
// Output: { value: 42, writable: true, enumerable: true, configurable: true }

9. Object.getOwnPropertyDescriptors()

Возвращает объект, содержащий все собственные дескрипторы свойств объекта.

let obj = {property1: 42};
let descriptors = Object.getOwnPropertyDescriptors(obj);
console.log(descriptors);
/* Output:
{
  property1: {
    value: 42,
    writable: true,
    enumerable: true,
    configurable: true
  }
}
*/

10. Object.getOwnPropertyNames()

Возвращает массив всех свойств (включая неперечисляемые свойства, за исключением тех, которые используют символ), найденных непосредственно в данном объекте.

let obj = {a: 1, b: 2, c: 3};
let props = Object.getOwnPropertyNames(obj);
console.log(props); // Output: ['a', 'b', 'c']

11. Object.getOwnPropertySymbols()

Возвращает массив всех свойств символа, найденных непосредственно в данном объекте.

let obj = {};
let sym = Symbol('foo');
obj[sym] = 'bar';
let symbols = Object.getOwnPropertySymbols(obj);
console.log(symbols); // Output: [Symbol(foo)]

12. Object.getPrototypeOf()

Возвращает прототип (т. е. значение внутреннего свойства [[Prototype]]) указанного объекта.

let proto = {};
let obj = Object.create(proto);
console.log(Object.getPrototypeOf(obj) === proto); // Output: true

13. Объект.is()

Определяет, являются ли два значения одним и тем же значением.

console.log(Object.is('foo', 'foo')); // Output: true
console.log(Object.is({}, {})); // Output: false

14. Объект.isExtensible()

Определяет, разрешено ли расширение объекта.

let obj = {};
console.log(Object.isExtensible(obj)); // Output: true
Object.preventExtensions(obj);
console.log(Object.isExtensible(obj)); // Output: false

15. Объект.isFrozen()

Определяет, заморожен ли объект.

let obj = {};
console.log(Object.isFrozen(obj)); // Output: false
Object.freeze(obj);
console.log(Object.isFrozen(obj)); // Output: true

16. Объект.isSealed()

Определяет, запечатан ли объект.

let obj = {};
console.log(Object.isSealed(obj)); // Output: false
Object.seal(obj);
console.log(Object.isSealed(obj)); // Output: true

17. Объект.keys()

Возвращает массив имен собственных перечислимых свойств данного объекта, повторяемых в том же порядке, что и обычный цикл.

let obj = {a: 1, b: 2, c: 3};
console.log(Object.keys(obj)); // Output: ['a', 'b', 'c']

18. Object.preventExtensions()

Предотвращает любые расширения объекта.

let obj = {};
Object.preventExtensions(obj);
obj.newProp = 'test'; // Throws an error in strict mode
console.log(obj.newProp); // Output: undefined

19. Объект.печать()

Запечатывает объект, предотвращая добавление к нему новых свойств и отмечая все существующие свойства как ненастраиваемые. Значения текущих свойств по-прежнему можно изменять, пока они доступны для записи.

let obj = {property1: 42};
Object.seal(obj);
obj.property1 = 33;
delete obj.property1; // Throws an error in strict mode
console.log(obj.property1); // Output: 33

20. Object.setPrototypeOf()

Задает прототип (т. е. внутреннее свойство [[Prototype]]) указанного объекта равным другому объекту или нулю.

let proto = {};
let obj = {};
Object.setPrototypeOf(obj, proto);
console.log(Object.getPrototypeOf(obj) === proto); // Output: true

21. Объект.значения()

Возвращает массив значений собственных перечисляемых свойств данного объекта в том же порядке, в котором указан в цикле for...in.

let obj = {a: 1, b: 2, c: 3};
console.log(Object.values(obj)); // Output: [1, 2, 3]

Практические примеры

Пример 1: Клонирование объекта

Использование Object.assign() для клонирования объекта.

let obj = {a: 1, b: 2};
let clone = Object.assign({}, obj);
console.log(clone); // Output: {a: 1, b: 2}

Пример 2: Объединение объектов

Использование Object.assign() для объединения объектов.

let obj1 = {a: 1, b: 2};
let obj2 = {b: 3, c: 4};
let merged = Object.assign({},

 obj1, obj2);
console.log(merged); // Output: {a: 1, b: 3, c: 4}

Пример 3. Создание объекта с указанным прототипом

Использование Object.create() для создания объекта с указанным прототипом.

let proto = {greet: function() { console.log("Hello!"); }};
let obj = Object.create(proto);
obj.greet(); // Output: Hello!

Пример 4: Определение неизменяемых свойств

Использование Object.defineProperty() для определения неизменяемых свойств.

let obj = {};
Object.defineProperty(obj, 'immutableProp', {
    value: 42,
    writable: false
});
console.log(obj.immutableProp); // Output: 42
obj.immutableProp = 77; // Throws an error in strict mode
console.log(obj.immutableProp); // Output: 42

Пример 5. Преобразование объекта в массив

Использование Object.entries() для преобразования объекта в массив пар ключ-значение.

let obj = {a: 1, b: 2, c: 3};
let entries = Object.entries(obj);
console.log(entries); // Output: [['a', 1], ['b', 2], ['c', 3]]

Заключение

Объекты — это основной компонент JavaScript, предлагающий гибкий способ управления данными и манипулирования ими. Овладев объектными функциями, вы сможете с легкостью выполнять сложные операции и писать более эффективный и удобный в сопровождении код. В этом подробном руководстве рассмотрены наиболее важные объектные функции JavaScript, а также приведены подробные примеры и пояснения. Практикуйтесь в использовании этих функций и экспериментируйте с различными вариантами использования, чтобы углубить понимание и улучшить свои навыки программирования.

Заявление о выпуске Эта статья воспроизведена по адресу: https://dev.to/imsushant12/a-guide-to-master-javascript-objects-362b?1 Если есть какие-либо нарушения, пожалуйста, свяжитесь с [email protected], чтобы удалить ее.
Последний учебник Более>

Изучайте китайский

Отказ от ответственности: Все предоставленные ресурсы частично взяты из Интернета. В случае нарушения ваших авторских прав или других прав и интересов, пожалуйста, объясните подробные причины и предоставьте доказательства авторских прав или прав и интересов, а затем отправьте их по электронной почте: [email protected]. Мы сделаем это за вас как можно скорее.

Copyright© 2022 湘ICP备2022001581号-3