使用 ES6 进行对象解构答案

【问题标题】：Object destructing using ES6使用 ES6 进行对象解构
【发布时间】：2019-08-19 10:37:19
【问题描述】：

我有这个嵌套对象，其中还包含一个数组。

result:{
"a": [{ "b": { "c": 1,
               "d": 2,
               "e": 3
              },
        "f": 0
      }]
}

如果我需要 d 的值，如何使用 ES6 解构这个对象？

【问题讨论】：

请添加您尝试过的代码
这是“解构”，而不是“破坏”。我们不想消灭对象。 :-)

标签： javascript arrays object nested destructuring

【解决方案1】：

对象解构符号就像对象文字符号一样，只是在等号的另一边。所以你写的正是你要写的内容，只为d创建必要的结构，并将你的d变量/常量名称放在那里。

看起来您正在向我们展示您的对象的内容（例如，它有一个名为 result 的属性），所以：

const obj = {
  result: {
    "a": [{
      "b": {
        "c": 1,
        "d": 2,
        "e": 3
      },
      "f": 0
    }]
  }
};
const {
  result: {
    "a": [{
      "b": {
        d
      }
    }]
  }
} = obj;
console.log(d);

我并不是说我会在这里使用解构。事实上，我可能不会。但是你可以。 :-)

如果result 是包含对象的变量，只需删除该层：

const obj = {
  "a": [{
    "b": {
      "c": 1,
      "d": 2,
      "e": 3
    },
    "f": 0
  }]
};
const {
  "a": [{
    "b": {
      d
    }
  }]
} = obj;
console.log(d);

当然，从表面上看，您的问题是您想要a 中的第一个 条目中的d。您可以将其概括为像这样获取条目n（我回到假设result 是对象的一部分）：

const obj = {
  result: {
    "a": [
      {
        "b": {
          "c": 1,
          "d": 2,
          "e": 3
        },
        "f": 0
      },
      {
        "b": {
          "c": 1,
          "d": 4, // ***
          "e": 3
        },
        "f": 0
      }
    ]
  }
};
const n = 1; // Which entry in `a` to get
const {
  result: {
    "a": {
      [n]: {
        "b": {
          d
        }
      }
    }
  }
} = obj;
console.log(d);

我将对象解构用于a，而不是数组解构，并带有计算的属性名称。我可以这样做，因为数组是对象。

数组解构表示法也和数组字面量表示法一样。 :-)

【讨论】：

如果我不得不假设，d 将始终拥有第一个对象的值，即使我的数组有多个值。
@Rajesh - 我的上述内容是基于问题的内容，是的。如果他需要从其他条目中挑选出来，它看起来会略有不同。
我只是请求我的理解。就个人而言，我不喜欢这样的解构符号，因为您失去了可读性。但鉴于我的代码中有这样的内容，我应该知道它的含义。
@Rajesh - 是的，没错，它会采用第一个，因为那是 {"b": {"d": 2}} 在数组符号中的位置。不过，我们可以从a 中选择任何条目。我更新了答案以显示如何。 :-)
@Rajesh - 对我来说，如果你不走得太远，解构是很棒的。对我来说，上面说的太远了。 :-)

【解决方案2】：

你想要 d 的值吗？

result.a[0].b.d ?

【讨论】：