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

  • Имя свойства может быть любой строкой, включая пустую строку.
  • Значением может быть любое значение, например строка, логическое значение, число или значение NULL, но оно не может быть неопределенным.
  • Свойства объекта можно определить даже после того, как вы начнете использовать объект.

Давайте посмотрим, как мы можем создавать объекты в JavaScript.

  1. Создание объекта с использованием нового ключевого слова

2. Создание объекта с помощью объектных литералов.

  • Таким образом мы обычно используем фигурные скобки ’{}’.
  • Здесь мы используем оператор точки или скобки для добавления ключей.

** Примечание. Мы используем скобки, когда наши объектные ключи являются динамическими и могут содержать пробелы.

var obj = {}
obj.first Name  = 'Nikhil' // throw an error
but with brackets notation it will work
obj['first Name']='Nikhil'
console.log(obj) // {first Name: "Nikhil"}

3. Создание объекта с использованием строковых литералов объекта.

Проблема 1. Мутация объекта с объектами одного уровня

Когда мы копируем один объект в другой, он копируется по ссылке.

  • В приведенном ниже примере вы можете увидеть, как obj4 копируется в obj5, и когда мы обновляем obj5 firstName, оно также обновляется в obj4.

Решение 1. Object.assign

  • Мы можем решить указанную выше проблему, используя Object.assign ({}, sourceObj)
  • Object.assign создает новый объект и копирует в него исходный объект.

** Обратите внимание, что Object.assign ({}, sourceObj) полезно только для неглубокой копии

Проблема 2 - Мутация объекта с помощью объектов вложенного уровня

  • Object.assign решает проблему, если у нас есть объект одного уровня.
  • Если у нас есть вложенный объект, такой как obj4, содержащий адрес другого объекта, как показано ниже, возникает другая проблема со ссылками.

Решение 2 - Глубокая копия

  • Большинство людей используют внешнюю библиотеку, например lodash, для решения этой проблемы.
  • Чтобы решить проблему 2, мы напишем функцию с именем deepCopy.

Решение с использованием ES6

  1. Мелкая копия оператора распространения
  • Оператор распространения создает новую копию (неглубокую) объекта.
  • Поскольку оператор распространения делает неглубокую копию, у него также есть проблема с глубоким копированием, как показано ниже.

2. Глубокая копия оператора распространения

  • Используя оператор распространения, если у вас есть вложенные объекты, вы можете создать свою собственную функцию deepcopy, как мы делали это раньше, или вы можете обновить вложенный объект, передав его свойство адреса целиком новым объектом.
  • Как показано ниже, свойство адреса перезапишет свойство адреса объекта obj4.
  • Примечание. Вышеуказанный метод не является предпочтительным, если вы не уверены в уровне вложенности объекта

удалить оператора

  • Для удаления свойства из объекта будет использоваться оператор удаления.
delete object.property
  • Оператор delete удаляет конкретное свойство из объекта, как показано ниже.
let obj6= {
  firstName: "Nikhil",
  lastName: "Karkra"
};
console.log(obj6.firstName);  // "Nikhil
delete obj6.firstName; 
console.log(appObj); // {lastName: "Karkra"}

Готово, надеюсь, вам понравилась статья! Если вам понравился мой первый пост, вы можете поставить ему ❤ или поделиться им. Спасибо! :)
Прокомментируйте свое предложение по улучшению и обсудите больше объектов в JS.

Разместите свой собственный блог в C2E Blog

Хотите писать для CodeToExpress? Мы будем рады видеть вас техническим писателем. Отправьте нам письмо со ссылкой на ваш черновик на [email protected]