1. filter()

都是数组方法,这个方法和forEach()的方法的区别又是什么呢?

2. 先说结论

filter() 和 forEach() 都是遍历数组的方法,甚至它们匿名函数的形参都是一样的,

而区别就在于 filter()是专门用来筛选数组内容的,

调用了filter()方法的之后,是需要接收一下的。

比如说拿一个新的变量来接受一下,或者拿原来那个调用了filter()方法的数组变量来接收一下

3. 直接上代码吧

点击查看代码
    var myArr = [1, 2, 3]
var newArr = myArr.filter(function(currentValue, index, array) {
return currentValue > 1
})
console.log(newArr);

这段代码的意思,就是筛选myArr数组里面大于1的元素,然后用一个新的变量来接受filter()返回的结果



结果就是这么简单。

实际上filter方法一遍只用写一个参数,

也就是默认的第一个参数当前循环数组的项currentValue,

上面的代码精简写法如下:

点击查看代码
    var newArr = myArr.filter(item => {
return item > 1
})
console.log(newArr);

同样的这里贴一个视频讲解地址:https://www.bilibili.com/video/BV1DY41177dM?p=40

关于js数组方法filter()的更多相关文章

  1. js 数组方法比较

    js 数组方法比较 table th:first-of-type { width: 80px; } table th:nth-of-type(2) { width: 120px; } table th ...

  2. js数组方法详解

    Array对象的方法-25个 /*js数组方法详解 */ /* * 1 concat() 用于连接多个数组或者值-------------- * 2 copyWithin() 方法用于从数组的指定位置 ...

  3. 转载收藏(js数组方法大全)

    js数组方法大全 JavaScript中创建数组有两种方式 (一)使用 Array 构造函数: var arr1 = new Array(); //创建一个空数组var arr2 = new Arra ...

  4. js数组方法大全(下)

    # js数组方法大全(下) 记录一下整理的js数组方法,免得每次要找方法都找不到.图片有点多,注意流量,嘻嘻! 本期分享 forEach() map() filer() every() some() ...

  5. js数组方法大全(上)

    # js数组方法大全(上) 记录一下整理的js数组方法,免得每次要找方法都找不到.图片有点多,注意流量,嘻嘻! 本期分享 join() reverse() sort() concat() slice( ...

  6. 几个关于js数组方法reduce的经典片段

    以下是个人在工作中收藏总结的一些关于javascript数组方法reduce的相关代码片段,后续遇到其他使用这个函数的场景,将会陆续添加,这里作为备忘. javascript数组那么多方法,为什么我要 ...

  7. js数组方法详解(最新最全)

    数组是js中最常用到的数据集合,其内置的方法有很多,熟练掌握这些方法,可以有效的提高我们的工作效率,同时对我们的代码质量也是有很大影响.本文所有的栗子都是在es7环境下测试的,如果有问题欢迎留言交流 ...

  8. js数组方法解析

    js 数组有很多方法,其中有的常用,有的不常用,归纳几个常用的方法,做个总结: 1. 转换方法: 1.1 valueOf():调用这个方法会返回数组本身 <script> var arr ...

  9. JS数组方法汇总 array数组元素的添加和删除

    js数组元素的添加和删除一直比较迷惑,今天终于找到详细说明的资料了,先给个我测试的代码^-^ var arr = new Array(); arr[0] = "aaa"; arr[ ...

  10. js 数组方法总结

    Array数组: length属性 可通过array.length增加或者减少数组的长度,如;array.length=4(数组长3,第四位为undefined),也可单纯获得长度.array[arr ...

随机推荐

  1. Symfony2在Nginx下的配置方法图文教程

    来源: https://www.xp.cn/b.php/79706.html Symfony2在Nginx下的配置方法图文教程 本文详细讲述了Symfony2在Nginx下的配置方法.分享给大家供大家 ...

  2. vuex中的state、mutations 、actions 、getters四大属性如何使用

    一.state (提供唯一的公共数据源) 方式1 在div中,$store.state.count 方式2 import {mapState} from 'vuex' computed:{ -mapS ...

  3. shell脚本,shell语法和结构(以Cshell/TC shell为例)

    1.C shell/TC shell常用语法和结构 (1) shbang行: #!/bin/sh,通知内核使用哪种内核解释脚本; #!/bin/csh 或 #!/bin/tcsh (2) 注释: 以# ...

  4. MARKDEEP.js-一个轻松在HTML中输入MD代码的JavaScript库

    MARKDEEP.js-一个轻松在HTML中输入MD代码的JavaScript库 http://casual-effects.com/markdeep/ 引入: <style class=&qu ...

  5. 三本书带您快速深入掌握Spring Boot应用开发《Spring Boot从零开始学(视频教学版)》

    #好书推荐##好书奇遇季#三本书带您快速深入掌握Spring Boot应用开发<Spring Boot从零开始学(视频教学版)><Spring Boot应用开发实战><深 ...

  6. css 特殊性 权重排列

    首先类似于二进制的理解. 0010大于0001. id = 0,1,0,0; class, [属性值],:伪类 = 0,0,1,0: <元素>,伪元素 = 0,0,0,1: 伪元素:  : ...

  7. es 集群并设置密码

    1. 生成证书 bin/elasticsearch-certutil cert -out config/elastic-certificates.p12 -pass ""2. el ...

  8. p标签设置行数,超出部分用省略号隐藏

    p { overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; word-wrap: break-word; display ...

  9. 排序算法 | JS

    1.冒泡排序 function bubbleSort(arr,order){ let len = arr.length-1,flag=true for(let i=0;(i<len)&& ...

  10. babel npm包说明

    babel-plugin-import 用于按需加载,在使用antd 的时候引入,可以减少包体积