JS中filter( )数组过滤器的使用

目录
  • 一、前言
  • 二、方法简介
  • 三、用法案例
  • 总结

一、前言

数组过滤器是前端数据处理的一种常用方法，对于前端来说，后端返回的数据我们需要经过处理以后才能获取到自己想要的数据，进行进一步的操作。有时候后端返回给我我们的值仅可以作为参考。

二、方法简介

filter( )方法会创建一个新数组，数组中的数据是经过指定数据中过滤出来的符合条件的数据

filter( )的两大特点

1.filter( )不会对空数组进行检测

2.filter( )不会改变原数组

filter( )方法的用法：

array.filter(function(currentValue,index,arr), thisValue)
//currentValue：当前元素的值
//index：当前元素的下标
//arr：原数组

三、用法案例

1.获取数组中符合条件的元素

const school = [
  {
    occupation:"老师",
    age:40
  },
  {
    occupation:"学生",
    age:23
  },{
    occupation:"程序猿",
    age:1
  }
]
var newShool = school.filter(item => item.age > 20)
console.log(newShool);//[ { occupation: '老师', age: 40 }, { occupation: '学生', age: 23 } ]

总结

本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注我们的更多内容！

赞 (0)

相关推荐

  • angularjs过滤器--filter与ng-repeat配合有奇效

    index.html <!DOCTYPE html> <html> <head> <link href="bootstrap.min.css" rel="external nofollow" rel="stylesheet"> </head> <body ng-app="myApp" ng-controller="myCtrl"> &l

  • JSP 开发中过滤器filter设置编码格式的实现方法

    JSP 开发中过滤器filter设置编码格式的实现方法 我们知道为了避免提交数据的乱码问题,需要在每次使用请求之前设置编码格式.在你复制粘贴了无数次request.setCharacterEncoding("gb2312");后,有没有想要一劳永逸的方法呢?能不能一次性修改所有请求的编码呢? 用Filter吧,它的名字是过滤器, 代码如下: import java.io.IOException; import javax.servlet.Filter; import javax.ser

  • jsp filter 过滤器功能与简单用法示例

    本文实例讲述了jsp filter 过滤器功能与简单用法.分享给大家供大家参考,具体如下: 过滤器的作用是什么? 过滤器可以动态地拦截请求和响应,以变换或使用包含在请求或响应中的信息. 可以将一个或多个过滤器附加到一个 Servlet 或一组 Servlet.过滤器也可以附加到 JavaServer Pages (JSP) 文件和 HTML 页面. 在客户端的请求访问后端资源之前,拦截这些请求. 在服务器的响应发送回客户端之前,处理这些响应. 过滤器的实现要实现 java.servlet.Fil

  • js 数组 find,some,filter,reduce区别详解

    区分清楚Array中filter.find.some.reduce这几个方法的区别,根据它们的使用场景更好的应用在日常编码中. Array.find Array.find 返回一个对象(第一个满足条件的对象)后停止遍历 const arrTest = [ { id: 1, name: "a" }, { id: 2, name: "b" }, { id: 3, name: "b" }, { id: 4, name: "c" }

  • angularJs中orderBy筛选以及filter过滤数据的方法

    如下所示: <div ng-app="module" ng-controller="ctrl"> <!--按照click降序排序--> {{data|orderBy:'click':true}}<br> <!--按照id升序排序--> {{data|orderBy:'id':false}}<br> <!--筛选匹配3的数据--> {{data|filter:'3'}}<br> <

  • JS中filter( )数组过滤器的使用

    目录 一.前言 二.方法简介 三.用法案例 总结 一.前言 数组过滤器是前端数据处理的一种常用方法,对于前端来说,后端返回的数据我们需要经过处理以后才能获取到自己想要的数据,进行进一步的操作.有时候后端返回给我我们的值仅可以作为参考. 二.方法简介 filter( )方法会创建一个新数组,数组中的数据是经过指定数据中过滤出来的符合条件的数据 filter( )的两大特点 1.filter( )不会对空数组进行检测 2.filter( )不会改变原数组 filter( )方法的用法: array.

  • js中删除数组中的某一元素实例(无下标时)

    1.使用filter数组去重: var arr1 = [1,2,3,4,5,6];//待操作数组 var j = 2;//待删除元素 var noRepeat = function(arr1,arr2){ return arr1.flter(function(e){ return arr2.indexOf(e) == -1; }) }; var arr2 = []; arr2.push(j);//保证待删除数为数组,方便使用过滤器 console.log(noReapeat(arr1,arr2)

  • JS中的数组转变成JSON格式字符串的方法

    有一个JS数组,如: var arr = [["projectname1","projectnumber1"],["projectname2","projectnumber2"],["projectname3","projectnumber3"]]; 想将此数组转换成JSON字符串,如: var jsonarr = [{"projectname":projectnam

  • js中一维数组和二位数组中的几个问题示例说明

    js中的数组,可以存放各种数据类型(数值,字串) js中的数组没有越界,当输出的数组下标越界了,会显示undefined. js中的数组是默认动态增长的 遍历数组的一种简单方式. for(var key in arr){ window.alert(key+"= "+arr[key]); } 在给一个空的二维数组赋值的时候出现的问题: var arr2=[]; arr2[1][1]=45;//js不支持这种赋值方法 解决方法: //在这之前需要初始化定义arr2有多少行. for(var

  • JS中对数组元素进行增删改移的方法总结

    在js中对数组元素进行增删改移,简单总结了一下方法: 方法 说明 实例 push( ); 在原来数组中的元素最后面添加元素 arr.push("再见58"); unshift( ); 在原来数组中的元素最前面添加元素 arr.shift("你好58"): pop(); 移除数组中最后面的一个元素 arr.pop(); shift(); 移除数组中最前面的一个元素 arr.shift(); concat(); 拼接两个数组中的元素 (哪个数组在前面,拼接后它的元素就在

  • JS中的数组方法笔记整理

    push()方法:可以向数组的末尾添加一个或者多个元素,并且返回新的长度 pop()方法:可以删除数组最后一个元素,并且返回被删除的元素,注意:如果数组是空的,该方法不进行任何操作,返回undefined. unshift()方法:可以向数组的开头添加一个或者多个元素,并且返回新的长度 shift()方法:可以删除数组第一个元素,并且返回被删除的元素,注意:如果数组是空的,该方法不进行任何操作,返回undefined. splice()方法:从数组中添加/删除项目,然后返回被删除的项目,该方法会

  • Vue中foreach数组与js中遍历数组的写法说明

    Vue foreach数组与js中遍历数组的写法 场景 Vue中使用Axios发送get或者post请求,发送请求时需要在js中 对请求参数进行遍历并处理. 接收响应时需要对响应结果进行遍历和处理. 注意区分在vue和js中foreach数组的区别. 实现 在js中遍历数组 //定义班次详细数组 var bcglxiangxiList = new Array(); //定义班次详细对象 var bcxiangxi = {}; //循环传递的参数 bcglXiangXiListParam.forE

  • 关于JS中一维数组和二维数组互转问题

    关于JS中一维数组和二维数组互转问题

    一维数组转二维数组 arr1to2(arr, number) { var arr2 = []; let len = arr.length; for (let i = 0, j = 0; i < len; i += number, j++) { arr2[j] = arr.splice(0, number); } return arr2; }, 使用: let arr1 = [ 103.743896484375, 21.48374090716327, 101.05224609374999, 20.

  • JS中Array数组学习总结

    引用类型分为Object类型(所谓的对象),Array类型(本文谈的数组),Function类型等. 那么,数组是干啥的呢?在我看来,它是用来保存数据的. 一.声明一个数组: 1.构造函数 var colors=new Array():简写的话可以省略new,即var colors=Array(); 2.数组字面量 var colors=["black","green","pink"]; 二.读取和设置数组的值: 读取:colors[x];参数x

  • js中的数组对象排序分析

    一.普通数组排序 js中用方法sort()为数组排序.sort()方法有一个可选参数,是用来确定元素顺序的函数.如果这个参数被省略,那么数组中的元素将按照ASCII字符顺序进行排序.如: var arr = ["a", "b", "A", "B"]; arr.sort(); console.log(arr);//["A", "B", "a", "b"

随机推荐