ES6之数组
数组新增方法
- map(可以理解为是映射,以一定规则修改数组每一项并返回全新数组)
- reduce(可以理解为是汇总,一堆出来一个)
- filter(可以理解为过滤,筛选的意思,以一定规则拿到符合的项并返回新数组)
- forEach(感觉和for循环是一个作用)
map示例
示例代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>map</title>
</head>
<body>
<script>
var arr = [1,2,3,4];
var resultArr = arr.map(function(item){
return item*2
});
console.log(arr,resultArr);
</script>
</body>
</html>
reduce示例
示例代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>reduce</title>
</head>
<body>
<script>
/*
*注:reduce默认有三个参数,第一个参数是每一次求值的结果值(初始等于数组第一项),
*第二个参数是下一项要计算的项,第三个值为第二个参数在数组中的索引
*/
var arr = [60,20,31,54];
//求数组各项和
var result = arr.reduce(function(temp,next,index){
return temp+next;
});
//求平均值
var result0 = arr.reduce(function(temp,next,index){
if(index < arr.length-1){
return temp + next;
}else{
return (temp+next) / arr.length;
}
})
console.log(arr,result,result0);
</script>
</body>
</html>
filter示例
示例代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>filter</title>
</head>
<body>
<script>
/*
*注:根据函数的返回值的真假来决定当前项需不需要放入要返回的新数组中
*itme就是数组的每一项的值,如果return为空则把当前item放入返回的数组中
*/
var arr = [1,2,3,5,8,4];
//取出数组中的偶数项
var resultArr = arr.filter(function(item){
return item % 2 === 0;
})
console.log(arr,resultArr);
</script>
</body>
</html>
forEach示例
示例代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>forEach</title>
</head>
<body>
<script>
/*
*对数组执行遍历,其中三个参数依次为当前遍历到的项,当前项的索引,和被遍历的数组本身
*/
var arr = [1,2,3,4];
arr.forEach(function(item,index,arr){
console.log(item,index,arr);
})
</script>
</body>
</html>
ES6之数组的更多相关文章
- ES6定型数组
前面的话 定型数组是一种用于处理数值类型(正如其名,不是所有类型)数据的专用数组,最早是在WebGL中使用的,WebGL是OpenGL ES 2.0的移植版,在Web 页面中通过 <canvas ...
- 分别使用ES5和ES6进行数组去重以及注意事项
ES6,ES5数组去重 使用Es6进行数组去重 var arr = [false, true, undefined, null, NaN, 0, 1, {}, {}, 'a', 'a', NaN]; ...
- ES6对数组的扩展(简要总结)
文章目录 数组的扩展(ES6) 1. 扩展运算符 2. Array.from 3. Array.of() 4. copyWithin() 5. find() 和 findIndex() 6. fill ...
- ES6之数组扩展方法【一】(相当好用)
form 转化为真正的数组 先说一下使用场景,在Js中,我们要经常操作DOM,比如获取全部页面的input标签,并且找到类型为button的元素,然后给这个按钮注册一个点击事件,我们可能会这样操作: ...
- ES6(五) 数组扩展
Array.of方法用于将一组值,转换为数组. Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES ...
- 关于ES6的数组字符串方法
注:ES6的一些新属性会显示语法错误,不过不会影响效果,在Languages里面也可以调: let:用来定义变量 特点:只能在代码块里面使用,let拥有块级作用域;并且let不允许重复声明;比如: v ...
- ES6中数组的新方法
数组的扩展 1.1扩展运算符 1.1.1:... 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. <body> < ...
- ES6 二进制数组
二进制数组(ArrayBuffer对象.TypedArray视图和DataView视图)是JavaScript操作二进制数据的一个接口.这些对象早就存在,属于独立的规格(2011年2月发布),ES6将 ...
- ES6,数组遍历
ES6提供了entries(),keys(),values()方法返回数组的遍历器,对于遍历器(Iterator)可以使用for...of进行便利,也可是使用entries()返回的遍历器Iterat ...
- ES6(数组)
ES6数组新增特性 1. 空数组 2.将伪数组转换成真正的数组 将 p 标签集合转换成真正数组 类似于map的用法,转换数组同时还在遍历. 3.填充数组(将所有数组换成一个值) 1代表起始位置,3代表 ...
随机推荐
- 本地ubuntu 往阿里云ubuntu服务器传文件
起因 今天在本地ubuntu搭环境,弄好之后需要把本地的文件传到服务器上去... 本想着用xftp直接拖过去,结果连接不上,可能是我太菜了吧,只好百度找方法··· 这里就简单的记录一下吧~ 步骤 sc ...
- Java查找指定文件中指定字符的个数
package lwl.youweb2.test; import java.io.BufferedReader; import java.io.FileReader; import java.io.I ...
- python应用 曲线拟合04
python应用 曲线拟合04 → 多项式拟合 主要是使用 numpy 库中的 polyfit() 函数,见第 66 行, z = np.polyfit(x_proton, y, 3) ,其中待拟合曲 ...
- Solr专题(二)详解Solr查询参数
一.前言 上节我们讲到了怎样去搭建solr服务,作为全文检索引擎,怎样去使用也是比较关键的.Solr有一套自己的查询方式,所以我们需要另外花时间去学习它的这套模式. 启动solr solr start ...
- Win10 在VM里面装Centos7.4后使用桥接模式连接外网,并用MobaXterm远程虚拟机详细教程
1.首先登陆虚拟机如图 2.执行ping命令看虚拟机里面的centos7是否可以连网 ping www.baiducom 此时会报错:name or service not known 3.设置一个文 ...
- [极客大挑战 2019]Secret File wp
通过标题考虑可能为文件包含漏洞方面 打开网页 从页面并没任何思路,查看源代码 得到有一个跳转到./Archive_room.php的超链接,打开Archive_room.php 中央有一个secret ...
- Magicodes.IE 2.3重磅发布——.NET Core开源导入导出库
在2.3这一版本的更新中,我们迎来了众多的使用者.贡献者,在这个里程碑中我们也添加并修复了一些功能.对于新特点的功能我将在下面进行详细的描述,当然也欢迎更多的人可以加入进来,再或者也很期待大家来提is ...
- AtomicInteger原理&源码分析
转自https://www.cnblogs.com/rever/p/8215743.html 深入解析Java AtomicInteger原子类型 在进行并发编程的时候我们需要确保程序在被多个线程并发 ...
- linux操作指南-01
目录 1.1 MBR 1.2 装双系统的坑 1.3 主机硬盘的主要规划 前言:记录下最近在看的鸟哥Liunx私房菜,虽然不是第一次看了..想记录几章开发中用的比较多的部分大致是以下几个章节 第3章 主 ...
- kafka学习(二)kafka工作流程分析
一.发送数据 follower的同步流程 PS:Producer在写入数据的时候永远的找leader,不会直接将数据写入follower PS:消息写入leader后,follower是主动的去lea ...