在 JavaScript 中将对象转换为数组
终于，随着 ES2017 的发布，这正式成为现实！我们现在有 3 种方法可以将对象转换为数组🎊
数组本身就包含一系列方法（不好意思，这个双关梗有点烂😝）。所以，通过将对象转换为数组，你就可以访问所有这些方法了。耶🥳
const zoo = {
lion: '🦁',
panda: '🐼'
};
Object.keys(zoo)
// ['lion', 'panda']
Object.values(zoo)
// ['🦁', '🐼']
Object.entries(zoo)
// [ ['lion', '🦁'], ['panda', '🐼'] ]
该讲故事了……
古代
很久很久以前，在一个遥远的星系，遍历物体并不容易。好吧，我有点夸张了😅。但我记得每当我需要把一个物体转换object成一个对象时array，我都必须这样做。
var numbers = {
one: 1,
two: 2
};
var keys = [];
for (var number in numbers) {
if(numbers.hasOwnProperty(number)){
keys.push(number)
}
}
keys; // [ 'one', 'two' ]
我一直很恼火，希望有更好的办法……
ES6 -Object.keys
然后ES6出现了！我的生活从此改变！我们终于有了更轻松的方法🥳
现在，有一个内置方法可以快速将对象中的所有键转换为数组：
const numbers = {
one: 1,
two: 2
}
Object.keys(numbers);
// [ 'one', 'two' ]
生活真美好！但随后我又生气了。为什么我只能提取密钥，我也想要我的值！人类总是贪得无厌，不是吗😂 然后 ES2017 就来了……
对象.值
嗨，我是 ES2017，我会满足你所有的愿望🧞♀️。现在你可以用一个方法轻松地将值提取到数组中。
const numbers = {
one: 1,
two: 2
}
Object.values(numbers);
// [ 1, 2 ]
对象条目
但 ES2017 的惊喜远不止于此。它给了我更多！现在我承认键和值都可用了，所以别生气了。我简直惊呆了。它让我瞬间开心起来😆
const numbers = {
one: 1,
two: 2
}
Object.entries(numbers);
// [ ['one', 1], ['two', 2] ]
布亚👊
对象条目 + 解构
但是，我当时就想……嵌套数组🤨。拜托，用起来太麻烦了。ES6 及时出现，说：别担心！这就是我给你解构赋值的原因！
const numbers = {
one: 1,
}
const objectArray = Object.entries(numbers);
objectArray.forEach(([key, value]) => {
console.log(key); // 'one'
console.log(value); // 1
})
ES6，这就是为什么你是最棒的💛
故事结束
希望你们喜欢我讲的代码故事😂
现在就去体验一下这些超棒的对象方法吧😊
浏览器支持
Object.keys它拥有最佳的支持。我说的最佳，是指它支持 Internet Explorer 😆。其他的，Object.values以及Object.entries，很遗憾，不支持 Internet Explorer。幸运的是，有 polyfill 可以改善支持。
聚酯纤维
等等，还有更多……
你接下来可能会问，现在该如何将数组转换回对象呢？别担心，这个问题已经解决了。这里有一个新方法叫做 ` Object.fromEntries.`。它本质上是 `.` 的反函数Object.entries。
const array = [
[ 'one', 1 ],
[ 'two', 2 ]
];
Object.fromEntries(array);
// { one: 1, two: 2 }
注意：这项技术非常新，所以支持有限。先把它记在知识库里，但最好过段时间再把它加入你的实际工具箱🧰
社区意见
- @podfeet：我想创建一个特定形式的对象，所以我过去常常
object.keys去发现我想提取的特定元素的索引。
资源
—
感谢阅读❤
欢迎关注！Instagram | Twitter | Facebook |博客| SamanthaMing.com