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. 【剑指Offer学习】【面试题31:连续子数组的最大和】

    题目:输入一个整型数组,数组里有正数也有负数.数组中一个或连续的多个整数组成一个子数组.求全部子数组的和的最大值.要求时间复杂度为O(n). 样例说明: 比如输入的数组为{1, -2, 3, 10, ...

  2. [DevExpress]设置列的时间格式

    方法一 设置DisplayFormatFormatString:gFormatType:DateTime 方法二

  3. myeclipse下jsp页面汉字不能保存问题

    在JSP页面中写了些汉字,结果想保存时,却提示编码不对.真扯!说什么"ISO-9000"之类的东东. 我记得以前可以在eclipse的菜单"编辑"中指定当前文件 ...

  4. JavaScript基础 -- DOM

    一.DOM全称 文档对象模型(Document Object Model) 二.DOM是什么 DOM可以说是制作动态页面的强有力工具.DOM不是JavaScript语言的一部分,而是内置在浏览器中的一 ...

  5. flash、flex builder、flash builder、 air的关系

    flash VS flex builder flash被adobe收购的时候是flash8,已经可以AS2面向对象了. 而被adobe收购后,adobe准备把flash打造成一个开发工具.就比如JBU ...

  6. 获取view宽高

    在oncreate()中利用view.getWidth()或是view.getHeiht()来获取view的宽和高,看似没有问题,其实他们去得值是0,并不是你想要的结果? 这是为什么呢? 在调用onc ...

  7. LR(逻辑回归)

    逻辑回归(Logistic regression): 想要理解LR,只需要记住: Sigmoid 函数: y=1/(1+e-z) 线性回归模型: y=wTx+b 最后: y= 1/(1+e-(wTx+ ...

  8. Vue Router过渡动效

    <router-view> 是基本的动态组件,所以我们可以用 <transition> 组件给它添加一些过渡效果: <transition> <router- ...

  9. J201700526-hm

    プレーンテキスト  纯文本 きも 肝 リレーショナル 亲属的,相关的,有关的; ギャップ 缺口; 间隔; 分歧;

  10. 二分图最大匹配(匈牙利算法) POJ 3041 Asteroids

    题目传送门 /* 题意:每次能消灭一行或一列的障碍物,要求最少的次数. 匈牙利算法:把行和列看做两个集合,当有障碍物连接时连一条边,问题转换为最小点覆盖数==二分图最大匹配数 趣味入门:http:// ...