Создать массив объектов на основе значения другого массива объектов

Question

У меня есть массив объектов, подобный этому:

const user = [
  { name: 'Bob' },
  { name: 'Frank' }
]

Но мне нужно получить массив, подобный этому:

const result = [
  { key: 'Bob', value: 'Bob', text: 'Bob' },
  { key: 'Frank', value: 'Frank', text: 'Frank' }
]

Я делаю это так:

const result = []
user && user.length > 0 && user.map(u => {
  result.push({ key: u.name, value: u.name, text: u.name })
})

Но есть ли другой способ сделать это немного более прямо? Мне действительно нужно собрать каждый объект и поместить его sh в новый массив?

Answer 1

Вы можете создать массив сразу, используя .map и Object.fromEntries для массива записей:

const user = [
  { name: 'Bob' },
  { name: 'Frank' }
];
const result = user.map(({ name }) => Object.fromEntries(
  ['key', 'value', 'text'].map(key => [key, name])
));
console.log(result);

Если user может быть неопределенным, вы можете сначала чередовать его с пустым массивом:

const result = (user || []).map(...

Нет необходимости проверять user.length во-первых, потому что, если длина равна 0, результат останется пустым массивом, поскольку нет элементов для отображения.

Answer 2

При использовании .map() вы должны вернуть новый элемент из функции обратного вызова. Если вы не возвращаете что-то, вы должны использовать .forEach().

И вы можете использовать деструктуризацию, чтобы избежать повторения u.name.

result = user ? user.map(({name}) => ({ key: name, value: name, text: name })) : [];

Answer 3

Вы можете использовать функцию map() @ barmar или эту функцию reduce():

const result = user.reduce((res, u) => {
    res.push({ key: u.name, value: u.name, text: u.name }); return res
}, [])

JavaScript имеет метод уменьшения. Вы должны использовать его.

Answer 4

Попробуйте этот синтаксис для создания новых полей в вашем объекте.

result["key"] = u.name