Вы можете использовать возможности методов массива map и find для преобразования первого массива в желаемый формат.
Метод Array.map используется для итерации и преобразования каждого дочернего элемента исходный массив.
Метод Array.find используется для перебора другого (или в данном случае того же самого) массива, чтобы найти дочерний элемент внутри него.
const arrayA = [
{
id: 'REC-001',
text: 'Facebook',
link: ['REC-002', 'REC-003'],
},
{
id: 'REC-002',
text: 'Instagram',
link: ['REC-003'],
},
{
id: 'REC-003',
text: 'Snapshat',
link: ['REC-001', 'REC-002'],
},
]
const arrayB = arrayA.map((mapArrayAChild) => {
return {
...mapArrayAChild, // copy properties from mapArrayAChild into the new object
link: mapArrayAChild.link.map((mapLinkChild) => {
const linkObject = arrayA.find((findLinkChild) => {
return findLinkChild.id === mapLinkChild
}) // Find which child of arrayA has the key corresponding to each child of the current's link array
return {
key: linkObject.id,
text: linkObject.text,
}
}),
}
})
console.log(JSON.stringify(arrayB, null, '\t'))
Чтобы декортировать то, что здесь происходит:
- Мы l oop через массив
arrayA и тем самым создаем новый массив, в котором каждый дочернему элементу применяется преобразование
const arraB = arrayA.map(functionTransformingEachChild)
На каждой итерации мы копируем свойства дочернего элемента текущей итерации и вставляем его в новый объект (с помощью оператора распространения)
return {
...childInCurrentIteration
}
Мы изменяем свойство ссылки с помощью нового массива, который сам создается с помощью метода
map return {
...childInCurrentIteration,
link: childInCurrentIteration.link.map(otherFunctionTransformingEachChild)
}
При преобразовании каждого дочернего элемента массива ссылок мы находим объект
{ id: "REC-002", text: "Instagram", ... } в исходном массиве
arrayA, используя ключевую строку текущей итерации (например, «RE C -002»)
mapArrayAChild.link.map(
(mapLinkChild) => {
const linkObject = arrayA.find(
(linkKeyStringInCurrentIteration) => {
return linkKeyStringInCurrentIteration.key === mapLinkChild
}
)
// ...
}
)
Мы возвращаем новый объект (вместо строки, которая ранее была частью массива
link) и включаем нужные нам свойства.
return {
key: linkObject.id,
text: linkObject.text
}