您的位置：首页 > Web前端 > JavaScript

JavaScript教程-11-ECMA5关于数组的一些新特性介绍

2020-03-29 13:21 501 查看

JavaScript教程-11-ECMA5关于数组的一些新特性介绍

在ECMA5中针对Array增加了一些新的功能，下面咱们介绍一下：

1：关于索引位置的方法

-- indexOf、lastIndexOf

2：迭代的方法

-- every、filter、forEach、some、map

3：缩小的方法

-- reduce、reduceRight

关于方法的参数的解释，都在示例中进行，大家仔细看代码和注释。

示例：

[code]<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ECMA5数组新特性</title>
<script type="text/javascript">
//关于索引位置的方法 indexOf  lastIndexOf
let arr = [1,2,3,4,5,4,3,2,1];
//参数：要搜索的元素的值。返回第一个相等元素的索引，如果不存在返回-1
let index = arr.indexOf(3);
alert(index);//2
//参数1：要搜索的元素的值，参数2：从指定的索引开始。返回第一个相等的元素的索引，如果不存在返回-1
index = arr.indexOf(3,5);
alert(index);//6
//参数：要搜索的元素的值。返回从后往前第一个相等元素的索引，如果不存在返回-1
index = arr.lastIndexOf(1);
alert(index);//8
//参数1：要搜索的元素的值，参数2：从指定的索引开始。返回从后往前第一个相等的元素的索引，如果不存在返回-1
index = arr.lastIndexOf(3,5);
alert(index);//2

//迭代的方法
//every：在参数中定义一个方法，该方法用来对数组中的每个元素进行进行判断，如果针对每个元素都成立，则
//整个every方法返回true，否则返回false。相当于每个元素比较之后结果的&&运算。
//参数1：数组的每个元素。参数2：元素的每个索引。参数3：被遍历的数组。
let result = arr.every(function(item,index, array){
//意思就是说，如果数组的每一个元素都大于0，则every 方法返回true。
return item > 0;
});
alert(result);//true

//filter：用于对数组的每个元素进行过滤，将满足条件的元素生成一个新的数组并返回
result = arr.filter(function(item, index, array){
//将数组中的元素大于2并且索引是偶数的过滤生成一个新数组
return item > 2 && index %2 == 0;
});
alert(result.length);//3
alert(result);//[3,5,3]

//forEach：对数组中的每个元素执行指定的方法
arr.forEach(function(item, index, array){
//将元素大于3的输出
if(item > 3){
alert(item);//4,5,4
}
});

//map：对数组的每个元素执行指定的方法的运算，将结果返回一个新数组。
result = arr.map(function(item, index, array){
//对所有的元素执行乘以2的操作
return item * 2;
});
alert(result);//2,4,6,8,10,8,6,4,2

//some：在参数中定义一个方法，该方法用来对数组中的每个元素进行进行判断，如果有一个元素成立返回true，则
//整个every方法返回true，否则返回false。相当于每个元素比较之后结果的||运算。
result = arr.some(function(item, index, array){
//只要有一个元素大于4，则结果是true。
return item > 4;
});
alert(result);//true

//reduce：用于对每个数组的元素进行指定回调方法的执行，并将指定的结果进行累加返回。
//语法：arr.reduce(callback,[initialValue])
//callback:函数中包含四个参数
//prevValue：上一次调用回调返回的值，或者是提供的初始值（initialValue）
//item 数组中当前被处理的元素
//index 当前元素在数组中的索引
//array 调用的数组
//initialValue 作为第一次调用 callback 的第一个参数。 如果不写就是0.
//求数组累加，并减去10的结果
result = arr.reduce(function(prevValue,item,index,array){
return prevValue + item;
},-10);
alert(result);//15

//reduceRight：用于从右往左遍历，作用和reduce一样。
result = arr.reduceRight(function(prevValue,item,index,array){
return prevValue + item;
});
alert(result);//25

</script>
</head>
<body>
</body>
</html>

PS：笔者有大量的学习资料：java、python、大数据、人工智能、前端等。需要的小伙伴请加群：711408961

笔者的b站中有一些教学视频分享。感兴趣的小伙伴可以关注：https://space.bilibili.com/412362068

  • 点赞
  • 收藏
  • 分享
  • 文章举报
木易yves 发布了37 篇原创文章 · 获赞 0 · 访问量 293 私信 关注
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航