我们在数据处理的时候经常会用到数组,下面是我对数组的一些总结。
什么是数组:储存多个数据,并提供操作数据的API的对象
数组根据下标可以分为索引数组和关联数组。
索引数组
索引数组:下标都是数字的数组
如何创建索引数组:
var arr = ["吴白彬","23"];
如何访问:arr[0];
关联数组
关联数组:下标都是自定义名称的数组
关联数组可以让每个元素都有专门的名称,更便于维护和快速查找
那我们什么时候用关联数组呢:1、希望每个数组都有明确的意义 2、快速定位想要的元素时
如何创建关联数组:
1、先创建一个空的数组: var arr = [];
2、向数组中添加新的元素,使用自定义的下标名称:
arr["name"] = "吴白彬";
arr["age"] = 23;
如何访问:和索引数组中的元素,变量的用法一样(.length:失效,永远为0)
索引数组和关联数组的优缺点:
索引数组:只能靠遍历查找,受元素个数和元素储存位置的影响极大,但创建简单
关联数组:查找极快,因为是通过下标定位元素位置,查找速度与元素的个数及元素的储存位置无关,但创建麻烦
数组API
什么是API:就是别人写好的程序,我们直接拿过来用
将数组转字符串:
1、String(arr); 将arr中每个元素都转为字符串,默认用逗号连接。(拍照)
什么时候用String():查看数组的中间修改状态,判断是否发生了变化
2、arr.join("自定义连接符"); 将arr中每个元素都转为字符串,可自定义连接符。
什么时候用arr.join():只要不希望用逗号连接,就必须用join
固定套路:
1、无缝拼接:arr,join("");
2、动态生成页面元素
1、var html = "<ANY>"+arr.join("</ANY><ANY>")+"</ANY>";
2、element.innerHTML = html;
concat 拼接:
拼接:将多个数组或元素拼接成为一个新的数组
如何:var newArr = arr1.concat(值1,值2,arr2,...);
注意点:
1、无法修改原数组arr1,只能返回新数组
2、打散数组类型的参数为单个元素再拼接
slice 选取:
选取:选择原数组中指定开始位置到结束位置之间的多个元素组成新数组
如何:var sliceArr = arr.slice(starti,endi+1);
简写:
1、支持负数参数: 代表倒数第n个位置
选择到倒数第n个位置:
arr.slice(starti,arr.length-n+1);
可简写为: arr.slice(starti,-n+1);
原理: 其实slice自动用length-n
2、可省略第二个参数,表示一直选取到结尾
arr.slice(starti) 从starti开始一直选到结尾
3、两个参数都省略: 从头到尾完整复制一个数组
var arr_clone=arr.slice();
最后一个对象
slice(-1)
删除最后一个对象
slice(0,-1)
注意点:
1、不修改原数组,仅复制出想要的元素组成新数组
2、如果一个API两个参数都是下标时,就含头不含尾
splice 修改(删除,插入,替换):
删除:arr.splice(starti,n); 删除starti位置开始的n个元素
简写:
1、支持负数参数: 代表倒数第n个位置(自动用length-n)
2、省略第二个参数: 一直删到结尾
splice返回值:
splice会将删除的元素组成新的数组返回
var deletes=arr.splice(starti,n);
其中deletes保存了删除的元素
注意点:
1、直接修改原数组
2、不考虑含头不含尾
插入:arr.splice(starti,0,值1,值2,...); 在starti位置插入新的值1,值2,...
注意点:
1、原starti位置的值及其之后的值被向后顺移
2、splice不支持打散数组类型参数,如果插入一个数组,则变为二维数组
替换:其实就是先删除,再插入
arr.splice(starti,n,值1,值2,...);
注意点:删除的元素个数和插入的新元素个数不必一致
reverse 翻转:
arr.reverse();
sort 排序:
将数组中的元素按从小到大或从大到小的顺序重新排列
什么时候用到排序:任何数据在给用户展示前,必须先排序
如何:arr.sort();
原理:默认将每个元素都转为字符串,再按字符串比较大小,并排序
问题:只能排序字符串类型的数据
解决:自定义比较器函数
什么是:专门比较任意两值大小的函数
何时:如果sort默认的排序规则不是想要的,可自定义比较器代替sort中默认的排序规则
如何:2步:
1、定义比较器函数:
要求: 2个参数
返回值: 如果a>b,就返回正数
如果a<b, 就返回负数
否则,就返回0
var cmp=function(a,b){return a-b;}
2、将比较器函数作为参数传入sort函数中
arr.sort(cmp);
强调: cmp后不要带()
为什么: 回调函数callback
什么是回调:函数定义后,传递给其它函数,由其它函数负责调用
简写:arr.sort(function(a,b){return a-b;});
问题:如何降序:
解决:只要颠倒比较器结果的正负
function(a,b){return b-a;}
注意点:直接修改原数组
栈和队列
JS中没有专门的栈和队列类型, 都是用普通数组模拟的
栈stack
什么是栈:一端封闭,只能从另一端进出的数组
何时: 今后只要希望始终使用最后进入数组的新元素
特点: FILO
如何:
1、结尾出入栈
结尾入栈: arr.push(值) =>arr[arr.length]=值
在末尾追加一个新值
结尾出栈: var last=arr.pop();
移出数组末尾的最后一个元素
2、开头出入栈
开头入栈: arr.unshift(值);
开头入栈后的结果和结尾入栈后的结果刚好颠倒
开头出栈:var first=arr.shift();
队列queue
什么是队列:只能从一端进入,从另一端出的数组
何时:只要希望按照先来后到的顺序使用数组元素时
特点:FIFO
如何:
结尾入队列: arr.push(值);
开头出队列:var first=arr.shift();
二维数组
什么是二维数组: 数组中的元素又引用了另一个子数组
什么时候用二维数组:
1、保存横行竖列的二位数据
2、如果大的数组中的元素需要进一步细致分类时
如何创建:
创建:
1、先创建空数组,再添加子数组
var data=[];
data[0]=[0,0,0,0];
data[1]=[0,0,0,0];
data[2]=[0,0,0,0];
data[3]=[0,0,0,0];
2、创建数组同时,初始化数组内容:
var data=[
[0,0,0,0],
[0,0,0,0],
[0,0,0,0],
[0,0,0,0]
]
访问: data[r][c] 用法和普通数组的元素以及变量完全一样
特殊:二维数组行下标r不能越界!越界报错!
遍历: 外层循环控制行,内层循环控制列
for(var r=0;r<data.length;r++){
for(var c=0;c<data[r].length;c++){
data[r][c] //获得当前元素
}
}
数组的一些例子
数组快速排序
var arr = [3,1,5,4,2,7,5];
function quickSort (arr){
if(arr.length<=1){
return arr;
} else {
var c = arr.splice(parseInt(arr.length-1)/2,1)[0];
var left = [],right = [];
for( var i = 0; i<arr.length; i++){
if( arr[i]>c){
right.push(arr[i]);
} else {
left.push(arr[i]);
}
}
return quickSort(left).concat(c,quickSort(right));
}
}
arr = quickSort(arr);
console.log(String(arr));
如何清除数组中相同的数字
var arr = [1,2,3,3,4,4,5,5,6];
function repeat(arr){
for(var i = 0,result =[],hash = {};i<arr.length;i++){
if(hash[arr[i]]===undefined){
hash[arr[i]] = true;
result.push(arr[i]);
}
}
return result;
}
var resultArr = repeat (arr);
console.log(resultArr);
快速拿数组里的id
let arr1Ids = sheetDataArr.map(item => item.objectId);
数组过滤
let arr1=[{id:1,name:'网'},{id:2,name:'二位'}]
let arr2=[{id:1,name:'问问'},{id:3,name:'多少'},{id:44,name:'多少'},{id:45,name:'多少'},]
let add=arr2.filter(item=>!arr1.some(ele=>ele.id===item.id))
console.log(add)