ES6数组新增的几个方法

2017年03月24日 13:38:04 tang15886395749 阅读数:10461 标签: ES6数组新增方法 更多

个人分类: js相关
 

关于数组中forEach() 、map()、filter()、reduce()、some()、every()的总结

1、forEach()

var arr = [1,2,3,4];
arr.forEach((item,index,arr) => {
console.log(item) //结果为1,2,3,4
})
//forEach遍历数组,无返回值,不改变原数组,仅仅只是遍历、常用于注册组件、指令等等。

2、map()

var arr = [1,2,3,4];
arr.map((item,index,arr) => {
return item*10 //新数组为10,20,30,40
})
//map遍历数组,返回一个新数组,不改变原数组的值。

3、filter()

var arr = [1,2,3,4];
arr.filter((item,index,arr) => {
return item > 2 //新数组为[3,4]
})
//filter过滤掉数组中不满足条件的值,返回一个新数组,不改变原数组的值。

4、reduce()

var arr = [1,2,3,4];
arr.reduce((result,item,index,arr) => {
console.log(result) // 1 3 6 result为上次一计算的结果
console.log(item) // 2 3 4
console.log(index) // 1 2 3
return result+item //最终结果为10
})
//reduce 让数组的前后两项进行某种计算。然后返回其值,并继续计算。不改变原数组,返回计算的最终结果,从数组的第二项开始遍历。

5、some()

var arr = [1,2,3,4];
arr.some((item,index,arr) => {
return item > 3 //结果为true
})
//遍历数组每一项,有一项返回true,则停止遍历,结果返回true。不改变原数组

6、every()

var arr = [1,2,3,4];
arr.every((item,index,arr) => {
return item > 1 //结果为false
})
//遍历数组每一项,每一项返回true,则最终结果为true。当任何一项返回false时,停止遍历,返回false。不改变原数组

以上6个方法均为ES6语法,IE9及以上才支持。不过可以通过babel转意支持IE低版本。 
以上均不改变原数组。 
some、every返回true、false。 
map、filter返回一个新数组。 
reduce让数组的前后两项进行某种计算,返回最终操作的结果。 
forEach 无返回值。

es6 新的数组操作的更多相关文章

  1. 包括ES6在内的数组操作(待更)

    下面是我对ES6和古老的JS(ES3)一些数组操作的总结,附带了一些我曾经用上的. map处有待更内容. 贴一下有借鉴的网站:https://segmentfault.com/a/1190000002 ...

  2. ES6新特性-------数组、Math和扩展操作符(续)

    三.Array Array对象增加了一些新的静态方法,Array原型上也增加了一些新方法. 1.Array.from 从类数组和可遍历对象中创建Array的实例 类数组对象包括:函数中的argumen ...

  3. ES6之数组操作

    es6中对于数组操作添加了4种方法: 1.map —— 映射(一个对应一个) 2.reduce —— 汇总(多个出来一个) 3.filter —— 过滤 4.forEach —— 迭代/循环. 1.m ...

  4. js数组操作find查找特定值结合es6特性

    js数组操作find查找特定值结合es6特性

  5. js 使用ES6 实现从json中取值并返回新的数组或者字符串

    1.获取的json数据是这样的: data:[ { 'Id': '1', 'Phone': '123456', 'Name': '张三', }, { 'Id': '2', 'Phone': '7894 ...

  6. ES6新特性概览

    本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony( ...

  7. 总结常见的ES6新语法特性

    前言 ES6是即将到来的新版本JavaScript语言的标准,他给我们带来了更"甜"的语法糖(一种语法,使得语言更容易理解和更具有可读性,也让我们编写代码更加简单快捷),如箭头函数 ...

  8. 常见ES6新属性

    ES6是即将到来的新版本JavaScript语言的标准,他给我们带来了更"甜"的语法糖(一种语法,使得语言更容易理解和更具有可读性,也让我们编写代码更加简单快捷),如箭头函数(=& ...

  9. ES6新特性:Proxy代理器

    ES6新特性:Proxy: 要使用的话, 直接在浏览器中执行即可, node和babel目前还没有Proxy的polyfill;,要使用的话,直接在浏览器中运行就好了, 浏览器的兼容性为:chrome ...

随机推荐

  1. MMC & SD 发展历史

    一.概述 MMC 卡和 SD 卡都是基于 Nand Flash 技术的移动存储卡. MMC(MultiMediaCard) 卡于 1997 年由西门子和 Sandisk 推出,SD (Secure D ...

  2. Java知识系统回顾整理01基础04操作符05赋值操作符

    一.赋值操作 赋值操作的操作顺序是从右到左 int i = 5+5; 首先进行5+5的运算,得到结果10,然后把10这个值,赋给i public class HelloWorld { public s ...

  3. Python数据结构与算法之图的广度优先与深度优先搜索算法示例

    本文实例讲述了Python数据结构与算法之图的广度优先与深度优先搜索算法.分享给大家供大家参考,具体如下: 根据维基百科的伪代码实现: 广度优先BFS: 使用队列,集合 标记初始结点已被发现,放入队列 ...

  4. matlab中fopen 打开文件或获得有关打开文件的信息

    参考:https://ww2.mathworks.cn/help/matlab/ref/fopen.html?searchHighlight=fopen&s_tid=doc_srchtitle ...

  5. 为Android(和其他移动平台)安装MoSync

    为Android(和其他移动平台)安装MoSync Android教程比赛 这是我提交的文章#2:设置你的Android开发环境.它的主要区别在于它描述了如何安装MoSync,这是一种开发环境,它不是 ...

  6. day64:nginx模块之限制连接&状态监控&Location/用nginx+php跑项目/扩展应用节点

    目录 1.nginx模块:限制连接 limit_conn 2.nginx模块:状态监控 stub_status 3.nginx模块:Location 4.用nginx+php跑wordpress项目 ...

  7. SpringBoot整合Mybatis 编译失败:找不到符号 程序包不存在

    问题描述:jpa不好用,转用mybatis,配置多数据源  但是配置后无法编译mvn clean install  dao层这些报错,找不到entity的包     问题解决:罪魁祸首:热部署的部分 ...

  8. 两大IT培训巨头,达内和传智播客哪个更好?

    多年来,从财报收入及培训规模角度来看,达内和传智播客分别在IT培训领域占据第一和第二的位置已经是不争的事实,但是从培训学员的角度来讲,选择达内和传智播客哪个更好呢,这两家机构在学员心目中的排名和营收的 ...

  9. BST,Splay平衡树学习笔记

    BST,Splay平衡树学习笔记 1.二叉查找树BST BST是一种二叉树形结构,其特点就在于:每一个非叶子结点的值都大于他的左子树中的任意一个值,并都小于他的右子树中的任意一个值. 2.BST的用处 ...

  10. 不出意外,排名第一的还是它,程序员为什么都喜欢用Chrome?

    程序员为什么喜欢使用Chrome? 其实不单单是程序员喜欢使用Chrome,现在大多数的小伙伴都使用Chrome. 我们可以看到Netmarketshare发布了2020年7月的操作系统与浏览器市场份 ...