html遍历数组,JS数组遍历的几种方式

2023-11-20

JS数组遍历,基本就是for,forin,foreach,forof,map等等一些方法,以下介绍几种本文分析用到的数组遍历方式以及进行性能分析对比

第一种:普通for循环

代码如下:

for(j = 0; j < arr.length; j++) {

}

简要说明:

最简单的一种,也是使用频率最高的一种,虽然性能不弱,但仍有优化空间

第二种:优化版for循环

代码如下:

for(j = 0,len=arr.length; j < len; j++) {

}

简要说明:

使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显。

这种方法基本上是所有循环遍历方法中性能最高的一种

第三种:弱化版for循环

代码如下:

for(j = 0; arr[j]!=null; j++) {

}

简要说明:

这种方法其实严格上也属于for循环,只不过是没有使用length判断,而使用变量本身判断

实际上,这种方法的性能要远远小于普通for循环

第四种:foreach循环

代码如下:

arr.forEach(function(item,index){

//index可要可不要

//item可以是对象

//item.name

});

简要说明:

数组自带的foreach循环,使用频率较高,实际上性能比普通for循环弱

第五种:foreach变种

代码如下:

Array.prototype.forEach.call(arr,function(el){

});

简要说明:

由于foreach是Array型自带的,对于一些非这种类型的,无法直接使用(如NodeList),所以才有了这个变种,使用这个变种可以让类似的数组拥有foreach功能。

实际性能要比普通foreach弱

第六种:forin循环

代码如下:

for(j in arr) {

//j表示的是index

}

eb70bc41a1c2

Paste_Image.png

简要说明:

这个循环很多人爱用,但实际上,经分析测试,在众多的循环遍历方式中

它的效率是最低的

第七种:map遍历

代码如下:

arr.map(function(item){

});

eb70bc41a1c2

Paste_Image.png

简要说明:

这种方式也是用的比较广泛的,虽然用起来比较优雅,但实际效率还比不上foreach

第八种:forof遍历(需要ES6支持)

代码如下:

for(let value of arr) {

//打印出来的是值

});

eb70bc41a1c2

Paste_Image.png

简要说明:

这种方式是es6里面用到的,性能要好于forin,但仍然比不上普通for循环

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

