javascript - 如何将data中的数据根据progress属性按5等分(0-5,6-10...95-100)重新组装？
let data = [ { name: 'k1', progress: 0 }, { name: 'k2', progress: 5 }, { name: 'k3', progress: 20 }, { name: 'k4', progress: 20 }, { name: 'k5', progress: 70 }, { name: 'k6', progress: 100 }]// 如何将data中的数据根据progress属性按5等分(0-5,6-10...95-100)重新组装，想要的结果如下
newData = [ [ { name: 'k1', progress: 0 }, { name: 'k2', progress: 5 } ], [ { name: 'k3', progress: 20 }, { name: 'k4', progress: 20 } ], [ { name: 'k5', progress: 70 } ], [ { name: 'k6', progress: 100 } ]]共有3个答案
不考虑浪费的情况下
const temp = []data.map(item => { const index = Math.max(0, parseInt(item.progress / 5) - 1) if (temp[index]) { temp[index].push(item) } else { temp[index] = [item] }})const result = temp.filter(v => !!v)console.log(result)/*[ [ { name: 'k1', progress: 0 }, { name: 'k2', progress: 5 } ], [ { name: 'k3', progress: 20 }, { name: 'k4', progress: 20 } ], [ { name: 'k5', progress: 70 } ], [ { name: 'k6', progress: 100 } ] ]*/
最简单的就是遍历一下就行了
const total=100;const limit=5;const count=100/5;const data = [];for (let i=0; i<=count; i++){ data.push({ "name": "k"+(i+1), "progress": i*limit })}console.log("data",data)
<head> <meta charset="utf-8" /> <!-- 引入vue --> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script> <title></title></head><body> <div id="app"> <h4>list: {{list}}</h4> <h4>newList: {{newList}}</h4> </div> <script> new Vue({ el: '#app', data: { list: [ { name: 'k1', progress: 0 }, { name: 'k2', progress: 5 }, { name: 'k3', progress: 20 }, { name: 'k4', progress: 20 }, { name: 'k5', progress: 70 }, { name: 'k6', progress: 100 } ], newList: [] }, mounted() { this.handleList() }, methods: { handleList() { let range = 5 let currentGroup = [] //1. 排序 this.list.sort((a, b) => a.progress - b.progress) //2. 处理分组 this.list.forEach(item => { if (item.progress <= range) { currentGroup.push(item) } else { this.newList.push(currentGroup) currentGroup = [item] range += 5 } }) if (currentGroup.length > 0) { this.list.push(currentGroup) } console.log(this.list) console.log(this.newList) } } }) </script></body>
先排序再处理分组就好了
-
问题内容： 我有以下JavaScript数组的房地产主页对象： 我想做的是能够对对象执行过滤，以返回“家庭”对象的子集。 例如，我想根据能够过滤：，，，和。 如何在JavaScript中执行类似下面的伪代码的操作： 注意，语法不必与上面完全相同。这只是一个例子。 问题答案： 您可以使用以下方法： 现场示例： 此方法是新ECMAScript 5th Edition标准的一部分，几乎可以在所有现代浏览
-
问题内容： 我在javascript中有一组对象。内容看起来像这样； 我想保留一些对象并删除其余的对象。如果object属性为2或34，则将保留对象。其他对象被删除。遗嘱的结果看起来像这样； 我正在使用node.js v6.91。 编辑：有人建议我使用过滤器来解决这种问题。欢迎使用过滤器技术的答案。 问题答案： 您可以尝试以下方法1和2： 方法1 ：（使用） 注意：这将返回一个新数组，并且不会修改
-
问题内容： 基本上，我有一个表，其中的字段标识创建消息的用户。 当我显示两个用户之间的对话（一组消息）时，我希望能够通过来对消息进行分组，但要采用一种棘手的方式： 假设有一些消息（按排序）： 我想按以下顺序获得3个消息组： 它应该按 user_id 分组，直到看到一个不同的分组，然后再按该分组。 我正在使用PostgreSQL，并且很乐意使用特定于它的东西，无论哪种都能提供最佳性能。 问题答案：
-
问题内容： 如何转换为： 到这个： 使用javascript或下划线 问题答案： 假设原始列表包含在名为的变量中：
-
问题内容： 好的，所以我想将一个非常基本的数组传递到jquery数据attrubute服务器端，如下所示： 然后像这样回撤： 为什么这似乎会警告’[‘而不是’a’（请参阅JSfiddle链接） JSFiddle链接： http : //jsfiddle.net/ktw4v/3/ 问题答案： 它将变量视为字符串，其第零个元素为。 发生这种情况是因为您的字符串不是有效的JSON，它应使用双引号而不是单
-
我正在解决一个问题“编写一个名为splay的函数，根据第一个值重新组织列表。第一个值称为splaymaster。该函数将重新排列列表，使splaymmaster之前的所有值都小于或等于splaymast，之后的所有值均大于splaymMaster。该函数还返回列表被重新排列。例如，如果列表为[8,15,4,48,26,45,18,29,2,1]，函数将重新排列为[2,1,4,8,26,4518,2