当前位置: 首页 > 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 类包含了可旋转的扇叶、风机外框以及选项三个主要…...

测试微信模版消息推送

进入“开发接口管理”--“公众平台测试账号”&#xff0c;无需申请公众账号、可在测试账号中体验并测试微信公众平台所有高级接口。 获取access_token: 自定义模版消息&#xff1a; 关注测试号&#xff1a;扫二维码关注测试号。 发送模版消息&#xff1a; import requests da…...

线程同步:确保多线程程序的安全与高效!

全文目录&#xff1a; 开篇语前序前言第一部分&#xff1a;线程同步的概念与问题1.1 线程同步的概念1.2 线程同步的问题1.3 线程同步的解决方案 第二部分&#xff1a;synchronized关键字的使用2.1 使用 synchronized修饰方法2.2 使用 synchronized修饰代码块 第三部分&#xff…...

解决Ubuntu22.04 VMware失败的问题 ubuntu入门之二十八

现象1 打开VMware失败 Ubuntu升级之后打开VMware上报需要安装vmmon和vmnet&#xff0c;点击确认后如下提示 最终上报fail 解决方法 内核升级导致&#xff0c;需要在新内核下重新下载编译安装 查看版本 $ vmware -v VMware Workstation 17.5.1 build-23298084$ lsb_release…...

Auto-Coder使用GPT-4o完成:在用TabPFN这个模型构建一个预测未来3天涨跌的分类任务

通过akshare库&#xff0c;获取股票数据&#xff0c;并生成TabPFN这个模型 可以识别、处理的格式&#xff0c;写一个完整的预处理示例&#xff0c;并构建一个预测未来 3 天股价涨跌的分类任务 用TabPFN这个模型构建一个预测未来 3 天股价涨跌的分类任务&#xff0c;进行预测并输…...

高危文件识别的常用算法:原理、应用与企业场景

高危文件识别的常用算法&#xff1a;原理、应用与企业场景 高危文件识别旨在检测可能导致安全威胁的文件&#xff0c;如包含恶意代码、敏感数据或欺诈内容的文档&#xff0c;在企业协同办公环境中&#xff08;如Teams、Google Workspace&#xff09;尤为重要。结合大模型技术&…...

Device Mapper 机制

Device Mapper 机制详解 Device Mapper&#xff08;简称 DM&#xff09;是 Linux 内核中的一套通用块设备映射框架&#xff0c;为 LVM、加密磁盘、RAID 等提供底层支持。本文将详细介绍 Device Mapper 的原理、实现、内核配置、常用工具、操作测试流程&#xff0c;并配以详细的…...

如何在网页里填写 PDF 表格?

有时候&#xff0c;你可能希望用户能在你的网站上填写 PDF 表单。然而&#xff0c;这件事并不简单&#xff0c;因为 PDF 并不是一种原生的网页格式。虽然浏览器可以显示 PDF 文件&#xff0c;但原生并不支持编辑或填写它们。更糟的是&#xff0c;如果你想收集表单数据&#xff…...

在QWebEngineView上实现鼠标、触摸等事件捕获的解决方案

这个问题我看其他博主也写了&#xff0c;要么要会员、要么写的乱七八糟。这里我整理一下&#xff0c;把问题说清楚并且给出代码&#xff0c;拿去用就行&#xff0c;照着葫芦画瓢。 问题 在继承QWebEngineView后&#xff0c;重写mousePressEvent或event函数无法捕获鼠标按下事…...

uniapp 实现腾讯云IM群文件上传下载功能

UniApp 集成腾讯云IM实现群文件上传下载功能全攻略 一、功能背景与技术选型 在团队协作场景中&#xff0c;群文件共享是核心需求之一。本文将介绍如何基于腾讯云IMCOS&#xff0c;在uniapp中实现&#xff1a; 群内文件上传/下载文件元数据管理下载进度追踪跨平台文件预览 二…...

Unity中的transform.up

2025年6月8日&#xff0c;周日下午 在Unity中&#xff0c;transform.up是Transform组件的一个属性&#xff0c;表示游戏对象在世界空间中的“上”方向&#xff08;Y轴正方向&#xff09;&#xff0c;且会随对象旋转动态变化。以下是关键点解析&#xff1a; 基本定义 transfor…...