JavaScript对象转数组的三种简单方法

news2024/9/28 17:33:41

21f3d004da371ee5c1f5936cf3d2922b.png

大家好!今天我们要聊的是JavaScript中一个非常实用的技巧——将对象转换为数组。

方法1:使用Object.keys()和Array.map()

首先介绍一种基础但非常实用的方法,就是通过Object.keys()获取对象的键,然后用Array.map()把这些键对应的值提取出来。

const student = { name: '小明', age: 18, city: '北京' };

const arr = Object.keys(student).map(key => student[key]);

console.log(arr);
// 输出: ['小明', 18, '北京']

在这个例子中,Object.keys(student)会返回一个包含对象所有键的数组(['name', 'age', 'city'])。接着,Array.map()会遍历这个数组,每次迭代时,使用当前的键去获取对象中的对应值。最终返回一个包含所有值的数组。

方法2:使用Object.entries()

接下来介绍的是Object.entries()方法,这是在ES6中引入的新方法。它直接返回一个包含对象键值对的数组。

const student = { name: '小明', age: 18, city: '北京' };

const arr = Object.entries(student);

console.log(arr);
// 输出: [['name', '小明'], ['age', 18], ['city', '北京']]

在这个例子中,Object.entries(student)直接返回一个数组,其中每个内部数组表示对象的一个键值对。这个方法的优势在于它能直接获取键值对,对于一些需要处理键值对的场景特别有用。

方法3:使用Object.values()

最后一个方法是使用Object.values(),它和Object.keys()类似,但它只返回对象的值。这种方法特别适合当我们只关心对象的值而不需要键的时候。

const student = { name: '小明', age: 18, city: '北京' };

const arr = Object.values(student);

console.log(arr);
// 输出: ['小明', 18, '北京']

在这个例子中,Object.values(student)直接返回一个包含对象所有值的数组。这个方法的优势在于操作简单,直接获取所有值,不需要关心键。

小结

通过以上三种方法,我们可以轻松地将对象转换为数组。无论是使用Object.keys()和Array.map(),Object.entries(),还是Object.values(),都各有优势,大家可以根据具体需求选择合适的方法。

  • 如果你只需要对象的值,Object.values()是最简洁的方法。

  • 如果你需要对象的键值对,Object.entries()是最佳选择。

  • 如果你需要对键值进行一些处理,Object.keys()加上Array.map()会非常灵活。

掌握这些小技巧,不仅可以提升你的编程效率,还能让代码更简洁易懂。希望这篇文章能帮到你,如果有任何疑问或心得,欢迎在评论区交流讨论!

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

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

相关文章

C++ primer plus 第17 章 输入、输出和文件:文件输入和输出01

C primer plus 第17 章 输入、输出和文件:文件输入和输出01 C primer plus 第17 章 输入、输出和文件:文件输入和输出01 文章目录 C primer plus 第17 章 输入、输出和文件:文件输入和输出0117.4 文件输入和输出17.4.1 简单的文件 1/0程序清…

商家转账到零钱分销返佣申请方案及驳回处理办法

分销返佣场景是商家申请最多的场景,因而申请被驳回也是最多的,根据我们上万次成功开通商家转账到零钱的经验,当商家转账到零钱的分销返佣场景被驳回时,按照以下步骤,商家都可以快速过审: 一、分析驳回原因 …

C Primer Plus 第6章——第一篇

你该逆袭了 第6章:重点摘录 零、本章内容介绍一、while 循环1、程序注释(1)伪代码 2、C 风格读取循环 二、while 语句1、终止 while 循环2、语法要点 三、用 关系运算符 和 表达式 比较大小1、fabs( ) 函数 比较 浮点数(1) fabs( ) 函数 2、什么是 真&am…

世界人口过亿的一级行政区分布

世界国人口已经突破80亿,人口过亿的国家也有14个,分别是中国、俄罗斯、巴西、墨西哥,美国、日本、印度、巴基斯坦、印度尼西亚、尼日利亚、孟加拉国、埃塞俄比亚、菲律宾、埃及。 那么作为国家的一级行政区人口过亿的区域有那些呢?这里就来…

返璞归真:通过简化用例来简化用户界面01

Larry Constantine 著harvey 译 我们常被问及精简那些最简化、抽象和通用窗体用例的重要性。到底有多重要呢?在以用户为 中心的设计中,简化那些重要窗体的用例是获得成功的关键。它能够为开发者设计优秀的用户界面 助一臂之力。通过消除不必要的或技术驱…

书籍推荐-给数字化、PLM制造从业同行推荐的几本书

基础入门和提升的书籍: 1.《制造企业的产品数据管理--原理、概念、策略》,作者:[德]约瑟夫萧塔纳著,祁国宁译 这是一本很基础,但是也非常经典的企业实施PDM管理价值和方法的书籍,大概出版于2001年&#x…

@Component 注解高端玩法【策略模式】

