每两个元素映射一个数组

Question

假设我有一组服务对象

services: [{title: title, caption: caption},{title: title, caption: caption},{title: title, caption: caption},{title: title, caption: caption}]

最终结果是一个映射数组，每两个元素在它自己的 div 中。

<div>
 <div>services[0]</div>
 <div>services[1]</div>
</div>
<div>
 <div>services[2]</div>
 <div>services[3]</div>
</div>

我无法理解我将如何实现这一目标？按每两个元素映射和拆分数组？将数组拆分为两个数组，然后映射？到凌晨了吗？是的。

Answer 1

是的，一种方法是按每两个元素对数组进行分组，但您可以通过reduce先使用，然后使用 来做到这一点map。

的回调reduce 实际上可以接受四个参数，并且您可以使用空数组初始化累加器，因此它最终看起来像这样：

services = [{
  title: 'title0',
  caption: 'caption0'
}, {
  title: 'title1',
  caption: 'caption1'
}, {
  title: 'title2',
  caption: 'caption2'
}, {
  title: 'title3',
  caption: 'caption3'
}];

services.reduce(
  function(accumulator, currentValue, currentIndex, array) {
    if (currentIndex % 2 === 0)
      accumulator.push(array.slice(currentIndex, currentIndex + 2));
    return accumulator;
  }, []).map(p => (console.log(p[0], p[1])))