前言

其实这本来应该是一个很基础的问题了,但我之做一想记录一下是因为之前因为对象转数组的时候卡住了后来弄了出来,但最近再遇到这个问题时竟然又卡主了,所以,关于这个问题,如何把一个对象{'未完成':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);

后记

说到底还是思维不够灵活在解决问题时就卡克了,说实话这不是一个什么难题,但是把自己思维限制死了之后就会觉得是个难题,谨记!

JS中将对象转化为数组的更多相关文章

  1. yii2得到的数据对象转化成数组

    yii2得到的数据对象转化成数组需要用到asArray().1.Customer::find(['id' => $id])->asArray()->one();2.$model = ...

  2. js检测对象是否是数组

    js检测对象是否是数组 可以通过instanceof 方法一. var arr=[] arr instanceof Array   //true var obj={} obj instanceof A ...

  3. js中对象转化成字符串、数字或布尔值的转化规则

    js中对象可以转化成 字符串.数字.布尔值 一.对象转化成字符串: 规则: 1.如果对象有toString方法,则调用该方法,并返回相应的结果:(代码通常会执行到这,因为在所有对象中都有toStrin ...

  4. 微信小程序之对象转化为数组

    对象转成数组方式一(数组里面是一个个number类型的元素) let dictObject= { , , , , }; // 对象转成数组方式一 var createArr = [] for (let ...

  5. js 验证对象是否为数组

    一.方法一:用到了原型 由于typeof检测数组,只会显示其为object,并不会详细到告诉我们是否为array,所以我们可以自己写个js用原型来检测: <script> /** * * ...

  6. Yii 将对象转化成数组

    将从数据库查找的对象,转换成数组,并且以设定属性键名称,用到ArrayHelper::toArray $posts = Post::find()->limit(10)->all(); $d ...

  7. 将JSON对象转化为数组对象

    package web.helper; import java.util.ArrayList; import net.sf.json.JSONArray; import web.model.Abstr ...

  8. js判断对象是否为数组

    1.ECMAScript5中有一个现成的方法:Array.isArray(). var obj = {1:[1],2:[2]}, arr = [1], str = "1"; Arr ...

  9. Js判断对象是否是数组的方法

    1.ECMAScript5中有一个现成的方法:Array.isArray(). var obj = {1:[1],2:[2]}, arr = [1], str = "1"; Arr ...

随机推荐

  1. C# 使用 Windows API 发送文件到打印机

    最近需要做一个打印的功能,于是在网上找到了这么一个方法. [StructLayout(LayoutKind.Sequential, CharSet = CharSet.Ansi)] public cl ...

  2. link cut tree模板(LCT模板)

    update:2017.09.26 #include <bits/stdc++.h> using namespace std; struct Link_Cut_Tree { + ; ], ...

  3. rdesktop install notes

    在centos7上安装rdesktop来访问windows桌面,需要安装EPEL源,另外还有需要安装专门的YUM源. rpm -Uvh https://dl.fedoraproject.org/pub ...

  4. Hadoop集群的各部分常用端口

    hadoop集群的各部分一般都会使用到多个端口,有些是daemon之间进行交互之用,有些是用于RPC访问以及HTTP访问.而随着hadoop周边组件的增多,完全记不住哪个端口对应哪个应用,特收集记录如 ...

  5. Glide Picasso和Fresco的对比

    比较Picasso.Glide 和 Fresco 三种图片加载库 比较 Picasso 与 Glide 总体来说二者极为相似,有着近乎相同的 API 的使用风格,但 Glide 在缓存策略和加载 gi ...

  6. CSS Outline(轮廓)

    CSS Outline(轮廓) 一.CSS 轮廓(outline) 轮廓(outline)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用. CSS outline 属性规定元素轮廓 ...

  7. 置顶,置低实现与window.scroll

    //置顶,置低实现 $('#updown .up').click(function(){$('html,body').animate({scrollTop: '0px'}, 300);}); $('# ...

  8. 如何退出minicom【学习笔记】

    一.先按ctr+a进入设置模式 二.在按x退出

  9. MySQL表损坏修复【Incorrect key file for table】

    今天机房mysql服务器异常关机,重新启动后报错如下: -- :: [ERROR] /usr/local/mysql/bin/mysqld: Incorrect key file for table ...

  10. Html基本用法

    hmtl hyper text markup language  超文本标记语言 超文本:超越一般的文本 变色 加粗 变大 甚至设置超链接 标记:浏览器已经定义好的 一些由尖括号括起来的特殊符号 语言 ...