Array类型是ECMAScript中最常用的引用类型。ECMAScript中的数据与其它大多数语言中的数组有着相当大的区别。虽然ECMAScript中的数据与其它语言中的数组一样都是数据的有序列表,但不同的是,ECMAScript数组中的每一项可以保存任何类型的数据,无论是数值、字符串或者是对象。同时,ECMAScript中的数组大小是可以动态调整的,即可以根据数据的添加自动增长以容纳新增的数据。下面总结一下JavaScript中数组常用的操作函数及用法。
"htmlcode">
var arr = new Array(); var arr = [];
对于构造函数,我们可以传递一个数值创建包含给定项数的数组,如下:
var arr = new Array(3); //数组长度为3
也可以直接传递存放于数组中的值,如下:
var arr = new Array("red","green","blue");
不论哪种方式,推荐使用数组字面量的形式来创建数组。
"htmlcode">
var arr = [1,2,3]; console.log(arr instanceof Array); //true
但如果网页中包含多个框架,也就包含多个全局执行环境,ES5新增了Array.isArray()方法来确定某个值是否为数组,而不管它是在哪个全局执行环境中被创建的,如下:
if(Array.isArray(arr)){ //执行某些操作 }
"htmlcode">
var arr = ["red","green","blue"]; console.log(arr.toString()); //red,green,blue console.log(arr.valueof()); //red,green,blue console.log(arr); //red,green,blue
而调用数组的toLocaleString()方法,与toString()不同的是它会调用数组每一项的toLocaleString()方法,将每一项toLocaleString()方法的返回值以逗号分隔拼接成一个字符串。而使用join()方法,可以使用不同的分隔符来构建这个字符串,如下:
var arr = ["red","green","blue"]; console.log(arr.join(",")); //red,green,blue console.log(arr.join("||")); //red||green||blue
"htmlcode">
var arr = [1,2,3]; arr.push(4,5); console.log(arr); //[1,2,3,4,5]
与push()相对的是pop()方法,它从数组末尾移除最后一项,并返回移除的项,例如:
var arr = [1,2,3]; arr.pop(); //3 arr.pop(); //2 console.log(arr); //[1]
另外两个使用的方法是shift()和unshift(),它们与pop()和push()类似,shift()方法用于从数组的起始位置移除项并返回移除项,例如:
var arr = [1,2,3]; arr.shift(); //1 arr.shift(); //2 console.log(arr); //[3]
unshift()方法与shift()用途相反,它能够在数组前端添加任意个项并返回新数组的长度,例如:
var arr = [1,2,3]; arr.unshift(4); //返回长度4 arr.unshift(5); //返回长度5 console.log(arr); //[1,2,3,4,5]
"htmlcode">
var arr = [1,2,3]; arr.reverse(); console.log(arr); //[3,2,1]
sort()也可以对数组进行排序,不过它的默认排序方式并不是大小,而是根据对应字符串逐个编码排序的。sort()方法可以接收一个比较函数,进行自定义排序,例如:
function compare(value1,value2){ return value1-value2; } var arr = [1,3,2,5,4]; arr.sort(compare); console.log(arr); //[1,2,3,4,5]
"htmlcode">
var arr = [1,2,3]; var arr2 = arr.concat(4,[5,6]); console.log(arr); //[1,2,3] console.log(arr2); //[1,2,3,4,5,6]
"htmlcode">
var arr = [1,2,3,4,5]; var arr2 = arr.slice(1); //[2,3,4,5] var arr3 = arr.slice(1,3); //[2,3]
注意,slice()方法不会影响原来的数组。
"htmlcode">
var arr = [1,2,3,4,5]; arr.splice(2,0,11,22); //从位置2插入两项,没有删除 console.log(arr); //[1,2,11,22,3,4,5] arr.splice(2,2,33,44); //从位置2开始删除两项,插入两项,返回被删除的项 console.log(arr); //[1,2,33,44,4,5] arr.splice(1,1); //从位置1开始删除1项,返回被删除的项 console.log(arr); //[1,33,44,4,5]
"htmlcode">
var arr = [1,2,3,4,5,4,3,2,1]; console.log(arr.indexOf(4)); //3 console.log(arr.lastIndexOf(4)); //5 console.log(arr.indexOf(4,4)); //5 console.log(arr.lastIndexOf(4,4)); //3
"htmlcode">
var arr = [1,2,3,4,5,4,3,2,1]; var everyResult = arr.every(function(item,index,array){ return (item>2); }); console.log(everyResult); //false,并不是全部大于2 var someResult= arr.some(function(item,index,array){ return (item>2); }); console.log(someResult); //true,某一项大于2即可
filter()方法根据给定的函数确定是否在返回的数组中包含某一项,例如:
var arr = [1,2,3,4,5,4,3,2,1]; var filterResult = arr.filter(function(item,index,array){ return (item>2); }); console.log(filterResult); //[3,4,5,4,3],返回所有数值都大于2的一个数组
map()方法对于数组中的每一项都会运行给定的函数,然后将每一项函数运行结果组成的数组返回,例如:
var arr = [1,2,3,4,5,4,3,2,1]; var mapResult = arr.map(function(item,index,array){ return item*2; }); console.log(mapResult); //[2,4,6,8,10,8,6,4,2],原先数组每一项乘以2后返回
最后一个方法是forEach(),它只对数组中的每一项运行给定函数,没有返回值,例如:
var arr = [1,2,3,4,5,4,3,2,1]; arr.forEach(function(item,index,array){ //执行某些操作 });
"htmlcode">
var arr = [1,2,3,4,5]; var sum = arr.reduce(function(pre,cur,index,array){ return pre+cur; }); console.log(sum); //15
第一次执行回调函数,pre是1,cur是2。第二次,pre是3(1+2),cur是3。这个过程会把数组的每一项都访问一遍,最后返回结果。reduceRight()方法与reduce()类似,只不过方向相反而已。
这篇笔记主要是根据JavaScript高级程序设计和网上资源总结出来的,如果有不完善的地方还请指出。
以上这篇基于JavaScript Array数组方法(新手必看篇)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
更新日志
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果(九)》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]