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

使用（索引％2）关闭并打开新div。

var array = [
	{title: 'title', caption: 'caption'},
	{title: 'title', caption: 'caption'},
	{title: 'title', caption: 'caption'},
	{title: 'title', caption: 'caption'},
	{title: 'title', caption: 'caption'},
	{title: 'title', caption: 'caption'}
]

var html = '<div class="row">'
array.forEach(function (item, index) {
	html += '<div>' + item.title + '</div>'
	html += '<div>' + item.caption + '</div>'
	if (index % 2) {
		html += '</div><div class="row">'
	}
})

html += '</div>'

document.getElementById('result').insertAdjacentHTML('beforeend', html)

.row {
	margin: 20px 0px;
	background-color: #DDD;
}

<div id='result'></div>

Answer 2

您可以使用for循环增加2并在map方法内创建字符串，然后将其添加到html。

const data = [{title: 'title', caption: 'caption'},{title: 'title', caption: 'caption'},{title: 'title', caption: 'caption'},{title: 'title', caption: 'caption'}, {title: 'title', caption: 'caption'}]

let html = '';
for(var i = 0; i < data.length; i += 2) {
  const divs = data
    .slice(i, i + 2)
    .map(({title, caption}) => `<div>${title} | ${caption}</div>`)
    .join('')
    
  html += `<div>${divs}</div>`;
}

document.body.innerHTML += html;

Answer 3

只需将项目循环为两个......

var services = [
    {title: 'title1', caption: 'caption1'},
    {title: 'title2', caption: 'caption2'},
    {title: 'title3', caption: 'caption3'},
    {title: 'title4', caption: 'caption4'}
];

for (var i = 0; i < services.length; i += 2) {
  document.body.innerHTML += '<div><div>' + services[i].title + '</div>' + 
                             '<div>' + services[i + 1].title + '</div></div>';
}

Answer 4

是的，一种方法是按每两个元素对数组进行分组，但是您可以先使用Private Sub Button3_Click(sender As Object, e As EventArgs) Handles Button3.Click Dim s = "The quick || brown fox | jumped over || the lazy dogs." Dim SplitBy = {"||", "fox"} Dim SplitString = s.Split(SplitBy, StringSplitOptions.RemoveEmptyEntries) For Each s In SplitString Debug.Print(s) Next 'Output 'The quick ' brown ' | jumped over ' the Lazy dogs. End Sub，然后再使用reduce来完成。

map can actually take four arguments的回调，您可以使用一个空数组初始化累加器，因此最终看起来像这样：

reduce

每两个元素映射一个数组

4 个答案: