前言:本博客系列为学习后盾人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的更多相关文章

  1. JS实现数组去重方法大总结

    js数组根据对象中的元素去重: var arr2 = [ { name: "name1", num: "1" }, { name: "name2&qu ...

  2. JavaScript -- 时光流逝(二):js中数组的方法

    JavaScript -- 知识点回顾篇(二):js中数组的方法 1. 数组 (1)定义数组,数组赋值 <script type="text/javascript"> ...

  3. js中数组去重方法及性能对比

    js中数组的 数组去重 常用的数组去重方法以及效率分析: 首先我们先构建一个数组,主要是用于进行去重实验,我们主要实验的量级为1000,10000,100000,500000.具体的生成数组的方法如下 ...

  4. es6 filter() 数组过滤方法总结

    1.创建一个数组,判断数组中是否存在某个值 var newarr = [ { num: , val: 'ceshi', flag: 'aa' }, { num: , val: 'ceshi2', fl ...

  5. es6 filter() 数组过滤方法总结(转载)

    1.创建一个数组,判断数组中是否存在某个值 var newarr = [ { num: 1, val: 'ceshi', flag: 'aa' }, { num: 2, val: 'ceshi2', ...

  6. JS实现数组去重方法整理

    前言 我们先来看下面的例子,当然来源与网络,地址<删除数组中多个不连续的数组元素的正确姿势> 我们现在将数组中所有的‘ a’ 元素删除: var arr = ['a', 'a', 'b', ...

  7. JS实现数组去重方法总结(六种方法)

    方法一: 双层循环,外层循环元素,内层循环时比较值 如果有相同的值则跳过,不相同则push进数组 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 Array. ...

  8. Jsの练习-数组其他常用方法 -map() ,filter() ,every() ,some()

    map() :映射,对数组中的每一项运行给定函数,返回每次函数调用结果组成的函数. <!DOCTYPE html> <html lang="en"> < ...

  9. JS中数组的方法

    1. join() Array.join() 是 String.split() 的逆向操作 var arr = [1, 2, 3] arr.join()// "1,2,3" arr ...

随机推荐

  1. 【APIO2020】交换城市(Kruskal重构树)

    Description 给定一个 \(n\) 个点,\(m\) 条边的无向连通图,边带权. \(q\) 次询问,每次询问两个点 \(x, y\),求两点间的次小瓶颈路.不存在输出 -1. Hint \ ...

  2. 新挖个坑,准备学习一下databricks的spark博客

    挖坑 https://databricks.com/blog 一.spark3.0特性(Introducing Apache Spark 3.0) 1.通过通过自适应查询执行,动态分区修剪和其他优化使 ...

  3. Javascript的解码/编码api

    1.fromCharCode() 接受一个指定的 Unicode 值,然后返回一个字符串. 语法:String.fromCharCode(numX,numX,...,numX) 详细了解:http:/ ...

  4. Linux下MySQL数据库的备份与恢复

    Linux下MySQL数据库的备份与恢复 作者:Grey 原文地址: Github 语雀 博客园 基于版本 MySQL5.7 Deepin Linux 15.11 xtrabackup-2.4.18 ...

  5. Vue-router hash模式微信登录授权验证,#号处理

    微信授权登录验证会把网址中的#号去掉,这样在跳转的时候Vue拿不到Code.所以做了以下处理 let href = window.location.href; if (href.includes(&q ...

  6. Spring MVC或Spring Boot配置默认访问页面不生效?

    相信在开发项目过程中,设置默认访问页面应该都用过.但是有时候设置了却不起作用.你知道是什么原因吗?今天就来说说我遇到的问题. 首先说说配置默认访问页面有哪几种方式. 1.tomcat配置默认访问页面 ...

  7. Linux相关-回顾-文件和目录(98.1.1)

    @ 目录 1.linux下的文件系统 2.用户目录 3.Linux 主要目录速查表 关于作者 1.linux下的文件系统 在 Linux 下,我们是看不到这些驱动器盘符,我们看到的是文件夹(目录): ...

  8. 从源码角度学习Java动态代理

    前言 最近,看了一下关于RMI(Remote Method Invocation)相关的知识,遇到了一个动态代理的问题,然后就决定探究一下动态代理. 这里先科普一下RMI. RMI 像我们平时写的程序 ...

  9. 图数据库 Nebula Graph 在 Boss 直聘的应用

    本文首发于 Nebula Graph 官方博客:https://nebula-graph.com.cn/posts/nebula-graph-risk-control-boss-zhipin/ 摘要: ...

  10. 精尽Spring MVC源码分析 - ViewResolver 组件

    该系列文档是本人在学习 Spring MVC 的源码过程中总结下来的,可能对读者不太友好,请结合我的源码注释 Spring MVC 源码分析 GitHub 地址 进行阅读 Spring 版本:5.2. ...