javascript如何处理很多数据，类似分页切换

需求：一个用户列表数据，如果对应列表数据大于10个，就每10个保存到二维数组，后面不足10个的依然放在二维数组尾部

用处：模拟分页，或者局部刷新

在线DEMO：戳这里

var obj=[{"list":[{a:1},{a:2},{a:3},{a:4},{a:5},{a:6},{a:7},{a:8},{a:9}]},{"list":[{a:1},{a:2},{a:3},{a:4},{a:5},{a:6},{a:7},{a:8},{a:9},{a:10},{a:11},{a:12},{a:13},{a:14},{a:15},{a:16},{a:17},{a:18},{a:19},{a:20},{a:21}]},{"list":[{a:1},{a:2},{a:3},{a:4},{a:5},{a:6},{a:7},{a:8},{a:9},{a:10},{a:11},{a:12},{a:13},{a:14},{a:15},{a:16},{a:17},{a:18},{a:19},{a:20},{a:21},{a:22},{a:23},{a:24},{a:25},{a:26},{a:27},{a:28},{a:29},{a:30},{a:31}]},{"list":[{a:1},{a:2},{a:3},{a:4},{a:5},{a:6},{a:7},{a:8},{a:9},{a:10},{a:11},{a:12},{a:13},{a:14},{a:15},{a:16},{a:17},{a:18},{a:19},{a:20},{a:21},{a:22},{a:23},{a:24},{a:25}]},{"list":[{a:1},{a:2},{a:3},{a:4},{a:5},{a:6},{a:7},{a:8},{a:9},{a:10},{a:11},{a:12},{a:13},{a:14},{a:15},{a:16},{a:17},{a:18},{a:19},{a:20},{a:21},{a:22},{a:23},{a:24},{a:25}]}];//每个list的长度可能为0，无上限 //如果对应的list.length>10,就把对应的list每10个放在二维数组内，不足10个放在二维数组的尾部，//例如第三个有31个，把第三个list替换为：//  [//    [{a:1},{a:2}..{a:10}],//    [{a:11},{a:12}...{a:20}],//    [{a:21}..{30}],[{a:31}]//  ]//
    //该如何一次性获得所有的二维数组？function resetDate(arr,num){//1整个数组的长度var leng=arr.length;for(var i=0;i<leng;i++){//2 每个列表var innerList=arr[i].list;// console.log(arr);//3 每个列表的个数，即lenthvar innerLength=innerList.length;//如果大于10个if(innerLength!=0&&innerLength>num){//如果大于10个的，二维数组外层数组的长度：max,需要上取整var outerMaxLen=Math.ceil(innerLength/num);// 定义在每个对象上的二维数组外层// arr[i].outer=Array(outerMaxLen);arr[i].outer=[];var sliceNum = 0, resIndex = 0;// console.log(result)while (sliceNum < innerLength) {arr[i].outer[resIndex++] = innerList.slice(sliceNum, sliceNum += num);}// 需要用到arr.slice(start,end);
                console.log(arr[i].outer);}}}resetDate(obj,10);// 法二、，小于10个有点BUG(表示没看懂)，来自：巴神
function adapter(data){function _splice(list,i){i = i || 1;list.push(list.splice(0,10));list.length>10 ? _splice(list,++i):list.push(list.splice(0,list.length-i));}data.forEach(function(v){_splice(v.list);});
}adapter(obj);
console.log(obj);

法二的跟新版本：小于10已结正常，过多数据的话未测

function adapter(data){function _splice(list,i){i = i || 1;list.push(list.splice(0,10));list.length>10 ? _splice(list,++i):(i>1 && list.push(list.splice(0,list.length-i)));}data.forEach(function(v){_splice(v.list);});
}adapter(obj);
console.log(obj);

转载于:https://www.cnblogs.com/-walker/p/6879888.html

javascript如何处理很多数据，类似分页切换相关推荐

pandas pivot 计算占比_pandas使用9：如何处理时间序列数据
如何处理时间序列数据? import pandas as pdimport matplotlib.pyplot as plt air_quality = pd.read_csv("data/ ...
（转）大数据量分页存储过程效率测试附代码
大数据量分页存储过程效率测试附代码在项目中,我们经常遇到或用到分页,那么在大数据量(百万级以上)下,哪种分页算法效率最优呢?我们不妨用事实说话. 测试环境硬件:CPU 酷睿双核T5750 内存: ...
layui一个表格中怎么接两个接口的值_layer学习笔记之table表格引入数据实现分页...
LayUI是一款免费,开源,轻量级的前端cms框架,适用于企业后端,能快速上手开发,集成了常用的组件,还有完善的文档和社区. 最近一直在学习使用layer的layui框架技术,这个主要表现在于弹出层的 ...
【javascript 动态添加数据到 HTML 页面】
今天简单的学习了一下有关对象字面量的定义和 javascript 如何取出对象字面量的值的知识,javascript 动态添加数据到 HTML 页面的问题. [学习目标]有如下的一组数据通过 Ajax ...
python处理nc文件并输出_利用python如何处理nc数据详解
前言这两天帮一个朋友处理了些 nc 数据,本以为很简单的事情,没想到里面涉及到了很多的细节和坑,无论是"知难行易"还是"知易行难"都不能充分的说明问题,还是& ...
千万级别数据查询优化_MySQL大数据量分页查询方法及其优化
MySQL大数据量分页查询方法及其优化 ---方法1: 直接使用数据库提供的SQL语句 ---语句样式: MySQL中,可用如下方法: SELECT * FROM 表名称 LIMIT M,N ---适 ...
easyui datatable ajax 加载数据,ASP.NET easyUI--datagrid 通过ajax请求ASP.NET后台数据的分页查询...
js前台对datagrid的定义代码,如下 mygrid = $('#mytable').datagrid({ fit: true, //自动大小 height: 'auto', rownumbers ...
mysql一样的查询在我本地很快但是线上很慢_MySQL大数据量分页查询方法及其优化...
MySQL大数据量分页查询方法及其优化 ---方法1: 直接使用数据库提供的SQL语句 ---语句样式: MySQL中,可用如下方法: SELECT * FROM 表名称 LIMIT M,N ---适 ...
java操作xml一般都用什么_用Java如何处理XML数据
用Java如何处理XML数据 Java原生内置的处理XML的技术基本有这么几种:DOM,SAX,Stax,Jaxb.那么用Java我们要如何处理XML数据,希望对大家有帮助! DOM :Documen ...

javascript如何处理很多数据，类似分页切换

javascript如何处理很多数据，类似分页切换相关推荐

最新文章

热门文章