【JS学习】数组过滤方法的使用filter
前言:本博客系列为学习后盾人js教程过程中的记录与产出,如果对你有帮助,欢迎关注,点赞,分享。不足之处也欢迎指正,作者会积极思考与改正。
使用效果:
可以返回参数函数为真的值
//情景:实现从stu数组里面提取js成绩大于60的项
let stu=[
{name:"张三",js:90},
{name:"李四",js:50},
{name:"王五",js:60},
];//定义数组
let newarr=stu.filter(function(item,index,arr0){//调用filter方法,传入函数,若函数返回值为真,则返回该项
// console.log(index);
return item.js>60;//当每项元素的元素的js成绩大于60时返回真
});
console.table(newarr);

参数说明:
参数名称不重要,重要的是第几个参数
| 参数 | 作用 |
|---|---|
| function | 执行方法,函数返回真的项会被收集 |
| 第一参数item | 指被调用函数stu的遍历中的当前项{name:"张三",js:90} |
| 第二参数index | 指被调用函数stu的遍历中的当前项的索引值0,1,2 |
| 第三参数arr | 指被调用函数stu |
方法原理解析:
//filter的实现原理
let stu=[
{name:"张三",js:90},
{name:"李四",js:50},
{name:"王五",js:60},
];
function filter1(arr,callback){//arr为数组,callback为函数
let newArr=[];
for(const value of arr){//遍历数组
if(callback(value)===true){//将每个值放入回调函数,返回真执行
newArr.push(value);//将值加入数组
}
}
return newArr;//返回结果
}
console.log(filter1(stu,function(value){
return value.js>60;
}));

尾记:
有任何问题,欢迎私聊哟~~~
也可关注公众号“诗与凉风”联系作者哦~~

【JS学习】数组过滤方法的使用filter的更多相关文章
- JS实现数组去重方法大总结
js数组根据对象中的元素去重: var arr2 = [ { name: "name1", num: "1" }, { name: "name2&qu ...
- JavaScript -- 时光流逝(二):js中数组的方法
JavaScript -- 知识点回顾篇(二):js中数组的方法 1. 数组 (1)定义数组,数组赋值 <script type="text/javascript"> ...
- js中数组去重方法及性能对比
js中数组的 数组去重 常用的数组去重方法以及效率分析: 首先我们先构建一个数组,主要是用于进行去重实验,我们主要实验的量级为1000,10000,100000,500000.具体的生成数组的方法如下 ...
- es6 filter() 数组过滤方法总结
1.创建一个数组,判断数组中是否存在某个值 var newarr = [ { num: , val: 'ceshi', flag: 'aa' }, { num: , val: 'ceshi2', fl ...
- es6 filter() 数组过滤方法总结(转载)
1.创建一个数组,判断数组中是否存在某个值 var newarr = [ { num: 1, val: 'ceshi', flag: 'aa' }, { num: 2, val: 'ceshi2', ...
- JS实现数组去重方法整理
前言 我们先来看下面的例子,当然来源与网络,地址<删除数组中多个不连续的数组元素的正确姿势> 我们现在将数组中所有的‘ a’ 元素删除: var arr = ['a', 'a', 'b', ...
- JS实现数组去重方法总结(六种方法)
方法一: 双层循环,外层循环元素,内层循环时比较值 如果有相同的值则跳过,不相同则push进数组 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 Array. ...
- Jsの练习-数组其他常用方法 -map() ,filter() ,every() ,some()
map() :映射,对数组中的每一项运行给定函数,返回每次函数调用结果组成的函数. <!DOCTYPE html> <html lang="en"> < ...
- JS中数组的方法
1. join() Array.join() 是 String.split() 的逆向操作 var arr = [1, 2, 3] arr.join()// "1,2,3" arr ...
随机推荐
- Java集合源码分析(九)——HashSet
简介 HashSet就是一个集合,里面不能有重复的元素,元素也是无序的. HashSet其实就是调用了HashMap实现的,所以,它也不是线程安全的. HashSet通过iterator()返回的迭代 ...
- 协程gevent学习
import gevent def f1(): print(11) gevent.sleep(2) print(33) def f2(): print(22) gevent.sleep(1) prin ...
- JavaScript:记录一些字符串和数组常用的方法
字符串: 字符串的方法:注意:都不会改变原来的字符串,返回值为新的字符串.如果(1,2),一般是包含小标1,不包含下标2 str.charAt(i): 取str的第i+1个字符,类似数组的arr[i] ...
- JavaScript:防抖与节流
①防抖: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <titl ...
- Emlog整站搬家教程
之前使用的服务器空间到期,不想再续费,所以就打算更换服务器,购买新的服务器之后不知道怎么把EM程序转移到新的服务器上面,所以东查查西查查,终于找到了一个既简单又方便的搬家方法,分享给大家.步骤开始:1 ...
- Linux端口被占用解决
有时候关闭软件后,后台进程死掉,导致端口被占用.下面以JBoss端口8083被占用为例,列出详细解决过程. 解决方法: 1.查找被占用的端口 netstat -tln netstat -tln | g ...
- PHP代码审计学习-PHP-Audit-Labs-day2
filter_var()函数 filter_var() 函数通过指定的过滤器过滤一个变量.如果成功,则返回被过滤的数据.如果失败,则返回 FALSE. filter_var(variable, fil ...
- Graphql Tutorials(Episode 02)
1.前言 我们在上篇已经了解Graphql的使命以及Graphql的概况,接下来,我们跑起来另外一个Helloworld来开启继续学习. 2.Helloworld(使用Graphql 原生API) 这 ...
- 微服务开发的最大痛点-分布式事务SEATA入门简介
前言 在微服务开发中,存在诸多的开发痛点,例如分布式事务.全链路跟踪.限流降级和服务平滑上下线等.而在这其中,分布式事务是最让开发者头痛的.那分布式事务是什么呢? 分布式事务就是指事务的参与者.支持事 ...
- 【Idea插件】kotlin的orm框架一键生成代码框架
@font-face { font-family: octicons-link; src: url("data:font/woff;charset=utf-8;base64,d09GRgAB ...