Eine nützliche Sache, die wir implementieren können, um Objekte zu erstellen.

Anwendungsfälle

Formatieren des Objekts gemäß der gewünschten Struktur.

Was bedeutet das in der Praxis? Während der Arbeit stoßen wir häufig auf Anfragen von Kollegen, Daten aus dem Formular in einem bestimmten Format zu senden. Beispielsweise sind die Eigenschaft firstName und lastName ein Objekt innerhalb der Eigenschaft der Person.

const formData = {
  firstName: "John",
  lastName: "Doe"
}

const formData = {
  person: {
    firstName: "John",
    lastName: "Doe"
  }
}

Lösung

const setPropertyByPath = (
  obj: object,
  path: string,
  value: FieldValue,
): object => {

  const [head, ...rest] = path.split('.');

  return {
    ...obj,
    [head]: rest.length
      ? setPropertyByPath(obj[head as keyof object], rest.join('.'), value)
      : value,
  };
};

• Pfad – unser Pfad, der aus dem Formularfeld gesammelt wurde, z. B. „person.firstName“, „person.address.city“ oder einfach „hobbies“. Mit oder ohne Punktnotation.
• [head, …rest] – wir teilen den String und nehmen das erste Element im Array und den Rest davon. Der erste Kopf ist eine Eigenschaft wie andere. Um zu prüfen, ob der Rest mehr Elemente enthält, nennen wir die Rekursion zum letzten. Wenn wir zum letzten gelangen, weisen wir ihm einen Wert zu.