js:对象转换为数组

devtools/2024/11/22 9:06:02/

例子:现在有对象

let data = {

    a: 1,

    b: 2,

    c: 3

}

1、将键值对的键转换为新数组

需要将键转换为数组,即['a','b','c']

获取所有键的数组

使用Object.keys()方法来获取一个包含对象所有键的数组。

javascript">let data = {a:1,b:2,c:3
}
let keysArray = Object.keys(data)
console.log('keysArray',keysArray)

2、将键值对的值转换为新数组

需要将值转换为数组,即[1,2,3]

javascript">let data = { a: 1,b: 2,c: 3
}
let valuesArray = Object.values(data)
console.log(valuesArray)

 3、将键值对的键值换为新数组-一个键值对为一个小数组

一对键值为一个数组,即[['a',1],['b',2],['c',3]]

javascript">let data = { a: 1,b: 2,c: 3
}
let allArray = Object.entries(data)
console.log(allArray)

4、将键值对的键值换为新数组-自定义

拼接成等于的一个字符串作为数组的子项

javascript">let newarray = Object.keys(data).map(item=>{return item + '=' + data[item]
})
console.log(newarray)

 

解析:

Object.keys(data):即为前面提到的取出data对象中的key值并组成一个数组

map:对取出的key的数组,进行一个遍历,用item作为其子项(也就是数组中的每一个key)

返回值:item+'='+data[item]:这里为一个拼接,将keys的数组取出作为子项item为等号左侧,将data[item]<=>对象[key],即取出对象这一项的值,作为等号右侧,也就是key = value


http://www.ppmy.cn/devtools/135972.html

相关文章

[免费]SpringBoot+Vue毕业设计论文管理系统【论文+源码+SQL脚本】

大家好&#xff0c;我是java1234_小锋老师&#xff0c;看到一个不错的SpringBootVue毕业设计论文管理系统&#xff0c;分享下哈。 项目视频演示 【免费】SpringBootVue毕业设计论文管理系统 Java毕业设计_哔哩哔哩_bilibili 项目介绍 现代经济快节奏发展以及不断完善升级的信…

微信小程序点击跳转打电话功能

wx.makePhoneCall 属性类型默认值必填说明phoneNumberstring是需要拨打的电话号码successfunction否接口调用成功的回调函数failfunction否接口调用失败的回调函数completefunction否接口调用结束的回调函数&#xff08;调用成功、失败都会执行&#xff09; <view class&q…

.NET 9 中 LINQ 新增功能实操

LINQ 介绍 语言集成查询 (LINQ) 是一系列直接将查询功能集成到 C# 语言的技术统称。 数据查询历来都表示为简单的字符串&#xff0c;没有编译时类型检查或 IntelliSense 支持。 此外&#xff0c;需要针对每种类型的数据源了解不同的查询语言&#xff1a;SQL 数据库、XML 文档、…

QT中QString类的各种使用

大部分的QString使用可以参考:QT中QString 类的使用--获取指定字符位置、截取子字符串等_qstring 取子串-CSDN博客 补充一种QString类的分离:Qt QString切割(Split()与Mid()函数详解)_qstring split-CSDN博客 1. Trimmed和Simplified函数(去除空白) trimmed&#xff1a;去除了…

vue3封装Element Plus table表格组件

支持绝大部分Element Plus原有设置属性&#xff0c;支持分页&#xff0c;支持动态适配高度 效果展示 组件代码&#xff1a; <template><div class"table-wrap" ref"tableWrap"><el-tableclass"w100 h100":data"tableInfo.…

湖北某高校联合开源网安打造协同育人新范式,推动智能网联汽车行业可持续发展

某高校是由武汉市人民政府主办的高等院校&#xff0c;课程涉足新一代信息技术&#xff08;光芯屏端网&#xff09;、高端装备、人工智能、网络安全等产业板块&#xff0c;构建以软件技术、工业机器人技术为引领的专业群建设格局。近年来&#xff0c;该高校将课程与智能网联汽车…

HTML5拖拽API学习 托拽排序和可托拽课程表

文章目录 前言拖拽API核心概念拖拽式使用流程例子注意事项综合例子&#x1f330; 可拖拽课程表拖拽排序 前言 前端拖拽功能让网页元素可以通过鼠标或触摸操作移动。HTML5 提供了标准的拖拽API&#xff0c;简化了拖放操作的实现。以下是拖拽API的基本使用指南&#xff1a; 拖拽…

STM32串口——5个串口的使用方法

参考文档 STM32串口——5个串口的使用方法_51CTO博客_stm32串口通信的接收与发送 串口是我们常用的一个数据传输接口&#xff0c;STM32F103系列单片机共有5个串口&#xff0c;其中1-3是通用同步/异步串行接口USART(Universal Synchronous/Asynchronous Receiver/Transmitter)…