JS实现将对象转化为数组的方法分析
本文实例讲述了JS实现将对象转化为数组的方法。分享给大家供大家参考，具体如下：
前言
其实这本来应该是一个很基础的问题了，但我之做一想记录一下是因为之前因为对象转数组的时候卡住了后来弄了出来，但最近再遇到这个问题时竟然又卡主了，所以，关于这个问题，如何把一个对象{'未完成':5, '已完成':8, '待确认':4, '已取消':6}转为[{"未完成":5},{"已完成":8},{"待确认":4},{"已取消":6}]，你已经知道如何操作了，那这篇文章你也就没有必要看了。
对象的两种取值方式
我们都知道，JS中对象有两种取值方式，通过在.后面直接加属性名取值，这也是我们最常使用的一种方式，例如:
let obj = {name: 'wan'};
console.log(obj.name); //wan
这是最普通的一种方式，还有一种方式我们用的不太多，就是使用[]包住属性名取值，类似于数组那样，例如
let obj = {name: 'wan'};
console.log(obj[name]); //wan
那二者之前有什么区别呢，如果对于一个已知的对象来说，几乎是没什么区别的，但是如果我们需要的对象的key是变量呢？这就回到了我们文章开始是提到的问题，如何将一个对象转化为数组
将对象转化为数组
我们文章开始例子中的对象是
let obj = {'未完成':5, '已完成':8, '待确认':4, '已取消':6};
如果目标数组只是为了得到对象的key的集合或者value的集合还是相对容易的
var arr = []
for (let i in obj) {
arr.push(obj[i]); //属性
//arr.push(obj[i]); //值
}
console.log(arr);
如果像我文中开始的需求的话就只需要改变一下push进去的内容为一个对象即可
var arr = []
for (let i in obj) {
let o = {};
o[i] = obj[i];
arr.push(o)
}
console.log(arr);
感兴趣的朋友还可以使用本站在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试上述代码运行结果。
更多关于JavaScript相关内容可查看本站专题：《JavaScript中json操作技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
相关文章
这篇文章主要介绍了微信小程序云开发修改云数据库中的数据方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-05-05
event事件在本文以自定义的方式出现，感兴趣的朋友可以参考下，希望对大家有所帮助2013-09-09
这篇文章主要介绍了JS简单获取客户端IP地址的方法,通过调用搜狐接口来简单实现获取访客IP地址的功能,非常简便实用,需要的朋友可以参考下2016-09-09
这篇文章主要介绍了如何通过JS实现日历简单算法,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-10-10
之前遇到不分页直接获取到全部数据，前端滚动查看数据，页面就挺卡顿的，所以这篇文章来和大家聊聊如何解决这一问题，感兴趣的小伙伴可以了解下2023-07-07
这篇文章主要介绍了JS实现简易换图时钟功能,结合实例形式分析了javascript结合时间函数定时变换显示图片实现时钟功能的相关操作技巧,代码中备有较为详尽的注释便于理解,需要的朋友可以参考下2018-01-01
下载我相信很多小伙伴并不陌生,下载文件的形式也有很多,下面这篇文章主要给大家介绍了关于前端实现批量下载并打包成ZIP文件的步骤及示例,文中通过代码介绍的非常详细,需要的朋友可以参考下2024-07-07
这篇文章主要为大家介绍了利用Angularjs和Bootstrap前端开发案例实战，感兴趣的小伙伴们可以参考一下2016-08-08
TypeScript中interface和type的区别详解
本文主要介绍了TypeScript中interface和type的区别详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-07-07
这篇文章主要介绍了20个实用的JavaScript技巧分享,本文讲解的都是开发中总结出的编码技巧、和最佳实践,需要的朋友可以参考下2014-11-11
最新评论