当前位置: 首页 > news >正文

使用JS遍历JSON数组

在JavaScript中,遍历JSON对象或数组是一个常见的操作,尤其是在处理复杂数据结构时。这里有几种不同的方法可以根据你的需求进行遍历。

1. 遍历JSON对象
如果你有一个JSON对象(实际上在JavaScript中,所有的对象都可以视为JSON对象,因为JSON是一种数据格式,而JavaScript对象是其实现),你可以使用for...in循环或者Object.keys()方法。

使用for...in循环
const jsonObj = {
    name: "John",
    age: 30,
    city: "New York"
};
 
for (const key in jsonObj) {
    if (jsonObj.hasOwnProperty(key)) {
        console.log(`${key}: ${jsonObj[key]}`);
    }
}
使用Object.keys()方法
const jsonObj = {
    name: "John",
    age: 30,
    city: "New York"
};
 
Object.keys(jsonObj).forEach(key => {
    console.log(`${key}: ${jsonObj[key]}`);
});
2. 遍历JSON数组
如果你有一个JSON数组(实际上在JavaScript中,数组就是数组),你可以使用简单的for循环、forEach方法或者for...of循环。

使用for循环
const jsonArray = [
    { name: "John", age: 30 },
    { name: "Jane", age: 25 },
    { name: "Doe", age: 22 }
];
 
for (let i = 0; i < jsonArray.length; i++) {
    console.log(`Name: ${jsonArray[i].name}, Age: ${jsonArray[i].age}`);
}
使用forEach方法
const jsonArray = [
    { name: "John", age: 30 },
    { name: "Jane", age: 25 },
    { name: "Doe", age: 22 }
];
 
jsonArray.forEach(item => {
    console.log(`Name: ${item.name}, Age: ${item.age}`);
});
使用for...of循环(ES6+)
const jsonArray = [
    { name: "John", age: 30 },
    { name: "Jane", age: 25 },
    { name: "Doe", age: 22 }
];
 
for (const item of jsonArray) {
    console.log(`Name: ${item.name}, Age: ${item.age}`);
}
注意事项:
当使用for...in循环遍历对象时,最好检查hasOwnProperty来避免继承的属性。例如,某些对象可能通过原型链继承了额外的属性。

在处理大型数据结构时,考虑性能和内存使用,特别是在浏览器环境中。对于大型数组或对象,使用forEach或for...of可能更合适,因为它们通常更简洁且易于理解。对于更复杂的数据结构或需要更细粒度控制的情况,可以考虑使用递归或专门的库(如Lodash)来处理。例如,Lodash提供了如_.forEachDeep等方法来深度遍历嵌套对象和数组。

这些方法应该能满足你在JavaScript中遍历JSON对象或数组的基本需求。

相关文章:

使用JS遍历JSON数组

在JavaScript中&#xff0c;遍历JSON对象或数组是一个常见的操作&#xff0c;尤其是在处理复杂数据结构时。这里有几种不同的方法可以根据你的需求进行遍历。 1. 遍历JSON对象 如果你有一个JSON对象&#xff08;实际上在JavaScript中&#xff0c;所有的对象都可以视为JSON对象…...

Go基于协程池的延迟任务调度器

原理 通过用一个goroutine以及堆来存储要待调度的延迟任务&#xff0c;当达到调度时间后&#xff0c;将其添加到协程池中去执行。 主要是使用了chan、Mutex、atomic及ants协程池来实现。 用途 主要是用于高并发及大量定时任务要处理的情况&#xff0c;如果使用Go协程来实现每…...

k8S通过代理将集群外的中间件引入集群内访问 —— 筑梦之路

背景说明 有部分中间件是跑在Kubernetes集群之外&#xff0c;我们希望通过service的方式来访问集群外的中间件&#xff0c;比如访问我们k8s集群外的elasticsearch集群。 ES节点本身又处在一个负载均衡IP&#xff1a;192.168.100.100 之后&#xff0c;但是代理的端口号是9202&am…...

Linux 第三次脚本作业

源码编译安装httpd 2.4&#xff0c;提供系统服务管理脚本并测试&#xff08;建议两种方法实现&#xff09; 一、第一种方法 1、把 httpd-2.4.63.tar.gz 这个安装包上传到你的试验机上 2、 安装编译工具 (俺之前已经装好了&#xff09; 3、解压httpd包 4、解压后的httpd包的文…...

使用通义万相Wan2.1进行视频生成

使用通义万相Wan2.1进行视频生成 源代码准备运行环境准备创建Python虚拟环境并激活安装依赖包 模型下载生成视频官网的视频生成例子简单描述场景视频生成示例详细描述场景视频生成示例 最近通义万相开源了其视频生成模型。模型有两个版本&#xff0c;一个是1.3B的&#xff0c;一…...

AI技术为旅行社打开新流量入口

