Java Script基础-数组遍历的6种方式

前言

    现在因为需要写Web前端,也超级喜欢上了JS,数组作为最常用的数据结构,6种常用的数组遍历方式,希望和大家一起来掌握

for in

var babys = ['sun', 'zhu', 'tang']

for (let index in babys) {

    console.log(babys[index]);

}

for in语法用于遍历对象的属性,在JS种,数组也是object,整数下标则为它的属性,所以使用for in也可以遍历的元素

注意:由于for in遍历的是属性,所以数组对象不要再添加非数字的属性,不然也会遍历出来 

for

var babys = ['sun', 'zhu', 'tang']

for (let index = 0; index < babys.length; index++) {

    console.log(babys[index]);

}

数组的下标,即可获取元素,利用for循环,即可遍历数组的每一个元素,只需要将下标累加即可

while

var babys = ['sun', 'zhu', 'tang']

let index = 0;

while (index < babys.length) {

    console.log(babys[index]);

    index++;

}

while循环也是利用下标,与其for类似

forEach()方法

var babys = ['sun', 'zhu', 'tang']

babys.forEach(function (name) {

    console.log(name);

})

forEach()是array对象的方法,它专门用于遍历数组,传入的参数为它回调的函数对象,为函数对象传入的参数为当前元素,以此完成每个元素的访问 

for of

var babys = ['sun', 'zhu', 'tang']

for (item of babys) {

    console.log(item)

}

ES6标准中,新增了for of这种方式,注意它和in的区别,of这里item每次存储是数组的元素,而for in的方式返回的是数组的属性,即整数下标

map()方法

let babys = ['sun', 'zhu', 'tang']

let newArray = babys.map(function (item) {

    return item + "what"

})

console.log(newArray)

map()方法与forEach()方法类似,区别是map()方法会返回一个新创建的数组对象

总结

数组常用的6种遍历方式,你可以根据自己的需求选择适合的方式,为啥提供这么多方式呢?没办法,谁让别的语言也有了呢,滚滚长江东逝水……

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

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

相关文章

如何卸载干净 IDEA(图文讲解)windows和Mac教程

大家好&#xff0c;我是sun~ 很多小伙伴会问 Windows / Mac 系统上要怎么彻底卸载 IDEA 呢&#xff1f; 本文通过图片文字&#xff0c;详细讲解具体步骤&#xff1a; 如何卸载干净 IDEA&#xff08;图文讲解&#xff09; Windows1、卸载 IDEA 程序2、注册表清理3、残留清理 M…

“Notepad++“ 官网地址

notepad官网下载地址&#xff1a;https://notepad-plus-plus.org/downloads/ npp.8.5.8.Installer.x64 本下载地址- https://download.csdn.net/download/namekong8/88494023 1. Fix session file data loss issue. 2. Fix Explorer context menu "Edit with Notepad…

重生奇迹mu下载后仅仅只是挂机吗?

挂挂机、聊聊天&#xff0c;打打怪&#xff0c;如此简单、轻松的游戏或许有&#xff0c;但绝对不是重生奇迹mu&#xff01;因为重生奇迹mu挂机也不是那么容易&#xff0c;即便是多名高端玩家组队挂机&#xff0c;也有可能是全队惨灭&#xff0c;这样的情况时常发生在游戏中。 …

Autosar诊断实战系列26-Dem(DTCEvent)要点及配置开发详解

本文框架 前言1. Dem及其与其他模块交互介绍1.1 与DCM模块交互1.1.1 0x14服务调用时序1.1.2 0x85服务调用时序1.1.3 0x19服务调用时序1.2 与Fim模块交互1.3 与NvM模块交互1.4 与BswM模块交互1.5 与其他BSW及APP模块交互2. Dem配置开发介绍2.1 DemGeneral配置2.1.1 DemGeneral一…

【入门Flink】- 05Flink运行时架构以及一些核心概念

系统架构 Flink运行时架构Standalone会话模式为例 1&#xff09;作业管理器&#xff08;JobManager&#xff09; JobManager 是一个 Flink 集群中任务管理和调度的核心&#xff0c;是控制应用执行的主进程。每个应用都应该被唯一的 JobManager 所控制执行。 JobManger 又包含…

在windows中搭建vue开发环境

1.环境搭建 具体环境搭建步骤参考链接 注意该博客中初始化命令&#xff1a; vue init webpack MyPortalProject需改为小写&#xff1a; vue init webpack myportalproject不然会报错 Warning: name can no longer contain capital letters2.创建第一个vueelement ui项目 …

聚观早报 |盒马参战双11;真我GT5 Pro将压轴登场

【聚观365】11月4日消息 盒马参战双11 真我GT5 Pro将压轴登场 奇瑞汽车10月销量创新高 iQOO 12系列将首发电竞芯片Q1 苹果CEO库克称正改善供需平衡 盒马参战双11 不少消费者反映&#xff0c;今年盒马的双11已悄然开始&#xff1a;10月20日起&#xff0c;盒马APP很多商品页…

