ES5新增数组方法(1):filter
检测数组元素,并返回符合条件所有元素的数组。
1、过滤数组中不符合条件的元素
let arr = [1, 2, 3, 4, 5, 6]; // 方式一
let newArr = arr.filter((value, index, array) => {
if(value % 2 === 0) {
return value
}
});
console.log(newArr);// [ 2, 4, 6 ] // 方式二
newArr = arr.filter((item) => item % 2 === 0);
console.log(newArr);// [ 2, 4, 6 ]
2、过滤数组中空字符串、undefined、null的元素
let arr = ['a', '', 'b', undefined, 'c', null];
let newArr = arr.filter(item => item);
console.log(newArr);// [ 'a', 'b', 'c' ]
3、过滤数组中重复的元素(数组去重)
let arr = [1, 2, 2, 3, 3, 3, 4, 5];
let newArr = arr.filter((value, index, array) => array.indexOf(value) === index);
console.log(newArr);// [ 1, 2, 3, 4, 5 ]
ES5新增数组方法(1):filter的更多相关文章
- 4日6日--ES5新增数组方法
forEach使用的函数调用,所以占内存比较大,不如定长for循环和迭代for循环 1.通过forEach将数组中的元素逐个表示出来(遍历方法,读取操作). 2.通过map将原数组中的元素进行算数运算 ...
- js数组定义和方法 (包含ES5新增数组方法)
数组Array 1. 数组定义 一系列数据的集合成为数组.数组的元素可以为任何类型的数据(包括数组,函数等),每个元素之间用逗号隔开,数组格式:[1,2,3]. 2. 数组创建方式 (1) 字面量方法 ...
- ES5新增数组方法测试和字符串常见API测试
首先是ES5新增数组方法测试: <!DOCTYPE html><html lang="en"><head> <meta charset=& ...
- ES5新增数组方法every()、some()、filter()、map()
JavaScript ES5标准中新增了一些Array方法,如every().some().filter().map().它们的出现使我们能够更加便利地操作数组,但对IE9以下浏览器的兼容性比较差.下 ...
- ES5新增数组方法
forEach/map every/some indexOf/lastIndexOf filter reduce Array.isArray
- ES5新增数组方法(4):every
检查数组元素的每个元素是否符合条件. // 数组中的元素全部满足指定条件返回true let arr = [1, 3, 5, 7, 9]; console.log(arr.every((value, ...
- ES5新增数组方法(3):some
检查数组元素中是否有元素符合指定. // 数组中的元素部分满足指定条件返回true let arr = [1, 3, 5, 7, 9]; console.log(arr.some((value, in ...
- ES5新增数组方法(2):map
通过指定函数处理数组的每个元素,并返回处理后的数组. 1.计算数组中每个元素的平方 let arr = [1, 2, 3, 4, 5, 6]; let newArr = arr.map(item =& ...
- ES5新增数组的方法
ES5新增数组的方法 ES5新增数组常见方法(indexOf/forEach/map/filter/some/every) .indexOf( data , start) 检测数组中是否存在指定数据 ...
随机推荐
- Object Detection with Discriminatively Trained Part Based Models
P. Felzenszwalb, R. Girshick, D. McAllester, D. RamananObject Detection with Discriminatively Traine ...
- NPM 常见错误
找不到兼容版本 你有一个过时的npm.请更新到最新稳定的npm. 权限错误 npm ERR! code EPERM npm ERR! code EACCES 修复缓存的权限sudo chown -R ...
- linux 执行程序时,提示not found问题分析
sh: ./test: not found 通常可以通过readelf查看该进程文件所以依赖的运行环境,检查相关路径是否存在对应的文件. 比如如下: 1. 检查/lib目录,发现ld-X.XX.so为 ...
- ssm整合-错误4
严重: Servlet.service() for servlet [dispatcher] in context with path [/management] threw exception [R ...
- Linux运维工作中需要掌握的知识
说到工具,在行外可以说是技能,在行内我们一般称为工具,就是运维必须要掌握的工具.我就大概列出这几方面,这样入门就基本没问题了.linux系统如果是学习可以选用redhat或centos,特别是cent ...
- angular、angular2、vue的生命周期
angular生命周期是什么 1.Angular每个组件都存在一个生命周期,从创建,变更到销毁.Angular提供组件生命周期钩子,把这些关键时刻暴露出来,赋予在这些关键结点和组件进行交互的能力,掌握 ...
- JS高级. 03 混入式继承/原型继承/经典继承、拓展内置对象、原型链、创建函数的方式、arguments、eval、静态成员、实例成员、instanceof/是否在同一个原型链
继承:当前对象没有的属性和方法,别人有,拿来给自己用,就是继承 1 混入式继承 var I={ }; var obj = { name: 'jack', age:18, sayGoodbye : fu ...
- phpstudy apache启动失败,80端口占用问题解决方案
安装phpstydy,启动apache时,启动失败,提示80端口占用,需要将占用80端口的服务进程关闭 1.运行cmd, netstat -ano 找到80端口对应的pid 4 2.一般都是调用 h ...
- 使用Jcrop-canvas画布-制作前端图像裁剪
写在前面 –公司有这个需求,安排调查 –目前各大网站都是采用的-前端做裁剪返回坐标-由后端来做到裁剪 –而使用html-canvas画布可以直接前端裁剪并返回base64流-ajax可以直接下载保存 ...
- ruby net/http模块使用
ruby中的NET::HTTP:这里暂时先列出几个固定用法: 其中一,二不支持请求头设置(header取ruby默认值),只能用于基本的请求,不支持持久连接,如果您执行许多HTTP请求,则不推荐它们: ...