2月28日消息&#xff0c;在“2025旅业发展高峰论坛”上&#xff0c;马蜂窝交易中心总经理绳志成在主题演讲中系统性阐述了AI技术对自由行市场的颠覆性影响。 绳志成介绍&#xff0c;传统“大而全”的跟团游产品吸引力持续走低&#xff0c;用户更愿意为“小众秘境”、“在地文化…...

SuperMap iClient3D for WebGL 影像数据可视范围控制

在共享同一影像底图的服务场景中&#xff0c;如何基于用户权限体系实现差异化的数据可视范围控制&#xff1f;SuperMap iClient3D for WebGL提供了自定义区域影像裁剪的方法。让我们一起看看吧&#xff01; 一、数据制作 对于上述视频中的地图制作&#xff0c;此处不做讲述&am…...

API网关相关知识点

目录 API网关基础知识总结 | JavaGuide Spring Cloud Gateway常见问题总结 | JavaGuide API网关 | 小傅哥 bugstack 虫洞栈 美团: 百亿规模API网关服务Shepherd的设计与实现 vivo: 微服务 API 网关架构实践 唯品会: 高吞吐消息网关的探索与思考 API网关基础知识总结 | J…...

Opencv 图像形态学操作

3.1 形态学-腐蚀操作 img cv2.imread(CSDN.png) cv2.imshow(CSDN, img) cv2.waitKey(0) cv2.destroyAllWindows如果腐蚀核的覆盖区域内的所有像素值都满足条件&#xff08;阈值&#xff09;&#xff0c;则中心像素的值保持不变&#xff1b;如果有任何像素值不满足条件&#x…...

Readability.js 与 Newspaper提取网页内容和元数据

在当今信息爆炸的时代&#xff0c;网页内容的提取和处理变得尤为重要。无论是从新闻网站、博客还是教程网站中提取内容&#xff0c;都需要一个高效、准确的工具来帮助我们去除无关信息&#xff0c;提取出有价值的正文内容。这不仅能够提高我们的工作效率&#xff0c;还能让我们…...

小程序Three Dof识别 实现景区AR体验

代码工程 GitCode - 全球开发者的开源社区,开源代码托管平台 dof...

腾讯2025年软件测试面试题

以下是基于腾讯等一线互联网公司软件测试岗位的面试趋势和技术要求,025年出现的软件测试面试题。这些问题涵盖了基础知识、自动化测试、性能测试、安全测试、编程能力等多个方面,供参考和准备。 一、基础知识 软件测试的基本概念...

SSL域名证书怎么续期?

在当今数字化时代&#xff0c;网站的安全性已成为企业和个人不可忽视的重要因素。SSL域名证书作为保障网站数据传输安全的关键工具&#xff0c;其重要性不言而喻。然而&#xff0c;SSL证书并非永久有效&#xff0c;它们通常有一个固定的有效期&#xff0c;到期后需要进行续期以…...

Grok3使用体验与模型版本对比分析

文章目录 Grok的功能DeepSearch思考功能绘画功能Grok 3的独特功能 Grok 3的版本和特点与其他AI模型的比较 最新新闻&#xff1a;Grok3被誉为“地球上最聪明的AI” 最近&#xff0c;xAI公司正式发布了Grok3&#xff0c;并宣称其在多项基准测试中展现了惊艳的表现。据官方消息&am…...

《算法宝典:全类型题目索引》

目录 &#x1f334;递归、搜索与回溯 一、递归 二、二叉树中的深搜 三、穷举vs暴搜vs深搜vs回溯vs剪枝 四、综合练习 五、FloodFill 算法 六、记忆化搜索 &#x1f335;优选算法 一、双指针 二、滑动窗口 三、二分查找 四、前缀和 五、位运算 六、模拟 七、分治 …...

Windows 11 部署 GPUStack 运行 DeepSeek

1. 介绍 DeepSeek 是一个强大的深度学习框架&#xff0c;适用于图像识别、自然语言处理等任务。GPUStack 是一个高效的 GPU 资源管理工具&#xff0c;能够帮助用户更好地利用 GPU 资源进行深度学习任务。本文将详细介绍如何在 Windows 11 系统上部署 GPUStack 并运行 DeepSeek…...

LangChain教程 - RAG - PDF问答

系列文章索引 LangChain教程 - 系列文章 在现代自然语言处理&#xff08;NLP&#xff09;中&#xff0c;基于文档内容的问答系统变得愈发重要&#xff0c;尤其是当我们需要从大量文档中提取信息时。通过结合文档检索和生成模型&#xff08;如RAG&#xff0c;Retrieval-Augment…...

Windows 图形显示驱动开发-WDDM 3.2-自动显示切换(十二)

API 更改 ADS 功能增加了以下公共 API 功能&#xff1a; 枚举系统中的多路复用器设备。查询有关多路复用器的信息&#xff0c;例如&#xff0c;它连接了哪些目标&#xff0c;以及当前切换到哪个目标。触发多路复用器切换。如何检测多路复用器是否已切换。 枚举系统中的多路复…...

