7 эффективных способов обновления значений объекта в TypeScript/JavaScript

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

  1. Точечная запись.
    Самый простой способ обновить значение объекта — использовать точечную нотацию. Допустим, у нас есть объект с именем personсо свойством name, и мы хотим обновить имя:
const person = {
  name: "John",
  age: 30,
};
person.name = "Jane";
  1. Обозначение в скобках.
    Подобно точечной нотации, вы также можете обновлять значения объекта, используя скобочную нотацию. Этот метод особенно полезен, когда имя свойства хранится в переменной:
const person = {
  name: "John",
  age: 30,
};
const property = "name";
person[property] = "Jane";
  1. Оператор распространения:
    Оператор распространения может быть удобен, если вы хотите обновить несколько значений внутри объекта без изменения исходного объекта:
const person = {
  name: "John",
  age: 30,
};
const updatedPerson = {
  ...person,
  name: "Jane",
  age: 31,
};
  1. Object.assign():
    Метод Object.assign()позволяет обновлять объект путем объединения его с другим объектом. Он принимает целевой объект в качестве первого аргумента и один или несколько исходных объектов в качестве последующих аргументов:
const person = {
  name: "John",
  age: 30,
};
const updatedPerson = Object.assign({}, person, { name: "Jane", age: 31 });
  1. Object.entries() и Object.fromEntries():
    Вы также можете использовать Object.entries()и Object.fromEntries()для обновления значений объекта. Object.entries()преобразует объект в массив пар ключ-значение, который можно легко изменить. Затем Object.fromEntries()преобразует измененный массив обратно в объект:
const person = {
  name: "John",
  age: 30,
};
const updatedPerson = Object.fromEntries(
  Object.entries(person).map(([key, value]) => {
    if (key === "name") {
      return [key, "Jane"];
    }
    return [key, value];
  })
);
  1. Функция merge() Lodash:
    Если вы работаете со сложными объектами и вам необходимо глубокое объединение значений, вы можете использовать такую ​​библиотеку, как Lodash. Функция merge()объединяет значения двух или более объектов, обновляя целевой объект:
import merge from "lodash/merge";
const person = {
  name: "John",
  age: 30,
};
const updatedPerson = merge(person, { name: "Jane", age: 31 });
  1. Деструктуризация ES6:
    Назначение деструктуризации также можно использовать для обновления значений объекта. Он позволяет извлекать определенные свойства из объекта и присваивать их переменным, которые затем можно изменять:
const person = {
  name: "John",
  age: 30,
};
const { name, age } = person;
const updatedPerson = { name: "Jane", age: age + 1 };

Обновление значений объектов в TypeScript/JavaScript является общим требованием во многих приложениях. В этой статье мы рассмотрели семь эффективных методов достижения этой цели: точечная запись, скобочная запись, оператор расширения, Object.assign(), Object.entries()и Object.fromEntries(), Lodash’s. Функция merge()и деструктуризация ES6. У каждого метода свой вариант использования, поэтому выберите тот, который лучше всего соответствует вашим потребностям.

Помните: понимание этих методов позволит вам легко манипулировать и обновлять значения объектов в ваших проектах TypeScript/JavaScript.