html遍历数组,JS数组遍历的几种方式 的相关文章

  • 蓝桥杯 填字母游戏(博弈论)

    小明经常玩 LOL 游戏上瘾 一次他想挑战K大师 不料K大师说 我们先来玩个空格填字母的游戏 要是你不能赢我 就再别玩LOL了 K大师在纸上画了一行n个格子 要小明和他交替往其中填入字母 并且 1 轮到某人填的时候 只能在某个空格中填入L或
  • 寻找3的幂

    目录 题目 题目接口 题目思路 第一点 第二点 第三点 代码实现 普通版本 提交 递归版本 提交 结语 题目 在ledcode刷题网站上 有这样一道题 寻找3的幂 题目接口 bool isPowerOfThree int n 题目思路 第一
  • 【HTML】HTML5的拖放你用了吗

    HTML HTML5的拖放你用了吗 引言 github HTML HTML5的拖放你用了吗 内容速递 看了本文您能了解到的知识 在 HTML5 中 拖放是标准的一部分 任何元素都能够拖放 拖放的操作 多用在拖拽排序列表 游戏拼图等 下文中出
  • 华为OD机试 - 贪吃蛇(Java)

    题目描述 贪吃蛇是一个经典游戏 蛇的身体由若干方格连接而成 身体随蛇头移动 蛇头触碰到食物时 蛇的长度会增加一格 蛇头和身体的任一方格或者游戏版图边界碰撞时 游戏结束 下面让我们来完成贪吃蛇游戏的模拟 给定一个N M的数组arr 代表N M
  • roslaunch error: ERROR: cannot launch node of type

    今天在因为github上有个之前的包更新了 重新git clone后出现了一个问题 ERROR cannot launch node of type crazyflie demo controller py can t locate nod
  • 【FPGA】通俗理解从VGA显示到HDMI显示

    注 大部分参考内容来自 征途Pro FPGA Verilog开发实战指南 基于Altera EP4CE10 2021 7 10 上 贴个下载地址 野火FPGA Altera EP4CE10征途开发板 核心板 野火产品资料下载中心 文档 hd
  • MySQL报错的解决Can‘t connect to local MySQL server through socket ‘/var/lib/mysql/mysql.sock‘

    使用数据库工具连接或还原数据库数据时 提示Can t connect to local MySQL server through socket var lib mysql mysql sock 处理方法 1 修改配置文件 vim etc m
  • 二叉树结构的建立与遍历

    实验项目 1 编写建立二叉树的二叉链表存储结构 左右链表示 的程序 并以适当的形式显示和保存二叉树 2 完成二叉树的7种遍历操作 3 给定一个二叉树 编写算法完成下列应用 1 判断其是否为完全二叉树 2 求二叉树中任意两个结点的公共祖先 输
  • wps日期加减算天数_日期相减之后的天数怎么用公式计算 - 卡饭网

    如何在Excel中得到两个日期相减的天数 如何在Excel中得到两个日期相减的天数 有的小伙伴在使用Excel软件时 想要知道两个日期相减后的天数 但是却不知道使用什么公式 也不知道公式中的数据的含义 那么小编就来为大家介绍一下吧 具体如下
  • Python安装教程(版本3.8.10)windows10

    Python目前已支持市面上的各大主流操作系统 在Linux Unix Mac系统已经自带Python环境 本章将介绍在Windows系统上安装Python 一般下载 executable installer x86 表示是 32 位的机器
  • 基于Python Django 搜索的目标站点内容监测系统设计

    1 简介 基于搜索的目标站点内容监测系统 包括登陆 首页 数据采集 爬虫分析 数据管理 修改密码和用户管理等功能 2 技术栈 说明 技术栈 备注 后台 Python Django 前端 HTML 数据库 MYSql 架构 B S 结构 3
  • MySQL数据库保姆级安装教程

    俗话说从入门到放弃 从入门到入土 开始学习MySQL之前我们一定是要做环境准备的 接下来我们来讲解一下MySQL的安装 一 MySQL下载 MySQL 1 大家可以尝试在官网首页寻找下载入口 也可以使用我提供的MySQL的安装包进行下载安装
  • 数据结构之双向链表,实现双向链表的增删改查

    目录 一 双向链表的定义 1 双向链表节点的定义 2 双向链表的初始化 二 双向链表的函数接口实现 1 双链表的尾插 2 双向链表的尾删 3 双向链表的头插 4 双向链表的头删 6 双向链表在pos前面插入 7 双向链表删除pos位置的节点
  • 1.Twitter开发者之如何申请一个twitter开发者账号

    Twitter开发者之如何申请一个twitter开发者账号 教大家申请一个推特开发者账号满足后面的使用 保证每一步都给大家介绍到 非常详细 希望帮助大家注册好自己的账号 1 先打开Twitter的账号注册界面 选择使用手机号码或电子邮箱注册
  • C51单片机实验——脉冲计数显示(proteus+asm)

    前言 脉冲信号输入进2级74LS14整形 T1接收脉冲信号并计数 显示在LED 外部中断0控制计数器的启动 停止 外部中断1控制计数器的清零复位 P1 0控制LED的段选口使能信号 P1 1控制LED的位选口使能信号 Proteus电路图
  • ios代码大全】代码例子区全区搜索索引

    IOS 类代码 我自己做的翻书效果 小猫咪再次登场 2011 03 02 如何实现QQLive HD界面 附代码 2011 03 02 tabelviewcell 点击设置背景图片 2011 03 02 基于UDP的聊天程序 借鉴iphon
  • OpenGL ES 3.0 Programming Guide 1-3

    一 introduction to OGLES 3 0 OGLES 3 0 Graphics Pipeline VertexBuffer ArrayObj gt VertexShader texture transform feedback
  • C51的1602LCD液晶显示

    C51的1602LCD液晶显示 1 引脚功能介绍 2 基本操作时序 3 1602 液晶的指令介绍 4 实例 1 引脚功能介绍 1602 液晶就是可以显示 2 行 每行 16 个字符的液晶 一共 16 个引脚 每个引脚的功能 我们都可以在它的
  • redis操作 AOF RDB 主从复制 集群

    Redis操作 1 Redis的持久化 Redis提供了2个不同方式的持久化方式 RDB RDB是指在指定的时间间隔将内存中的数据集快照写入磁盘 也就是行话讲的Snapshot快照 它恢复时将快照文件直接读到内存中 备份是如何进行的 Red

