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

1. forEach()

let array = [1,2,3,4];

array.forEach((item, index, array) => {

  console.log(item);

});

forEach会遍历数组, 没有返回值, 不允许在循环体内写return, 不会改变原来数组的内容.

2. map()

let array = [1, 2, 3, 4];

let temp = array.map((item, index, array) => {

  return item * 10;

});

console.log(temp);  //  [10, 20, 30, 40];

console.log(array);  // [1, 2, 3, 4]

// map 遍历数组, 会返回一个新数组, 不会改变原来数组里的内容

let temp2 = array.map(String);  // 把数组里的元素都转成字符串

3. filter()

let array = [1, 2, 3, 4];

let temp = array.filter((item, index, array) => {

  return item >  3;

});

console.log(temp);  // [4]

console.log(array);  // [1, 2, 3, 4]

// filter 会过滤掉数组中不满足条件的元素, 把满足条件的元素放到一个新数组中, 不改变原数组

4. reduce()

let array = [1, 2, 3, 4];

let temp = array.reduce((x, y) => {

  console.log("x": x);

  console.log("y": y);

  return x + y;

});

console.log(temp);  // 10

console.log(array);  // [1, 2, 3, 4]

// x 是上一次计算过的值, 第一次循环的时候是数组中的第1个元素

// y 是数组中的每个元素, 第一次循环的时候是数组的第2个元素

5. every()

let array = [1, 2, 3, 4];

let bo = array.every((item, index, array) => {

  return item > 2;

});

console.log(bo);    // false;

// every遍历数组, 每一项都是true, 则返回true, 只要有一个是false, 就返回false

6. some()

let array = [1, 2, 3, 4];

let tmep = array.some((item, index, array) => {

  return item > 1;

});

console.log(temp);  // true

// 遍历数组的每一项, 有一个返回true, 就停止循环

以上6个方法IE9及以上才支持。不过可以通过babel转义支持IE低版本。

以上均不改变原数组。

some、every返回true、false。

map、filter返回一个新数组。

reduce让数组的前后两项进行某种计算,返回最终操作的结果。

forEach 无返回值。

ES6数组方法总结的更多相关文章

  1. ES6 数组方法拓展

    ES6 数组方法拓展 1.Array.from() Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括E ...

  2. ES6数组方法

    ES6数组方法 以下方法添加到了Array.prototype对象上(isArray除外) indexOf 类似字符串的indexOf()方法 stringObject.indexOf(searchv ...

  3. ES5和ES6数组方法

    ES5 方法 indexOf和lastIndexOf 都接受两个参数:查找的值.查找起始位置不存在,返回 -1 :存在,返回位置.indexOf 是从前往后查找, lastIndexOf 是从后往前查 ...

  4. ES6 数组方法 forEach map filter find every some reduce

    1. forEach const colors = ['red', 'blue', 'green'] colors.forEach(function (params) { console.log(pa ...

  5. ES6数组的扩展--Array.from()和Array.of()

    一. Array.from() : 将伪数组对象或可遍历对象转换为真数组 1.何为伪数组 如果一个对象的所有键名都是正整数或零,并且有length属性,那么这个对象就很像数组,语法上称为"类 ...

  6. ES6数组及数组方法

    ES6数组可以支持下面的几种写法: (1)var [a,b,c] = [1,2,3]; (2)var [a,[[b],c]] = [1,[[2],3]]; (3)let [x,,y] = [1,2,3 ...

  7. 最新数组方法(包括es6)

    整理目前所用过的数组方法,学习了新增的es6方法. 1 arr.push() 从后面添加元素,返回值为添加完后的数组的长度 let arr = [1,2,3,4,5] console.log(arr. ...

  8. ES6新增的常用数组方法(forEach,map,filter,every,some)

    ES6新增的常用数组方法 let arr = [1, 2, 3, 2, 1]; 一 forEach => 遍历数组 arr.forEach((v, i) => { console.log( ...

  9. es6新增的数组方法和对象

    es6新增的遍历数组的方法,后面都会用这个方法来遍历数组,或者对象,还有set,map let arr=[1,2,3,4,3,2,1,2]; 遍历数组最简洁直接的方法法 for (let value ...

随机推荐

  1. 类中嵌套定义指向自身的引用(C、C++、C#)或指针(C、C++)

    在定义类的时候,类中可以嵌套定义指向自身的引用(C.C++.C#)或指针(C.C++).详见代码: Node类: using System; using System.Collections.Gene ...

  2. shell整数与小数比较,小数之间比较的方法【转】

    在shell脚本中,无法对浮点数进行比较,如: max=0.1 min=0.01 if [ "$max" -gt "$min" ] then echo &quo ...

  3. MySQL事务隔离级别(二)

    搞清楚MySQL事务隔离级别 首先创建一个表 account.创建表的过程略过(由于 InnoDB 存储引擎支持事务,所以将表的存储引擎设置为 InnoDB).表的结构如下: 为了说明问题,我们打开两 ...

  4. Vue使用NProgress

    NProgress是页面跳转是出现在浏览器顶部的进度条官网:http://ricostacruz.com/nprogress/github:https://github.com/rstacruz/np ...

  5. vue路由的异步加载(懒加载)方法

    vue路由的异步加载(懒加载)方法. javascriptvue.jsvue-router  阅读约 2 分钟 vue本身不多介绍.直接说问题,因为vue的所有路由都是加载在一个app.js里的,如果 ...

  6. 【C++】C++中重载运算符和类型转换

    输入输出运算符 输入输出运算符 输入输出运算符 算术和关系运算符 相等运算符 关系运算符 赋值运算符 复合赋值运算符 下标运算符 递增和递减运算符 成员访问运算符 函数调用运算符 lambda是函数对 ...

  7. Html表格和表头文字不换行

    [本文出自天外归云的博客园] 希望表头中的文字和表格中的文字不换行,只需要在th和td标签加上: nowrap="nowrap"

  8. WebGL学习笔记(十五):模板缓冲

    可以用来干啥? 模板缓冲一般用来实现一些地面反射投影和类似镜子的特殊效果,如下: 开启模板缓冲 默认情况下,模板缓冲是关闭的,模板缓冲如果处于关闭状态,运行模板相关的代码不会报错,但是不会出现预期的效 ...

  9. Anaconda(一)

    一.Anaconda下载安装 Anaconda + Pycharm是知乎大佬们推荐的Python标配, Anaconda有众多版本,截至2019年11月的最新版Anaconda内置的是Python3. ...

  10. Flutter入门(二)

    * 网格布局 class HomeContent extends StatelessWidget { List<Widget> _getListData() { var tempList ...