《当齐天大圣踏入3A游戏世界:黑神话·悟空的破壁传奇》:此文为AI自动生成

国产 3A 游戏的破晓之光 2024 年 8 月 20 日,这一天注定被铭记在中国游戏发展的史册上。国产首款 3A 游戏《黑神话・悟空》震撼上线,犹如一颗重磅炸弹,在全球游戏市场掀起了惊涛骇浪。仅仅上线 3 小时,其同时在线人数便突破了 140 万,一举打破 Steam 纯单机游戏最高在线纪…...

Graphics View画一个可调速的风机(pyqt)

效果如图&#xff1a; 风机具备调节转速的功能&#xff0c;转速通过扇叶旋转的快慢来区别&#xff0c;共分为四档&#xff0c;其中零档为静止状态&#xff0c;而一、二、三档则依次增加转速。在代码中&#xff0c;BlowerWrapper 类包含了可旋转的扇叶、风机外框以及选项三个主要…...

装饰模式(Decorator Pattern)重构java邮件发奖系统实战

前言 现在我们有个如下的需求&#xff0c;设计一个邮件发奖的小系统&#xff0c; 需求 1.数据验证 → 2. 敏感信息加密 → 3. 日志记录 → 4. 实际发送邮件 装饰器模式&#xff08;Decorator Pattern&#xff09;允许向一个现有的对象添加新的功能&#xff0c;同时又不改变其…...

基于距离变化能量开销动态调整的WSN低功耗拓扑控制开销算法matlab仿真

目录 1.程序功能描述 2.测试软件版本以及运行结果展示 3.核心程序 4.算法仿真参数 5.算法理论概述 6.参考文献 7.完整程序 1.程序功能描述 通过动态调整节点通信的能量开销&#xff0c;平衡网络负载&#xff0c;延长WSN生命周期。具体通过建立基于距离的能量消耗模型&am…...

从WWDC看苹果产品发展的规律

WWDC 是苹果公司一年一度面向全球开发者的盛会&#xff0c;其主题演讲展现了苹果在产品设计、技术路线、用户体验和生态系统构建上的核心理念与演进脉络。我们借助 ChatGPT Deep Research 工具&#xff0c;对过去十年 WWDC 主题演讲内容进行了系统化分析&#xff0c;形成了这份…...

三维GIS开发cesium智慧地铁教程(5)Cesium相机控制

一、环境搭建 <script src"../cesium1.99/Build/Cesium/Cesium.js"></script> <link rel"stylesheet" href"../cesium1.99/Build/Cesium/Widgets/widgets.css"> 关键配置点&#xff1a; 路径验证&#xff1a;确保相对路径.…...

Linux简单的操作

ls ls 查看当前目录 ll 查看详细内容 ls -a 查看所有的内容 ls --help 查看方法文档 pwd pwd 查看当前路径 cd cd 转路径 cd .. 转上一级路径 cd 名 转换路径 …...

cf2117E

原题链接&#xff1a;https://codeforces.com/contest/2117/problem/E 题目背景&#xff1a; 给定两个数组a,b&#xff0c;可以执行多次以下操作&#xff1a;选择 i (1 < i < n - 1)&#xff0c;并设置 或&#xff0c;也可以在执行上述操作前执行一次删除任意 和 。求…...

ElasticSearch搜索引擎之倒排索引及其底层算法

文章目录 一、搜索引擎1、什么是搜索引擎?2、搜索引擎的分类3、常用的搜索引擎4、搜索引擎的特点二、倒排索引1、简介2、为什么倒排索引不用B+树1.创建时间长,文件大。2.其次,树深,IO次数可怕。3.索引可能会失效。4.精准度差。三. 倒排索引四、算法1、Term Index的算法2、 …...

【C语言练习】080. 使用C语言实现简单的数据库操作

080. 使用C语言实现简单的数据库操作 080. 使用C语言实现简单的数据库操作使用原生APIODBC接口第三方库ORM框架文件模拟1. 安装SQLite2. 示例代码:使用SQLite创建数据库、表和插入数据3. 编译和运行4. 示例运行输出:5. 注意事项6. 总结080. 使用C语言实现简单的数据库操作 在…...

代理篇12|深入理解 Vite中的Proxy接口代理配置

在前端开发中,常常会遇到 跨域请求接口 的情况。为了解决这个问题,Vite 和 Webpack 都提供了 proxy 代理功能,用于将本地开发请求转发到后端服务器。 什么是代理(proxy)? 代理是在开发过程中,前端项目通过开发服务器,将指定的请求“转发”到真实的后端服务器,从而绕…...

宇树科技,改名了!

提到国内具身智能和机器人领域的代表企业&#xff0c;那宇树科技&#xff08;Unitree&#xff09;必须名列其榜。 最近&#xff0c;宇树科技的一项新变动消息在业界引发了不少关注和讨论&#xff0c;即&#xff1a; 宇树向其合作伙伴发布了一封公司名称变更函称&#xff0c;因…...