如何顺序地将项放入数组中？(Javascript)
如何顺序地将项放入数组中？(Javascript)
提问于 2020-03-13 13:52:16
我想知道这个标题是否正确，
不管怎样，我想知道的是，怎样才能做到这样的事情？
const items = [a1,a2,a3,a4,a5,a6,a7,a8,a9 .. and so on ]
const flexbox1 = [];
const flexbox2 = [];
const flexbox3 = [];
const flexbox4 = [];
for (const item in items) {
// what I wonder is this part.
}
==> result:
const flexbox1 = [a1,a5,a9,a13 .. and so on];
const flexbox2 = [a2,a6,a10,a14 .. and so on];
const flexbox3 = [a3,a7,a11,a15 .. and so on];
const flexbox4 = [a4,a8,a12,a16 ... and so on];我怎样才能得到上面的结果？
两天来，我一直试图在书中和网上找到答案，但我找不到答案。
请帮忙..。
提前谢谢。
回答 8
Stack Overflow用户
发布于 2020-03-13 14:02:20
下面是使用模运算符将项放入4个桶中的一种方法。这个解决方案可以扩展到任何数量的桶。片段中的函数allocateFlexboxes正是实现了这一点。
一旦for循环结束，您就可以通过索引访问所需的flexbox。
const items = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
let flexBoxes = [[], [], [], []];
for (let i=0; i<items.length; i++) {
const bucketIndex = i % 4;
flexBoxes[bucketIndex].push(items[i]);
}
console.log("Bucket size: 4");
console.log(flexBoxes);
// Generic function that can accommodate for any number
const allocateFlexboxes = (items, flexBoxCount) => {
let flexBoxes = [...new Array(flexBoxCount)].map(x => [])
items.forEach((item, index) => {
const bucketIndex = index % flexBoxCount;
flexBoxes[bucketIndex].push(item);
});
return flexBoxes;
}
Stack Overflow用户
发布于 2020-03-13 14:04:06
使用一个简单的for循环，将计数器递增4：
const items = Array.from({ length: 40 }, (_, i) => "a" + (i+1));
const flexbox1 = [];
const flexbox2 = [];
const flexbox3 = [];
const flexbox4 = [];
for (let i = 0; i < items.length; i += 4) {
flexbox1.push(items[i]);
flexbox2.push(items[i + 1]);
flexbox3.push(items[i + 2]);
flexbox4.push(items[i + 3]);
}
console.log({
flexbox1,
flexbox2,
flexbox3,
flexbox4
});
Stack Overflow用户
发布于 2020-03-13 13:59:09
我认为这不是最干净的解决方案，但它应该有效:)
const items = [...Array(20).keys()];
let currentIndex = 1;
const data = {
flexbox1: [],
flexbox2: [],
flexbox3: [],
flexbox4: []
};
for (const item in items) {
data[`flexbox${currentIndex}`].push(item);
currentIndex = currentIndex === 4 ? 1 : currentIndex + 1;
}
console.log(data);
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60671710
复制相关文章
相似问题
腾讯云开发者
