Преобразование вложенного массива Javascript в объект

У меня есть массив объектов в следующем формате. Это в основном вложенный массив объектов. Я попытался сделать это с помощью рекурсивной функции, но мне не удалось организовать вложенный объект.

[
  {
    "id": "31a3sd2f1a3ds21f",
    "name": "Energy device",
    "child": [
      {
        "id": "65sa4d65a4sdf654adsf",
        "name": "Device 2",
        "child": [
          {
            "id": "65a4d65ad4s54adsf",
            "name": "Device 3",
            "child": []
          }
        ]
      }
    ]
  },
  {
    "id": "6as54d54as5f",
    "name": "Energy device 2",
    "child": [
      {
        "id": "9a8s7df98a78sdf",
        "name": "Device 4",
        "child": [
          {
            "id": "65a4d65ad4s54adsf",
            "name": "Device 5",
            "child": []
          }
        ]
      },
      {
        "id": "65asd54as5f4",
        "name": "Device 5-1",
        "child": []
      }
    ]
  }
]

Я хочу преобразовать его в следующий формат.

{
  "31a3sd2f1a3ds21f": {
    "65sa4d65a4sdf654adsf": {
      "65a4d65ad4s54adsf": ""
    }
  },
  "6as54d54as5f": {
    "9a8s7df98a78sdf": {
      "65a4d65ad4s54adsf": ""
    },
    "65asd54as5f4": ""
  }
}

Есть ли кто-нибудь, кто может мне помочь?

Привет, Насир, не могли бы вы опубликовать свой код/попытку с вашей рекурсивной функцией и выделить, с чем конкретно у вас возникли проблемы?

Nick Parsons 09.04.2022 10:59

вы не объяснили подробно, как вы ожидаете, что дети будут преобразованы. У вас всегда есть максимум один дочерний элемент для всех узлов вашего дерева, несмотря на то, что это массив. Полученный результат в вашем примере просто преобразует дочерние элементы как свойства родительского объекта. Верна ли такая интерпретация? На самом деле вы объяснили это на примере, но я хотел убедиться, что правильно понял

Diego De Vita 09.04.2022 11:07

Здесь вы видите, что значение "id" является ключом ожидаемого ключа объекта. Если у объекта массива есть дочерний элемент, то значением объекта будет другой объект из его дочернего элемента. В противном случае пустая строка. Предположим, что мой массив [{"id":1, "child":[{"id":2, "child":[]}, {"id":3, "child":[{"id": "4", "child":[]}]}}] Тогда мой ожидаемый результат будет таким {"1":{"2":"", "3": { "4": ""}}}

Nasir Khan 09.04.2022 11:21

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

Diego De Vita 09.04.2022 11:24
Формы c голосовым вводом в React с помощью Speechly
Формы c голосовым вводом в React с помощью Speechly
Пытались ли вы когда-нибудь заполнить веб-форму в области электронной коммерции, которая требует много кликов и выбора? Вас попросят заполнить дату,...
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Будучи разработчиком веб-приложений, легко впасть в заблуждение, считая, что приложение без JavaScript не имеет права на жизнь. Нам становится удобно...
Flatpickr: простой модуль календаря для вашего приложения на React
Flatpickr: простой модуль календаря для вашего приложения на React
Если вы ищете пакет для быстрой интеграции календаря с выбором даты в ваше приложения, то библиотека Flatpickr отлично справится с этой задачей....
В чем разница между Promise и Observable?
В чем разница между Promise и Observable?
Разберитесь в этом вопросе, и вы значительно повысите уровень своей компетенции.
Что такое cURL в PHP? Встроенные функции и пример GET запроса
Что такое cURL в PHP? Встроенные функции и пример GET запроса
Клиент для URL-адресов, cURL, позволяет взаимодействовать с множеством различных серверов по множеству различных протоколов с синтаксисом URL.
Четыре эффективных способа центрирования блочных элементов в CSS
Четыре эффективных способа центрирования блочных элементов в CSS
У каждого из нас бывали случаи, когда нам нужно отцентрировать блочный элемент, но мы не знаем, как это сделать. Даже если мы реализуем какой-то...
2
4
35
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Вы можете сопоставить каждый объект в вашем массиве с новыми массивами формы [key, value]. Для каждого объекта вы можете извлечь id и дочерние свойства, используя присваивание desturcutring в аргументе обратного вызова ({id, child}) => ...). Затем вы можете вернуть массив для этого объекта, который представляет запись для нового объекта вашего здания. Ключ — это id текущего объекта, а значение — это либо новый объект, основанный на массиве child, который вы можете построить, выполнив рекурсивный вызов, либо пустая строка, если ваш текущий объект не имеет дочерних элементов. Это позволяет добавлять вложения к объектам по мере их создания. Наконец, вы можете обернуть сопоставленную версию вашего arr в вызов Object.fromEntries(), который позволит вам преобразовать массив парных записей [key, value] в объект:

const arr = [ { "id": "31a3sd2f1a3ds21f", "name": "Energy device", "child": [ { "id": "65sa4d65a4sdf654adsf", "name": "Device 2", "child": [ { "id": "65a4d65ad4s54adsf", "name": "Device 3", "child": [] } ] } ] }, { "id": "6as54d54as5f", "name": "Energy device 2", "child": [ { "id": "9a8s7df98a78sdf", "name": "Device 4", "child": [ { "id": "65a4d65ad4s54adsf", "name": "Device 5", "child": [] } ] }, { "id": "65asd54as5f4", "name": "Device 5-1", "child": [] } ] } ];

const mapToId = (arr) => Object.fromEntries(arr.map(({id, child}) => [
  id, child.length ? mapToId(child) : ""
]));

const res = mapToId(arr);
console.log(res);

@NasirKhan Не беспокойтесь - в будущем не забудьте добавить свой код и попробовать. Это помогает нам увидеть, с чем вы боретесь, и показывает, что вы в первую очередь приложили усилия для решения своей проблемы самостоятельно.

Nick Parsons 09.04.2022 11:44

Я не знаю, почему вы хотели, чтобы конечный дочерний элемент был пустой строкой, а не пустым объектом, но вот оно:

function arrayToObject(array) {
    // Create empty object if array has cildren, else create an empty string
    const obj = array.length > 0 ? {} : '';

    // Recursively add children to object
    array.forEach((item) => {
        obj[item.id] = arrayToObject(item.child);
    });

    return obj;
}

Другие вопросы по теме