Получение свойства вложенного объекта из строки пути

Beginner

This tutorial is from open-source community. Access the source code

Введение

В этом лабораторном занятии (LabEx) мы рассмотрим, как получать свойства вложенных объектов с использованием заданной строки пути в JavaScript. Мы научимся использовать различные методы массивов, такие как map(), filter() и reduce(), чтобы извлекать определенные значения из сложных объектов. Этот навык важен для работы с большими наборами данных и API, которые возвращают вложенные JSON-объекты.

Как получать свойства вложенных объектов из строк пути

Для практики программирования откройте Терминал/SSH и введите node.

Следующая функция извлекает набор свойств из объекта, используя селекторы, указанные в строке пути. Чтобы достичь этого, выполните следующие шаги:

  1. Используйте Array.prototype.map(), чтобы пройти по каждому селектору, и примените String.prototype.replace(), чтобы заменить квадратные скобки точками.
  2. Используйте String.prototype.split(), чтобы разбить каждый селектор на массив строк.
  3. Используйте Array.prototype.filter(), чтобы удалить все пустые значения.
  4. Используйте Array.prototype.reduce(), чтобы получить значение, указанное каждым селектором.

Вот функция:

const get = (from, ...selectors) =>
  [...selectors].map((s) =>
    s
      .replace(/\[([^\[\]]*)\]/g, ".$1.")
      .split(".")
      .filter((t) => t !== "")
      .reduce((prev, cur) => prev && prev[cur], from)
  );

Вы можете использовать эту функцию для извлечения значений из вложенного объекта с использованием строки пути. Вот пример:

const obj = {
  selector: { to: { val: "val to select" } },
  target: [1, 2, { a: "test" }]
};
get(obj, "selector.to.val", "target[0]", "target[2].a");
// ['val to select', 1, 'test']

Итог

Поздравляем! Вы завершили лабораторное занятие (LabEx) "Получение свойства вложенного объекта из строки пути". Вы можете попрактиковаться в других лабораторных занятиях в LabEx, чтобы улучшить свои навыки.