.map массив названий объектов в новый массив, основанный на количестве голосов

Question

У меня есть массив объектов, который выглядит примерно так.

array = [
  {
    title: Title1,
    votes: 2,
  },
  {
    title: Title2,
    votes: 1,
  },
  {
    title: Title3,
    votes: 1,
  },
];

Я пытаюсь использовать .map для добавления заголовков в новый массив, но в зависимости от количества голосов.этот объект имеет.

Для этого примера это выглядело бы следующим образом.

newArray = [Title1, Title1, Title2, Title3]

Использует .map лучший способ пойти с этим, так как я работаю с React.

Answer 1

Сначала я бы использовал array.sort (), а затем array.map (), чтобы вернуть только желаемое свойство, подобное этому (исходный массив остается неизменным, а не мутированным):

var array = [{ title: 'Title1', votes: 2 }, { title: 'Title2', votes: 1 }, { title: Title3', votes: 1 }];

const result = array.sort((a, b) => a.votes > b.votes).map((item) => item.title)

console.log(result)

Заголовки с тем жеколичество голосов отсортировано лексикографически.

Answer 2

Вы можете комбинировать карту с заливкой с concat следующим образом:

Array.prototype.concat(...array.map(elem => new Array(elem.votes).fill(elem.title)))

result

["Title1", "Title1", "Title2", "Title3"]

Answer 3

Array.map возвращает только одно значение на элемент.Вы, вероятно, хотите что-то вроде Array.reduce:

let newArray = array.reduce((accum, curValue) => {
  for (let i = 0; i < curValue.votes; i++) {
    accum.push(curValue.title);
  }
  return accum;
}, []);

Answer 4

Нет, Array.prototype.map не самый лучший вариант для этого.Это полезно, когда вам нужен новый массив такой же длины, что и исходный массив.Вы можете достичь того, что вы хотите сделать с Array.prototype.reduce :

const array = [ { title: 'Title1', votes: 2 }, { title: 'Title2', votes: 1 }, { title: 'Title3', votes: 1 } ];

const result = array.reduce( (res, el) => res.concat( Array( el.votes ).fill( el.title ) ), [] );

console.log( result );

В настоящее время существует также предложение для функции Array.prototype.flatMap , которая очень хорошо работает для вашего случая, но не имеет большого браузераподдержка еще:

const array = [ { title: 'Title1', votes: 2 }, { title: 'Title2', votes: 1 }, { title: 'Title3', votes: 1 } ];

const result = array.flatMap( el => Array( el.votes ).fill( el.title ) );

console.log( result );

Answer 5

Вы можете уменьшить массив, взяв votes в качестве счетчика для цикла while для нажатия title.

var array = [{ title: 'Title1', votes: 2 }, { title: 'Title2', votes: 1 }, { title: 'Title3', votes: 1 }],
    result = array.reduce((r, { title, votes }) => {
        while (votes--) r.push(title);
        return r;
    }, []);
    
console.log(result);

Answer 6

Вы можете использовать map с concat методами и синтаксисом распространения.

let array = [ { title: 'Title1', votes: 2 }, { title: 'Title2', votes: 1 }, { title: 'Title3', votes: 1 } ];
let result = [].concat(...array.map(({title, votes}) => Array(votes).fill(title)));
console.log(result)