优质博文:IT-BLOG-CN 在Spring框架中,Component注解本身并不支持直接通过注解参数来定义一个key值。不过,你可以通过自定义注解和Qualifier注解来实现类似的功能。 以下是一个示例,展示如何通过自定义注解和Qualifier来实现将不同…

芯片行业ERP相比于传统ERP到底有什么区别

在数字化发展时代,ERP系统已成为企业管理和运营的重要工具。然而,在高度正规化的芯片行业中,传统ERP系统往往难以满足其独特的业务需求。本文将带大家一起来探讨芯片行业ERP与传统ERP之间的主要区别。 1. 专业化与定制化需求 芯片行业ERP系统…

【教资 · 科目二】教育知识与能力

【教资 科目二】教育知识与能力 官网:https://ntce.neea.edu.cn/ ‍ 题型 教育学:1、2、3、7、8(前) 心理学:4、5、6、8(后) ​ ​ 黄色:重点 蓝色:次重点 灰色…

C++商店管理系统

代码中使用了C11的特性 后面有些输出(cout输出的)的提示文本是英文,因为懒得敲中文 源码在最后面 文末投票参与一下谢谢 商品数据保存在 items.txt 用户数据保存在 users.txt 实现功能 1.添加商品(商品ID,商品名,库存数量,价格&a…

卓越运营必备神器:规划复杂项目、使用标准的项目模板,看Minitab Workspace!

可确保过程与产品卓越性的可视化工具 您是否知道Minitab Workspace是专门为Minitab统计软件配套而设计的? 您和您的团队或许会面临以下相关问题: 1) 在规划复杂项目上存在困难,如业务优化项目; 2) 因完成工作需要而使用多种未知品牌的产品; 3) 缺乏…

Python 设计模式之抽象工厂模式

文章目录 从一个例子谈起抽象工厂模式的组件构成根据抽象工厂模式实现抽象工厂模式的缺点 抽象工厂模式属于创建型设计模式,一般用来创建复杂的对象,这种对象由许多小对象组成,这些小对象都属于某个特定的类别。 从一个例子谈起 常见的例子是…

springboot企业人力资源管理系统-计算机毕业设计源码29005

目录 摘要 1 绪论 1.1 选题背景与意义 1.2国内外研究现状 1.3论文结构与章节安排 2系统分析 2.1 可行性分析 2.2 系统流程分析 2.2.1系统开发流程 2.2.2 用户登录流程 2.2.3 系统操作流程 2.2.4 添加信息流程 2.2.5 修改信息流程 2.2.6 删除信息流程 2.3 系统功能…

【Windows 11 】Missing Customize FOlder OPtion 文件夹右键自定义消失

突然发现win11 无法修改文件夹的默认图标原来是因为没有自定义选项了。微软有人问,大神解决了这个问题 右键缺少的是自定义这个标签 自定义长这样子: HKEY_CLASSES_ROOT\Directory\shellex\PropertySheetHandlers 下已经有了 {ef43ecfe-2ab9-4632-bf21…

uniapp 让同一个子组件重新加载

给子组件添加不同的 “key” 值,当 key 值改变时,Vue 会认为这是一个不同的组件,并重新创建它

C语言——贪吃蛇游戏

用c语言在window环境的控制台中模拟写出贪吃蛇小游戏。 一.要实现的基本的功能 如下: 贪吃蛇的地图绘制 贪吃蛇吃食物的功能(方向控制蛇的动作) 贪吃蛇撞墙死亡判断 贪吃蛇撞自己死亡判断 计算得分 贪吃蛇的速度 暂停游戏 二 贪吃蛇的铺垫准…

【HTML入门】第二十二课 - 【实战】做一个注册页面

这一小节,我们继续纯HTML标签的使用,这一节我们做一个 注册页面。说到注册页面,其实大家的网站都大同小异,所以我们就不四处去找设计图了,我们自己想一个注册页面,想想注册页面都应该有哪些元素&#xff0c…

探究全局代理是什么?有什么作用?

今天,我们来聊聊一个经常被提及但很多人不太了解的概念——全局代理。那么,全局代理到底是什么?它有什么用?以及如何正确使用呢?接下来,小编就带大家一探究竟! 什么是全局代理? 通俗…

360联合国内15个最强大模型推出“AI助手”碾压GPT4o!全球首部《人工智能法案》正式生效!|AI日报

文章推荐 GPT-4o版「Her」终于来了!英伟达股价两周内下跌23%!|AI日报 Apple Intelligence将在今年10月推出?AI毛绒玩具BubblePal回答人类幼崽十万个为什么!|AI日报 今日热点 360放大招:联合…

Rodin来袭,AI建模再填猛将

AI建模,AI绘图,Rodin,人工智能,Stable Diffusion, Stable Diffusion,midjourney,Bing AI等人工智能在绘图界掀起腥风血雨,外界一致认为将取代原画师,但是真正的原画师却感觉良好,他们认为:“AI…