filter也是一个常用的操作,它用于把Array的某些元素过滤掉,然后返回剩下的元素。

map()类似,Arrayfilter()也接收一个函数。和map()不同的是,filter()把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素。

(1)筛选过滤,保留偶数

例如,在一个Array中,删掉奇数,只保留偶数,可以这么写:

    <script type="text/javascript">
var arr = [0,1,2,3,4,5,1,4,0];
var arr_filter = arr.filter(function(x){
return x%2 == 0;/* 筛选偶数 */
})
console.log(arr_filter)
</script>

(2)筛选去除空格

筛选去除空格

    <script type="text/javascript">
var arr = ['0',1,2,3,4,"",5,1,4,'0',""];
var arr_filter = arr.filter(function(x){
return x;/* 筛选空格 */
})
console.log(arr_filter)
</script>

(3)回调函数

  filter()接收的回调函数,其实可以有多个参数。通常仅使用第一个参数,表示Array的某个元素。回调函数还可以接收另外两个参数,表示元素的位置和数组本身:

        var arr = ['A','B','C','d'];
var arr_filter = arr.filter(function(element,index,self){
console.log(element);/* 依次打印'A','B','C','d' */
console.log(index);/* 依次打印0,1,2,3 */
console.log(self);/* 打印数组本身即arr */
return true;
})

利用filter,可以巧妙地去除Array的重复元素:

        var arr_repeat = ['A','B','A','B','B','C','A','D'];
var arr_filter = arr_repeat.filter(function(element,index,self){
return self.indexOf(element) == index;
})
console.log(arr_filter);//返回['A','B','C','D']

去除重复元素依靠的是indexOf总是返回第一个元素的位置,后续的重复元素位置与indexOf返回的位置不相等,因此被filter滤掉了。

.

JS的filter用法的更多相关文章

  1. python3 filter用法(举例求0~n之间的素数)

    在用python3求0~n之间的素数时,关于filter用法的有点模糊,于是上网查了一下filter用法. 求0~n之间素数的脚本prime.py: def f(x): plist = [0,0] + ...

  2. js事件监听器用法实例详解

    这篇文章主要介绍了js事件监听器用法,以实例形式较为详细的分析了javascript事件监听器使用注意事项与相关技巧,需要的朋友可以参考下本文实例讲述了js事件监听器用法.分享给大家供大家参考.具体分 ...

  3. Ext.Net学习笔记12:Ext.Net GridPanel Filter用法

    Ext.Net学习笔记12:Ext.Net GridPanel Filter用法 Ext.Net GridPanel的用法在上一篇中已经介绍过,这篇笔记讲介绍Filter的用法. Filter是用来过 ...

  4. js事件监听器用法实例详解-注册与注销监听封装

    本文实例讲述了js事件监听器用法.分享给大家供大家参考.具体分析如下: 1.当同一个对象使用.onclick的写法触发多个方法的时候,后一个方法会把前一个方法覆盖掉,也就是说,在对象的onclick事 ...

  5. JS数组filter()、map()、some()、every()、forEach()、lastIndexOf()、indexOf()实例

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat=&qu ...

  6. JS的简单用法

    JS的简单用法 参考:http://www.w3school.com.cn/js/js_switch.asp JavaScript 是网络的脚本语言 JavaScript 是可插入 HTML 页面的编 ...

  7. js 的filter()方法

    filter()方法使用指定的函数测试所有元素,并创建一个包含所有通过测试的元素的新数组. filter()基本语法: arr.filter(callback[, thisArg]) filter() ...

  8. Django 资源 与 知识 Django中自建脚本并使用Django环境 model中的save()方法说明 filter()用法

    Django 资源 与 知识 Django中自建脚本并使用Django环境 model中的save()方法说明 filter()用法 2018/11/06 Chenxin 资料说明 Django基础入 ...

  9. JS和jQuery用法区别

    目录 JS和jQuery用法区别 外观区别 查找元素 操作标签 操作内容 操作属性 操作位置 操作样式 事件 JS和jQuery用法区别 外观区别 jQuery与JS最直观的区别就是外观上jQuery ...

随机推荐

  1. Android处理日期

    近期做一个项目,后台返回的日期是RFC3339格式的.之前没有看到过,当中遇到了几个问题以及解决 1.2015-11-18T14:49:55Z转换 在SimpleDateFormat中给出了几种格式 ...

  2. 基于Canvas的Char.js库使用

    Chart.js是基于Html5 Canvas的图表库. 官网:http://www.chartjs.org/ 參考文档:http://www.chartjs.org/docs/ 支持六种图表,相应源 ...

  3. [办公自动化]凭证纸打印 IE 默认设置

    财务人员需要打印凭证纸,系统windows7,打印机HP P1106 在自定义纸张类型中设置凭证纸. 属性,打印首选项,“纸张和质量”选卡处,单击自定义(需要管理员权限) 输入“PZ” 宽148 高2 ...

  4. easyUI的下拉框combobox与树tree联动

    参与联动的有 2 个combobox 和 1 个tree: <input id="combobox1" class="easyui-combobox" n ...

  5. Linux服务器 /var/spool/clientmqueue 目录下产生大量文件的删除办法

    检查linux发现server中的磁盘分区空间超过98%,登录到服务器查看 [root@localhost etc]# df -hFilesystem 容量 已用 可用 已用% 挂载点/dev/hda ...

  6. YTU 2506: 切面条

    2506: 切面条 时间限制: 1 Sec  内存限制: 128 MB 提交: 382  解决: 223 题目描述 一根高筋拉面,中间切一刀,可以得到2根面条.      如果先对折1次,中间切一刀, ...

  7. YTU 2623: B 抽象类-形状

    2623: B 抽象类-形状 时间限制: 1 Sec  内存限制: 128 MB 提交: 235  解决: 143 题目描述 定义一个抽象类Shape, 类中有两个纯虚函数. 具体类正方形类Shape ...

  8. Permutations II 典型去重

    https://leetcode.com/problems/permutations-ii/ Given a collection of numbers that might contain dupl ...

  9. KeepAlived的实现示例

    KeepAlived的实现示例 KeepAlived的实现 HA Cluster配置准备: 各节点时间必须同步 ntp(6), chrony(7) 1>在centos6上 ntpdate 172 ...

  10. ssh验证和端口转发

    ssh 服务登录验证 ssh 服务登录验证方式: 用户/ 口令 基于密钥 基于用户和口令登录验证 客户端发起ssh请求,服务器会把自己的公钥发送给用户 用户会根据服务器发来的公钥对密码进行加密 加密后 ...