将一个对象数组转换为对象值的数组

Question

我正在尝试转换这个数组

let orders = [
  {  amount: '100', user: 'admin', date: 'March 6, 2019' },
  {  amount: '120', user: 'admin', date: 'March 6, 2019' },
  {  amount: '80', user: 'admin', date: 'March 7, 2019' },
  {  amount: '200', user: 'admin', date: 'March 7, 2019' },
];

变成像这样的内容

orders = [
  ['100', 'admin', 'March 6, 2019'],
  ['120', 'admin', 'March 6, 2019'],
  ['80', 'admin', 'March 7, 2019'],
  ['200', 'admin', 'March 7, 2019'],
];

我读到 Objects.values() 会返回一个数组中的值，所以我尝试使用 forEach() 遍历 order 数组，并对数组中的每个项使用 Object.values。

let newOrders = orders.forEach(order => {
  return Object.values(order);
});

我不知道自己做的对不对，我还不熟悉 JavaScript。请帮帮我。

- sun.adriann

---

避免使用 forEach！ - Bergi

@Bergi为什么要避免使用forEach？ - reggaeguitar

“它有太多限制”（例如在这里发生的情况），你可能会被绊倒，我更喜欢“for ... of”，并且强烈推荐给初学者。 - Bergi

Answer 1

由于Object.values()返回的数组中值的顺序不保证，因此您应该考虑使用Object Destructuring和.map()。然后，您可以将对象属性提取到单独的变量中，并明确以所需顺序返回它们。

const data = [
  { amount: '100', user: 'admin', date: 'March 6, 2019' },
  { amount: '120', user: 'admin', date: 'March 6, 2019' },
  { amount: '80',  user: 'admin', date: 'March 7, 2019' },
  { amount: '200', user: 'admin', date: 'March 7, 2019' }
];

const result = data.map(({ amount, user, date }) => [amount, user, date]);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

- Mohammad Usman

---

您的“对象解构”链接似乎没有提到，但是顺序被保留了，因为变量名是相关的，应该与属性名匹配。即使变量定义已被修改，“const result = data.map(({ date, amount, user }) => [amount, user, date]);”仍然可以正常工作。这个链接帮助了我理解。 - Eric Duminil

Answer 2

使用解构。如果需要在输出中保留对象属性的顺序，可以使用此方法。

let orders = [
  {  amount: '100', user: 'admin', date: 'March 6, 2019' },
  {  amount: '120', user: 'admin', date: 'March 6, 2019' },
  {  amount: '80', user: 'admin', date: 'March 7, 2019' },
  {  amount: '200', user: 'admin', date: 'March 7, 2019' },
];

console.log(orders.map(({amount,user,date})=>[amount,user,date]))

使用 map 和 Object.values 来从对象中获取值。这并不保证输出顺序与对象中的顺序相同。请参阅此处

let orders = [
  {  amount: '100', user: 'admin', date: 'March 6, 2019' },
  {  amount: '120', user: 'admin', date: 'March 6, 2019' },
  {  amount: '80', user: 'admin', date: 'March 7, 2019' },
  {  amount: '200', user: 'admin', date: 'March 7, 2019' },
];
console.log(orders.map(e=>Object.values(e)))

- ellipsis

---

更简单的做法是 orders.map(Object.values)。 - kemicofa ghost

这段话的意思是，这很重要，因为它意味着你的代码可能会返回一个订单的['100', 'admin', 'March 6, 2019']，而另一个订单则可能返回['admin', 80', 'March 7, 2019']。 - Eric Duminil

规范并不要求顺序，但显然所有主流浏览器仍然遵循该顺序。 - JollyJoker

@JollyJoker 不对。我记得Chrome在处理带有数字键的对象时会出现一些问题，它会将其排序为1、111、1245、13，而不是1、13、111、1245。 - see

@I.Am.A.Guy 这是规范中的顺序。请参见 https://dev59.com/Ul0a5IYBdhLWcg3wqaNS#30919039 - JollyJoker

你的回答的第一部分可能存在漏洞。能否请你删除它或者至少加上一个警告呢？你的回答已经被接受，问题出现在“热门网络问题”中，所以很多人会看到它。 - Eric Duminil

Answer 3

无法保证对象属性的枚举顺序（参考文献）。最简单的解决方案是明确指定所需顺序中的键：

let result = orders.map(order => [order.amount, order.user, order.date]);

- Salman A

Answer 4

只需使用orders.map(Object.values)即可。

let orders = [
  {  amount: '100', user: 'admin', date: 'March 6, 2019' },
  {  amount: '120', user: 'admin', date: 'March 6, 2019' },
  {  amount: '80',  user: 'admin', date: 'March 7, 2019' },
  {  amount: '200', user: 'admin', date: 'March 7, 2019' },
];

const result = orders.map(Object.values);

console.log(result)

- Khyati Sharma

Answer 5

let orders = [
  {  amount: '100', user: 'admin', date: 'March 6, 2019' },
  {  amount: '120', user: 'admin', date: 'March 6, 2019' },
  {  amount: '80',  user: 'admin', date: 'March 7, 2019' },
  {  amount: '200', user: 'admin', date: 'March 7, 2019' },
];

const result = orders.map(Object.values);

console.log(result)

- Vipul

Answer 6

you can try this:

orders.map((order) => Object.values(order));

map方法会返回一个新的数组，而forEach方法只是在数组的每个元素上执行回调函数。

- Mateusz Jabłoński

Answer 7

let orders = [{
    amount: '100',
    user: 'admin',
    date: 'March 6, 2019'
  },
  {
    amount: '120',
    user: 'admin',
    date: 'March 6, 2019'
  },
  {
    amount: '80',
    user: 'admin',
    date: 'March 7, 2019'
  },
  {
    amount: '200',
    user: 'admin',
    date: 'March 7, 2019'
  },
];

let array = []; //initializing array
orders.forEach((element) => { //using array function for call back
  for (var j in element) { //looping through each element of array
    array.push(element[j]); //pushing each value of object present inside the orders
  }
});
console.log(array); //array is ready

- Vipul

Answer 8

一种更为强大的解决方案，适用于您有许多实例需要使用不同顺序/键的类似struct对象的情况。这是一种功能性方法，propsToArray将一系列键作为单独的参数，并返回一个函数，该函数对对象执行所需的转换。

let orders = [
  {  amount: '100', user: 'admin', date: 'March 6, 2019' },
  {  amount: '120', user: 'admin', date: 'March 6, 2019' },
  {  amount: '80',  user: 'admin', date: 'March 7, 2019' },
  {  amount: '200', user: 'admin', date: 'March 7, 2019' },
];

// option 1
let propsToArray = function(...keys) {
    return function(obj) {
        return keys.map(key => obj[key]);
    }
};
// option 2
//  propsToArray = (...keys) => (obj) => keys.map(key => obj[key]);

// resulting function
let orderToArray = propsToArray("amount", "user", "date");

console.log(orders.map(orderToArray));

- Conor O'Brien