—————数组循环之终极宝典

2023-10-27

一、数组循环的方法:for,forEach,map,for of,filter,every,find。

1.for循环,最基础的循环方式,速度较快,效率较高,而且可以控制数组的任意一项元素

const arr = [1, 2, 3, 4, 5];

        for (let i = 0; i < arr.length; i++) {
            console.log(arr[i]);
        }
打印: 1,2,3,4,5

2.forEach有三个参数(value:数组每一项的值,index:索引,arr:数组本体)

特点:不能同时遍历多个集合,在遍历时不能修改和删除集合的数据,且不能用break和return跳出循环,对于空数组不会执行回调函数,forEach修改数组,只能修改引用数据类型,不能直接修改基本数据类型。可以理解为forEach没有返回值,或者说是undefined

对于基本数据类型:number,string,Boolean,null,undefined它们在栈内存中直接存储变量与值。而Object对象的真正的数据是保存在堆内存,栈内只保存了对象的变量以及对应的堆的地址,所以操作Object其实就是直接操作了原数组对象本身。

使用arr[index]什么数据类型都能修改。

const arr = [1,2,3,4,5,6]
            let arr1 = arr.forEach((i, t) => {
                arr[t] = i+5
                // console.log(i, '13')
            })
            console.log(arr, 'arr')
            console.log(arr1, 'arr1')
arr : [6,7,8,9,10]
arr1 : undefined

3.map同样有三个参数,与forEach一样(value:数组每一项的值,index:索引,arr:数组本体)

特点:map会迭代数组重的每一个元素,并且根据回调函数对每一个元素进行处理,最后返回一个新数组,使用map不会改变原数组

   const arr = [1,2,3,4,5,6]
            let arr1 = arr.map((i, t) => {
                return i + 5
                console.log(i)
            })
            console.log(arr)
            console.log(arr1)
        }
arr:[1,2,3,4,5,6]
arr1:[6,7,8,9,10,11]

!!插入一下:迭代器

迭代就是指可以从一个数据集中按照一定的顺序,不断取出数据的过程。

那么迭代和遍历的区别

  • 迭代强调依次取数据的过程,不保证把所有的数据都取完
  • 遍历强调的是要把所有的数据依次全部取出

4.for of可以用来遍历字符串,遍历类数组对象,支持 Map 和 Set 对象遍历,它解决了forEach的所有缺点,可以支持break,return,continue

       let arr = [{
            card: 1
        }, {
            card: 2
        }];

        for (let value of arr) {
            console.log(value);
        }
value:{card:1} , {card:2}

       let arr = [{
            card: 1
        }, {
            card: 2
        }];

        for (let {
            card
                }
        of arr) {
            console.log(card);
        }
card:1 ,2 



   let person={name:"老王",age:23,city:"唐山"}
   for (let item of person){
        console.log(item)
    }
   person is not a iterable
    
   let arr=["dog","cat","monkey","lion"];
    for (let item of arr){
        console.log(item)
    }
item: dog,cat,monkey,lion

5.filter同样有三个参数(value:数组每一项的值,index:索引,arr:数组本体)

特点:filter是对数组里的数据进行过滤,设置一定的条件以后,过滤掉不符合条件的数据,它不会对空数组进行检测、不会改变原始数组。!非常好用

let arr=["dog","cat","monkey","lion"];
    let arr1 = arr.filter((i,t) => {
        console.log(i,t)
        return i !== "dog"
    })
arr1 = ["cat","monkey","lion"]

6.every同样有三个参数(value:数组每一项的值,index:索引,arr:数组本体)

特点:every方法针对的是数组里的所有元素,返回一个布尔值,判断数组里面的所有元素是否都满足条件,如果不满足,则返回false,如果都满足,返回true,不能改变原数组,只能做判断。\

   let arr = [1,2,3,4,5,6,7]
        let bool = arr.every((i,t,list) => {
            console.log(i,t,list)
            return i<3
        })
bool = false

7.some同样有三个参数(value:数组每一项的值,index:索引,arr:数组本体)

特点:some和every类似,用法相同,返回值相同,只是判断条件不同。some使用时只要数组中有一个元素符合条件就返回true,所有元素都不满足条件,才返回false。

        let arr = [1,2,3,4,5,6,7]
        let bool = arr.some((i,t,list) => {
            console.log(i,t,list)
            return i<3
        })
        console.log(bool)
        bool = true

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

—————数组循环之终极宝典 的相关文章

