频道栏目
首页 > 程序开发 > web前端 > HTML/CSS > 正文
js常用的数组方法及数组元素的遍历
2018-08-22 12:29:18           
收藏   我要投稿

js常用的数组方法 及数组元素的遍历

js常用的数组方法

创建数组
   var a = new Array();
   var b = [];
清空数组
var a.length = 0;
var b = [];
数组首位添加
unshit() 数组在首位添加第一个元素,并返回新的长度
var a = [1, 2];
var newLength = a.unshift(0); // 3  a = [0, 1, 2]
数组尾部添加
push() 数组尾部添加一个新元素或多个元素,返回新的数组长度
var a = [1, 2];
var b = [4, 5];
var newLength1 = a.push(3); // 3    a = [1, 2, 3] 
var newLength2 = a.push(b); // 4    a = [1, 2, 3, 4, 5]
数组首位删除
shit() 数组删除第一个元素, 并返回删除的元素
var a = [1, 2];
var deleteValue = a.shift(); // 1     a = [2]
数组尾部删除
pop() 数组删除最后一个元素, 并返回删除的元素
var a = [1, 2];
var deleteValue = a.pop(); // 2     a = [1]

数组的删除|替换

Array.splice (start, howmany, addArray);

start: 必选。 添加/删除的起始位置,负数表示从尾部开始数的倒数位置
howmany: 可选。表示删除的个数
addArray: 可选。添加的新数组

var a = [1, 2, 3, 4];
a.splice(1, 2, 'new') //替换   a = [1, 'new', 4]
var a = [1, 2, 3, 4];
a.splice(1, 0, 'new') //插入   a = [1, 'new', 2, 3, 4]
var a = [1, 2, 3, 4];
a.splice(1, 2)        //删除   a = [1, 4]
数组的截取
Array.slice(startIndex, endIndex);

startIndex: 必选。从该索引开始截取
endIndex: 可选。截取到该索引前结束。不选就默认截取到数组结束的所有的元素;是负数则是代表从数组尾部楷书算起的元素
var a = [1, 2, 3, 4, 5];
var newArray1 = a.slice(1,3) // newArray1 = [2, 3]
var newArray2 = a.slice(1) // newArray1 = [2, 3, 4, 5]
数组的排序
var a = [3, 2, 4, 1];
var newArray = a.sort((pre, next) => pre - next) // newArray = [1, 2, 3, 4]
a.reverse() //倒序
数组索引的查找
var a = [1, 2, 3];
var valueIndex = a.indexOf(2) // 1

数组元素的遍历

map() filter() find() forEach() every() some()

map() 对每项进行操作,并返回新的数组,不会改变原数组
var a = [1, 2, 3];
var b = [{person: 'json', tel: 111}, {person: 'lily', tel: 222}]
var newArray1 = a.map(item => item * 2) // newArray1 = [2, 4, 6]
var newArray2 = b.map(item => item.tel) // newArray2 = [111, 222]
filter() 筛选出符合条件的所有项,组成新的数组并返回
find() 筛选出符合条件的第一项
var a = [1, 2, 3, 4, 5, 6];
var newArray1 = a.filter(item => !(item%2)); // newArray1 = [2, 4, 6]
var newArray2 = a.find(item => !(item%2)); // newArray2 = 2
forEach() 对每项进行操作,并改变原数组
var a = [1, 2, 3];
a.map(item => item * 2) // a = [2, 4, 6]
every() 对每项进行操作,每项都返回true,结果才返回true
some()只要有一项符合条件就返回true
var a = [1, 2, 3, 4, 5, 6];
var allCheck = a.filter(item => !(item%2)); // allCheck = false
var someCheck = a.find(item => !(item%2)); // someCheck = true
点击复制链接 与好友分享!回本站首页
上一篇:ES6系列之—let、const命令解析
下一篇:Html5的globalCompositeOperation合成属性
相关文章
图文推荐
点击排行

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站