随机推荐

  • 算法练习:“回”字形打印矩阵、“之字”形打印矩阵

    转圈输出n n的矩阵 进而输出 M N 的矩阵 12 34 输出为 1243 对于任意一个矩阵 可以找到他的位于正对角线两边界的元素 1234 5678 4329 对于这个矩阵 第一个边界元素是1 第二个边界元素是9 假设 1 的坐标为 r
  • Kibana 配置详解

    Kibana 配置详解 前言 一 Kibana 核心目录结构 二 Kibana 核心配置文件 参考 前言 该博文主要介绍Kibana文件目录结构说明 以及Kibana的配置说明 Kibana的安装使用可以参考我的Kibana分类专栏 本文针
  • android获取当前栈顶的activity

    在Application的onCreate方法中 Override public void onCreate registerActivityLifecycleCallbacks new ActivityLifecycleCallbacks
  • JSP页面出现Invalid location of tag (div)

    意为 不合法的标签标记 原因是我使用标签的方法不对 把table标签删除就可以了
  • C++读取shd二进制文件

    include
  • RocketMQ报No route info of this topic

    最近某天突然收到报警邮件 线上某个应用发送MQ消息报错 完整异常栈如下 2018 04 08 18 17 44 126 DubboServerHandler 10 141 6 116 20968 thread 172 ERROR com x
  • IOS代码实现Hello World

    前面写的iOS笔记一直都是用Xib文件实现的小Demo开发 但是问了好几个现在正从事ios开发的朋友 在实际开发 并不是所有的项目都会用Xib来实现的 因为IOS以前的版本不能正常运行 因为还在学习阶段 也没有在真机上测试 所以没法验证 但
  • Docker-compose部署Hadoop

    Docker部署Hadoop 1 简介 Hadoop简介 Hadoop简介 Apache Hadoop是一个开源的分布式计算平台 可以处理大规模数据集的分布式存储和处理 它是由Apache基金会下的Hadoop项目开发的 采用Java语言编
  • Hadoop 完全分布式运行实战

    Hadoop运行模式包括 本地模式 伪分布式模式以及完全分布式模式 Hadoop官方网站 Apache Hadoop 流程步骤 准备3台客户机 关闭防火墙 静态ip 主机名称 安装JDK 配置环境变量 安装Hadoop 配置环境变量 配置集
  • 入门系列之使用Sysdig监视您的Ubuntu 16.04系统

    欢迎大家前往腾讯云 社区 获取更多腾讯海量技术实践干货哦 本文由乌鸦 发表于云 社区专栏 介绍 Sysdig是一个全面的开源系统活动监控 捕获和分析应用程序 它具有强大的过滤语言和可自定义的输出 以及可以使用称为chisels 的Lua脚本
  • 互补二元组

    时间限制 10000ms 单点时限 1000ms 内存限制 256MB 描述 给定N个整数二元组 X1 Y1 X2 Y2 XN YN 请你计算其中有多少对二元组 Xi Yi 和 Xj Yj 满足Xi Xj Yi Yj且i lt j 输入 第
  • 【试题】排列组合

    在写一个远程的代码 如果本地有M个显示器 远程有N个显示器 M lt N 依据分辨率 显示器刷新频率等要求 需要对远程的N个显示器进行最佳分辨率修改 之后 需要从N个远程显示器中选择M个 跟本地显示器进行一对一的匹配 即从 A N M N
  • 注意:怎么用JMeter操作MySQL数据库?看完秒懂!

    近期用JMeter做接口测试 遇到了一个需要用到数据数据库的场景 一个关于数据报告的页面 需要将数据库里面的数据求和或者取均值之后 展示出来 如果要断言的话 需要连接数据库 通过写sql语句 将sql查询结果与页面的结果进行对比 以MySQ
  • 微信pc端浏览器打开页面空白的问题

    今天写了一个web项目 用chrome浏览器 手机端微信你打开都没问题 但是在pc端微信打开后是空白的 于是我重新做了一个空白的vue项目 用pc端微信浏览器是可以打开的 慢慢调试发现是语法的问题 一步一步减去组件 再一步一步加上组件 最终
  • ubuntu运用软件和更新自动安装NVIDIA显卡驱动

    可能是我电脑硬件问题 直接运用软件和更新安装驱动 老是不能装成功 甚至装的系统都进不了 还要重装系统 这次重装系统后 我试着用软件和更新来自动安装驱动 一 secure boot修改为disable 1 首先进入终端输入 secure bo
  • error: (-209) The operation is neither ‘array op array‘ (where arrays have the same size and type)

    问题展示 error 209 The operation is neither array op array where arrays have the same size and type 错误原因 两个矩阵尺寸大小不一样 解决方法 指定
  • IDEA运行缓慢卡顿,解决idea卡顿,控制台中文乱码 以及其它常用设置

    IDEA运行缓慢卡顿 解决idea卡顿问题以及常用设置 IDEA卡顿原因 优化IDEA配置 重点推荐的方法 手动修改IDEA配置步骤 其他卡顿优化 参考 1 idea启动时会有两个快捷方式 2 卸载不需要用的插件 3 减少内存 4 适当关闭
  • HttpClient 简介说明

    转自 HttpClient 简介说明 下文笔者将讲述HttpClient框架的简介说明 如下所示 HttpCient简介说明 HttpClient是一个开源项目 它是Apache Jakarta Common下的一个子项目 HttpClie
  • Invalid Address specified to RtlValidateHeap

    Invalid Address specified to RtlValidateHeap VC编程 最后推出对话框的时候 会有错误提示声音 硄 但是没有弹出错误提示对话框 症状描述与下面的类似 声音就和Assertion Failure一样
  • html遍历数组,JS数组遍历的几种方式

    JS数组遍历 基本就是for forin foreach forof map等等一些方法 以下介绍几种本文分析用到的数组遍历方式以及进行性能分析对比 第一种 普通for循环 代码如下 for j 0 j lt arr length j 简要