随机推荐

  • Git Rebase与Merge

    在 Git 中整合来自不同分支的修改主要有两种方法 merge 以及 rebase 两种观点 有一种观点认为 仓库的提交历史即是记录实际发生过什么 它是针对历史的文档 本身就有价值 不能乱改 从这个角度看来 改变提交历史是一种亵渎 你使用
  • [Android]系统启动时序

    最近公司的群里面有大佬分享了一张自己总结的系统启动时序 觉得画的非常清晰简练 因此在这里分享一下
  • I - Intense Bit Wheel (二进制,bitset)

    SDUT 2022 Summer Individual Contest 2 for 21 Virtual Judge There is a new intense giant wheel in UNAL town in UNAL town
  • uniapp整包apk更新下载后安装完删除下载的apk,避免占用app内存

    一 内存大 app版本更新后内存变的好大 更新多几次版本更大 小编便发现是每次更新后都把下载下来的apk大小增加到app里面去了 那么我们如何版本更新完之后删除下载下来的apk文件呢 避免占用内存 二 解决方案 使用html5 功能IO模块
  • NLP预训练模型-GPT-3

    NLP预训练模型 系列文章 1 BERT 2 GPT 3 GPT 2 4 GPT 3 目录 NLP预训练模型系列文章 文章目录 前言 1 Abstract 2 Introduction 3 Approach 3 1 模型和架构 3 2 训练
  • oracle11g 导出表报EXP-00011:table不存在。

    转自 https blog csdn net mingzaiwang article details 52608991 depth 1 utm source distribute pc relevant none task utm sour
  • 8种提升程序猿编程能力的方法+编程思维四个核心:分解、抽象、模式识别和算法

    8种提升程序猿编程能力的方法 对于程序员来说 提高自己的编程能力 算是给自己定的职业发展目标之一 不过定一个成为编程大神的目标很容易 具体做起来可能就不是一件简单的事了 首先 既然决定 我要变得更好 得先知道 更好 是什么样子的 另外 不能
  • C++ 单链表节点交换

    这里提供两种方法 一种是只交换对应的数据 另一种是通过更改指针来交换节点 而更改指针中又可以分为新建节点与不新建节点的方法 1 不更改指针 这个没啥好说的 直接将对应的data交换即可 这里的a c节点都为被交换节点的上一个节点 因为不更改
  • el-form之表单校验自动定位到报错位置

    1 背景 表单校验大多数的表单都会用到 一般情况下只是提示当前哪些项校验不通过 但是如果表单比较需要用户自己去找是哪项校验不通过 这样的用户体验不太好 如果能自动定位到当前校验不通过的表单项体验会更好一些 这里是以elementui 的 e
  • 主线剧情-番外02-设备树详解

    设备树详解 本文 续接 主线剧情03 NXP i MX 系列 u boot 移植基础详解 一文中移植过程小节中有关设备树的内容 编辑整理 By Staok 如有错误恭谢指出 侵删 CC BY NC SA 4 0 注意 本文适合学习设备树的一
  • Spring参数校验和全局异常处理

    目录 一 前言 二 Validation 1 JSR 303 2 Spring Validation 3 Validated和 Valid的区别 三 全局异常处理 1 为何要处理异常 2 RestControllerAdvice 3 返回自
  • Vue项目启动报错:error:cannot find module xxx

    原因 无法找到项目依赖的某个模块 解决办法 1 删掉存放模块的文件夹node module 2 执行清除缓存命令 npm cache clean 如果报错 使用强制清除npm cache clean force 如果还报错 删除packag
  • Unity滑入Button/按键/UI范围检测

    效果展示 鼠标滑入按键的点击范围后 对应的游戏背景会发生改变 将下面的脚本挂在需要检测的UI上即可 记得引用必要的操作 using System Collections using System Collections Generic us
  • 接口测试初认知

    接口测试初认知 一 概念 根据分层自动化测试中的定义 最底层由开发人员编写的单元测试保证代码质量 最上层由功能测试人员手工 UI自动化进行大量的自动化功能测试保证功能的可用 则中间层的接口测试是什么作用呢 接下里我们就学习接口测试 那说到接
  • matplotlib如何降低x轴密度-时间显示问题

    python中轴数据的 稀释 在python中很多时候都会遇到x轴数据过多而显示出问题的问题 因此这篇文章针对于时间显示问题来做出解答 可以到到原始数据是 可以先简单绘制数据图 代码如下 绘制结果图如下 结果无法显示出日期 因此需要导入ti
  • C++压缩解压开源库ZIP

    1 ZIP下载 ZIP 主要是用于简单的压缩和解压 引入比较方便 而且极其易使用 方便用户操作 下载地址 http www codeproject com Articles 7530 Zip Utils clean elegant simp
  • 软连接文件的创建删除

    demo 通过系统命令 实现一个对视频文件可以操作的软连接路径 在Nginx中的HTML页面可直接访问视频文件 目录的创建 文件的链接 文件的删除 include
  • DA14585-我手上的开发板(串口2)

    名字 DA14585 Development Kit Pro DA14585 Development Kit Pro Dialog视频 DA14585 Development Kit Pro Dialog 文件结构参考 DA14585 SD
  • 百度OCR文字识别及使用案例

    百度OCR文字识别使用案例 案例环境 Windows10 Jdk1 8 IDEA2019 3 5旗舰版 一 账号注册及创建应用 1 访问地址 https ai baidu com tech ocr general track cp aipi
  • —————数组循环之终极宝典

    一 数组循环的方法 for forEach map for of filter every find 1 for循环 最基础的循环方式 速度较快 效率较高 而且可以控制数组的任意一项元素 const arr 1 2 3 4 5 for le