javascript中find(), filter(), some(), every(), map()等方法介绍

news2024/11/27 22:21:51

1、find()

find() 用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。

find()方法的回调函数可以接受三个参数,依次为当前的值、当前的位置和原数组。

例 a:

我们有一个包含名称 age 和 id 属性的用户对象列表,如下所示:

let users = [{id:1, name: 'John', age: 22 }, {id:2, name: 'Tom',age: 22 }, {id:3, name: 'Balaji', age: 24 }];

查找到第一个年龄为 22 的用户

console.log(users.find(user => user.age === 22));
//console
//{ id: 1, name: 'John', age:22}

例 b:

寻找数组中第一个素数

function isPrime(element, index, array) {
  let start = 2;
  while (start <= Math.sqrt(element)) {
    if (element % start++ < 1) {
      return false;
    }
  }
  return element > 1;
}
console.log([4, 6, 8, 12].find(isPrime)); // undefined,未找到
console.log([4, 5, 8, 12].find(isPrime)); // 5
  1. findIndex()

findIndex()方法与find()方法的用法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。

[1, 2, 5, -1, 9].findIndex((n) => n < 0)
//返回符合条件的值的位置(索引)
// 3
  1. filter()

filter()方法创建一个包含所有通过测试函数的元素的新数组。如果没有元素满足测试函数,则返回一个空数组。

例:

过滤年龄为 22 岁的用户

console.log(users.filter(user => user.age === 22));
//console
//[{ id: 1, name: 'John', age:22},{ id: 2, name: 'Tom', age:22}]
filter()回调函数

var arr = ['A', 'B', 'C'];
var r = arr.filter(function (element, index, self) {
    console.log(element); // 依次打印'A', 'B', 'C'
    console.log(index); // 依次打印0, 1, 2
    console.log(self); // self就是变量arr
    return true;
});
  1. some()

some 为数组中的每一个元素执行一次 callback 函数,直到找到一个使得 callback 返回一个“真值”(即可转换为布尔值 true 的值)。如果找到了这样一个值,some 将会立即返回 true。

例子:检测在数组中是否有大于10的元素。

var a = [11,50,40,3,5,80,90,4]
function some(item,index,array){
    console.log(item);
    return item>10
}
a.some(some);
//11
//true
  1. every()

every()方法测试一个数组内的所有元素是否都能通过指定函数的测试。它返回一个布尔值。

const isBelowThreshold = (currentValue) => currentValue < 40;

const array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// Expected output: true
  1. forEach()

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

例子:

a. 列出数组中的每一项:

注意: forEach() 对于空数组是不会执行回调函数的。

var fruits = ["apple", "orange", "cherry"];
fruits.forEach(myFunction);

function myFunction(item, index) {
  document.getElementById("demo").innerHTML += index + ":" + item + "<br>"; 
}

b. 对于数组中的每个元素:将值更新为原始值的 10 倍:

var numbers = [65, 44, 12, 4];
numbers.forEach(myFunction)

function myFunction(item, index, arr) {
  arr[index] = item * 10;
}

c. forEach() 的 continue 与 break

forEach() 本身是不支持的 continue 与 break 语句的,我们可以通过 some 和 every 来实现。

使用 return 语句实现 continue 关键字的效果:

continue 实现

var arr = [1, 2, 3, 4, 5];
arr.forEach(function (item) {
    if (item === 3) {
        return;
    }
    console.log(item);
});

通过some实现
var arr = [1, 2, 3, 4, 5];

arr.some(function (item) {
        if (item === 2) {
                return;  // 不能为 return false
        }
        console.log(item);
});

在这里插入图片描述

break 实现

var arr = [1, 2, 3, 4, 5];
arr.every(function (item) {
        console.log(item);
        return item !== 3;
});

在这里插入图片描述

  1. map()

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

注意:map() 不会对空数组进行检测。

注意:map() 不会改变原始数组。

const array1 = [1, 4, 9, 16];

// Pass a function to map
const map1 = array1.map(x => x * 2);
console.log(map1);
// Expected output: Array [2, 8, 18, 32]`

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/474719.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

利用Matab进行覆盖计算----战术计算

在 contour函数中添加如下代码 %------- 计算畅通区面积和占比例 --------% Spi*maxrange*maxrange/1e6; S0 nnz(isInRange)*reslons*reslats/1e6;isnn ~isnan(cdata); cdata0 cdata(isnn); S1numel(cdata0)*reslons*reslats/1e6;AS1/S0; % 畅通区所占比例; fprintf("…

CLion开发工具 | 06 - 使用CLion开发STM32(无需Cmake)

专栏介绍 文章目录 专栏介绍一、准备工作1. 工具准备2. 裸机工程准备二、使用CLion打开工程三、基于CLion写代码1. LED blink代码2. printf重定位代码四、编译工程1. 编译配置2. 选择编译目标3. 编译五、烧录1. OpenOCD基础知识(了解)2. 设置CLion路径3. 新建CLion配置文件4.…

面试总结,4年经验

小伙伴你好&#xff0c;我是田哥。 本文内容是一位星球朋友昨天面试遇到的问题&#xff0c;我把核心的问题整理出来了。 1&#xff1a;Java 层面的锁有用过吗&#xff1f;除了分布式锁以外 是的&#xff0c;Java中提供了多种锁机制来保证并发访问数据的安全性和一致性。常见的J…

分析GC日志解读

目录 GC分类 GC日志分类 GC日志结构剖析 透过日志看垃圾收集器 透过日志看GC原因 GC日志分析工具 GC分类 针对HotSpot VM的实现&#xff0c;它里面的GC按照回收区域又分为两大种类型&#xff1a;一种是部分收集&#xff08;Partial GC&#xff09;&#xff0c;一种是整堆…

VPN 虚拟专用网络隧道

1 什么是VPN VPN(全称&#xff1a;Virtual Private Network)虚拟专用网络&#xff0c;是依靠ISP和其他的NSP&#xff0c;在公共网络中建立专用的数据通信的网络技术&#xff0c;可以为企业之间或者个人与企业之间提供安全的数据传输隧道服务。在VPN中任意两点之间的链接并没有…

从零开始学习Linux运维,成为IT领域翘楚(二)

文章目录 &#x1f525;Linux系统目录结构&#x1f525;Linux用户和用户组&#x1f525;Linux用户管理 &#x1f525;Linux系统目录结构 文件系统组织结构 ⭐ /lib 系统开机所需要最基本的动态链接共享库&#xff0c;其作用类似于Windows里的DLL文件。 几乎所有的应用程序都需…

PACS系统源码,大型医院PACS源码集成三维重建

PACS系统为医院提供包括放射、超声、核医学、病理、内窥镜、心电图室在内的所有影像检查数字化的一体化解决方案。 它涵盖了传统PACS和RIS系统的所有功能&#xff0c;以构建全数字化影像科为目标&#xff0c;致力于实现对医院所有影像数据的统一管理、影像检查工作流的自动化&a…

POJ3704 括号匹配问题 递归方法

目录 题目 算法 完整代码 题目 参考 递归: https://blog.csdn.net/qq_45272251/article/details/103257953 利用了递归, 但思路稍复杂了 循环: https://blog.csdn.net/weixin_50340097/article/details/114579805 (看起来是递归其实是循环. 每次递归其实是循环内一次迭…

牛客网Python入门103题练习|【07--循环语句(2)】

⭐NP55 2的次方数 描述 在Python中&#xff0c; * 代表乘法运算&#xff0c; ** 代表次方运算。 请创建一个空列表my_list&#xff0c;使用for循环、range()函数和append()函数令列表my_list包含底数2的 [1, 10] 次方&#xff0c;再使用一个 for 循环将这些次方数都打印出来…

【Linux问题合集001】Linux中如何将用户添加到sudo组中的步骤

看教程的前提我的linux当前用户是zhou&#xff0c;看以下步骤时将zhou看做你的liunx当前用户就行了&#xff1a; 一、 以root用户登录到系统。 在Linux系统中&#xff0c;root用户是具有完全系统管理权限的超级用户。要以root用户身份登录到系统&#xff0c;您可>以使用以下…

继续打脸水货教程:关于可变对象与不可变对象

入门教程、案例源码、学习资料、读者群 请访问&#xff1a; python666.cn 大家好&#xff0c;欢迎来到 Crossin的编程教室 &#xff01; 今天这篇我要继续来打脸互联网上各种以讹传讹的水货教程。 前阵子我们聊了下Python中有关函数参数传递以及变量赋值的一些内容&#xff1a;…

LeetCode0014.最长公共前缀 Go语言AC笔记

时间复杂度&#xff1a;O(n) 解题思路 纵向扫描法。先扫描所有字符串的第一个字符&#xff0c;如果都相同就再次扫描所有字符串的第二个字符&#xff0c;直到某一字符串被扫描完或者出现了不相同的字符&#xff0c;此时就返回该字符串该字符的前缀。 为了确定所有字符是否相同…

【flask】三种路由和各自的比较配置文件所有的字母必须大写if __name__的作用核心对象循环引用的几种解决方式--难

三种路由 方法1&#xff1a;装饰器 python C#, java 都可以用这种方式 from flask import Flask app Flask(__name__)app.route(/hello) def hello():return Hello world!app.run(debugTrue)方法2: 注册路由 php python from flask import Flask app Flask(__name__)//app…

Java IO流第一章

Java IO流第一章 &#xff08;一&#xff09;简介 本文主要是从最基础的BIO式通信开始介绍到NIO , AIO&#xff0c;读者可以清晰的了解到阻塞、同步、异步的现象、概念和特征以及优缺点。 通信技术整体解决的问题 局域网内的通信要求。多系统间的底层消息传递机制。高并发下…

如何自制云平台,并实现远程访问控制?

除了阿里、腾讯各种云&#xff0c;计算机大神们都想自己搭建IoT云平台。今天小编跟大家分享一种用UbuntuEMQXNode-RED方式自制IoT云平台的方法&#xff0c;并实现无公网IP随时访问远程数据&#xff01; 第一步 Step1搭建EMQX服务器 1.搭建IoT平台需要一个服务器&#xff0c;这…

windows安装rocketmq

windows安装rocketmq 问题背景操作步骤Lyric&#xff1a; 请再给我 一个理由 问题背景 最近有使用rocketmq&#xff0c;为测试方便&#xff0c;在本地安装rocketmq 注意事项&#xff1a; 默认已安装java1.8&#xff0c;启动mq必须是1.8版本&#xff0c;我之前使用11版本&…

命令行 控制 易微联 wifi通断器

有个设备需要远程控制开关&#xff0c;最简单的方式就是通过一直在线运行的 Pi&#xff0c;进行命令行控制智能开关。 1、材料准备 找个最便宜的智能开关&#xff0c;话说易微联的做的真是便宜&#xff0c;销售量也很大。 这种 网上叫 Wifi通断器&#xff0c;或者智能开关&a…

使用ALLpairs完成正交表测试法练习题

该实验报告需要完成如下三个正交表测试法练习题 1、为了测试一个游戏软件的安装过程&#xff0c;需要考虑如下因素&#xff1a; (1) 操作系统: win2008、win7、win10、RedHat、Linux (2) 杀毒软件:瑞星、卡巴斯基、诺顿、江民、360 杀毒 (3) 数据库: oracle10g、SQLServer200…

五一劳动节前 特辑 ,路上那些车不能碰 你赔不起系列

相信明天大家4月29日都上了高速&#xff0c;都奔赴自己今年第一个想去的地方&#xff0c;那么上了高速&#xff0c;见的车辆就多了&#xff0c;哪些车辆我们要明白&#xff0c;尽量不要去碰&#xff0c;或者看见进行 技术性躲避&#xff0c;因为碰一下&#xff0c;半套房没了&a…

Pytorch2 如何通过算子融合和 CPU/GPU 代码生成加速深度学习

动动发财的小手&#xff0c;点个赞吧&#xff01; PyTorch 中用于图形捕获、中间表示、运算符融合以及优化的 C 和 GPU 代码生成的深度学习编译器技术入门 计算机编程是神奇的。我们用人类可读的语言编写代码&#xff0c;就像变魔术一样&#xff0c;它通过硅晶体管转化为电流&a…