Question

我有一个看起来像这样的对象数组。

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

我想做的是使用.map将标题推入新数组，但要基于对象拥有的票数。

在此示例中，它看起来像这样。

newArray = [Title1, Title1, Title2, Title3]

在使用React时，使用.map是解决此问题的最佳方法。

Answer 1

否，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 );

当前还提供了一个proposal for an 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 2

您可以通过将votes作为推送title的while循环的计数来减少数组。

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 3

您可以将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)

Answer 4

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 5

您可以像这样用concat结合map和fill：

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

结果

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

Answer 6

我将首先使用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)

票数相同的书名按字母顺序排列。

将对象标题的.map数组根据票数转换为新数组

6 个答案: