如何从对象数组中获取值？答案

【问题标题】：How to get values from within an array of objects?如何从对象数组中获取值？
【发布时间】：2022-01-07 11:36:19
【问题描述】：

我需要在下面的数组中获取每个对象的最小值和最大值。我已经尝试了我所知道的一切，但返回的值是未定义的，我该怎么做？注意：之后，我需要在构造函数和工厂函数中执行相同的操作。流程一样吗？

    let faixas3 = [
  {tooltip: 'de R$ 6667 até R$ 7777', minimo: 6667, maximo: 7777},
  {tooltip: 'de R$ 7778 até R$ 8889', minimo: 7778, maximo: 8889},
  {tooltip: 'de R$ 9000 até R$ 10000', minimo: 9000, maximo: 10000}
];
const {tooltip, minimo, maximo} = faixas3;
console.log({tooltip, minimo, maximo}); // { tooltip: undefined, minimo: undefined, maximo: undefined }
console.log(tooltip, minimo, maximo); // undefined undefined undefined

【问题讨论】：

使用 [ ] 而不是 {}，const [tooltip, minimo, maximo] = faixas3;，faixas3 是数组而不是对象。
faixas3 是一个数组，你正在使用对象解构语法。
您可以使用.map()，其结果也将是一个数组（具有您在地图回调函数中指定的值）。或者你可以使用.forEach()，如果你想要的是一个处理每个项目的“循环”。
非常感谢您的帮助，这正是我需要做的。

标签： javascript arrays object

【解决方案1】：

你有一个对象数组。要像在示例中那样解构值，您必须指定要从哪个索引中解构值。

const {tooltip, minimo, maximo} = faixas3[0];
const {tooltip, minimo, maximo} = faixas3[1];
const {tooltip, minimo, maximo} = faixas3[2];

或者您可以使用循环遍历元素。

【讨论】：

不允许重新声明常量变量，在这种情况下覆盖现有变量没有意义。
是的，如果你想同时使用这三个，你必须使用 var 代替 const。我把这三个写在一起告诉他如何从数组的每个对象中解构。
你肯定需要六个变量来存储 OP 需要的值。

【解决方案2】：

你可以试试这个。

  function column(array, columnName) {
    return array.map(function(value,index) {
        return value[columnName];
    })
}  
const {tooltip, minimo, maximo} = [column(faixas3,'tooltip'),column(faixas3,'minimo'),column(faixas3,'maximo')];

【讨论】：

【解决方案3】：

您可以使用Array.map 以多种方式“重新定义”faixas3。这里有两个例子。第一个map-result 用于声明带有解构的变量。

const logElem = document.querySelector(`pre`);
const faixas3 = [
  {tooltip: 'de R$ 6667 até R$ 7777', minimo: 6667, maximo: 7777},
  {tooltip: 'de R$ 7778 até R$ 8889', minimo: 7778, maximo: 8889},
  {tooltip: 'de R$ 9000 até R$ 10000', minimo: 9000, maximo: 10000}
];
const faixas_minmax1 = faixas3.map(v => [v.minimo, v.maximo]);
logElem.textContent = `faixas_minmax1: ${JSON.stringify(faixas_minmax1)}`;
const faixas_minmax2 = faixas3.map(v => ({min: v.minimo, max: v.maximo}));
logElem.textContent += `\nfaixas_minmax2: ${
  JSON.stringify(faixas_minmax2, null, 2)}`;

// destructuring assignment to variables from faixas_minmax1
const [f3min0, f3max0, f3min1, f3max1, f3min2, f3max2] = faixas_minmax1.flat();
logElem.textContent += `\nf3min0, f3max2: ${f3min0}, ${f3max2}`;

&lt;pre&gt;&lt;/pre&gt;

【讨论】：