【FPGA教程1】Verilog基础语法

Verilog基础语法 1. 常用关键字/保留字模块 module endmodule输入输出信号 input output inout变量 wire reg参数 parameter localparam常数赋值alwaysassign 运算符归约运算符、按位运算符逻辑运算符关系运算符移位运算符位拼接运算符条件运算符优先级 分支控制语句if-elsecas…

pytorh模型训练、测试

目录 1 导入数据集 2 使用tensorboard展示经过各个层的图片数据 3 完整的模型训练测试流程 使用Gpu训练的两种方式 使用tensorboard显示模型 模型训练测试 L1Loss函数 保存未训练模型或者已经训练完的模型 4 加载训练好的模型进行测试 1 导入数据集 import torch from torch.u…

【3D图像分割】基于 Pytorch 的 VNet 3D 图像分割3(3D UNet 模型篇)

在本文中&#xff0c;主要是对3D UNet 进行一个学习和梳理。对于3D UNet 网上的资料和GitHub直接获取的代码很多&#xff0c;不需要自己从0开始。那么本文的目的是啥呢&#xff1f; 本文就是想拆解下其中的结构&#xff0c;看看对于一个3D的UNet&#xff0c;和2D的UNet&#x…

python实现MC协议(SLMP 3E帧)的TCP服务端(篇二)

python实现MC协议&#xff08;SLMP 3E帧&#xff09;的TCP服务端是一件稍微麻烦点的事情。它不像modbusTCP那样&#xff0c;可以使用现成的pymodbus模块去实现。但是&#xff0c;我们可以根据协议帧进行组包&#xff0c;自己去实现帧的格式&#xff0c;而这一切可以基于socket模…

Zephyr-7B-β :类GPT的高速推理LLM

Zephyr 是一系列语言模型&#xff0c;经过训练可以充当有用的助手。 Zephyr-7B-β 是该系列中的第二个模型&#xff0c;是 Mistralai/Mistral-7B-v0.1 的微调版本&#xff0c;使用直接偏好优化 (DPO) 在公开可用的合成数据集上进行训练 。 我们发现&#xff0c;删除这些数据集的…

系列五、映射文件xxxMapper.xml

一、概述 mapper映射文件是mybatis中最重要的部分&#xff0c;涉及到的细节也非常多。 1.1、parameterType 表示输入参数的类型。例如&#xff1a; <select id"getUserById" parameterType"integer" resultType"org.star.entity.model.UserDO&…

python自动化测试模板

1:准备html模版 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 <!DOCTYPE html> <html> <head> <meta charset"utf-8"> <title>接口自动化…

网络协议的基本概念

网络协议的基本概念 随处可见的协议 在计算机网络与信息通信领域里&#xff0c;人们经常提及“协议”一词。互联网中常用的具有代表性的协议有IP、TCP、HTTP等。 “计算机网络体系结构”将这些网络协议进行了系统归纳。TCP/IP就是IP、TCP、HTTP等协议的集合。现在&#xff0…

为什么路由器属于网络层

1. 路由器所属阶段 路由器属于 OSI 模型的网络层&#xff0c;因为它们负责根据网络层信息&#xff08;第 3 层&#xff09;做出路由决策。网络层是 OSI 模型中的第三层&#xff0c;主要负责将数据包从网络中的源路由到目的地。 Here’s a formal and precise explanation of …

DI93a HESG440355R3 通过其Achilles级认证提供网络安全

DI93a HESG440355R3 通过其Achilles级认证提供网络安全 施耐德电气宣布推出Modicon M580以太网PAC (ePAC)自动化控制器&#xff0c;该控制器采用开放式以太网标准&#xff0c;通过其Achilles级认证提供网络安全。M580 ePAC使工厂操作员能够设计、实施和运行一个积极利用开放网…

(免费领源码)java#springboot#mysql网上商城系统的设计与实现08789-计算机毕业设计项目选题推荐

摘 要 随着互联网趋势的到来&#xff0c;各行各业都在考虑利用互联网将自己推广出去&#xff0c;最好方式就是建立自己的互联网系统&#xff0c;并对其进行维护和管理。在现实运用中&#xff0c;应用软件的工作规则和开发步骤&#xff0c;采用Java技术建设网上商城系统。 本设…

GOM引擎搭建时需要注意哪些问题以及需要准备哪些东西

如何选择合适的gom引擎版本 首先&#xff0c;您需要了解自己的需求和预算。市面上的gom引擎版本琳琅满目&#xff0c;价格也各不相同。在选择版本时&#xff0c;建议您根据自己的实际情况进行选择&#xff0c;切勿盲目追求高级版本。同时&#xff0c;建议在购买前先查看该版本…

c#局部类

partial是局部类型的意思。允许我们将一个类、结构或接口分成几个部分&#xff0c;分别实现在几个不同的.cs文件中。C#编译器在编译的时候仍会将各个部分的局部类型合并成一个完整的类 使用事项 关键字partial是一个上下文关键字&#xff0c;只有和 class、struct、interface…