如何使用数字键名解构对象？答案

【问题标题】：How to destructure objects with keys names that are numbers?如何使用数字键名解构对象？
【发布时间】：2018-11-20 23:31:03
【问题描述】：

我有需要在组件中解构的道具。由于它来自 API，它实际上是一个对象，我想从中获取 0 到 39 的对象。但是，当我尝试以这种方式解构它们时：

 const { 0, ...39: weatherData } = this.props;

由于逗号，VSCode 给了我一个意外令牌的错误。如何在不必枚举每个对象的情况下解构道具？

【问题讨论】：

对象键总是字符串。即使这些字符串包含数字字符，它们仍然是字符串。
@ScottMarcus，好的，如果我收到关于逗号的错误，如何解构它们？
您是否要获取一系列键的所有值？我不知道你希望... 在这里做什么。
这个对象实际上是一个数组吗？确实应该如此。
即使这不是数字属性，解构也不会那样工作。如果你想创建一个只有属性子集的新对象，你可以做类似stackoverflow.com/q/25553910/218196 的事情。

标签： javascript object ecmascript-6

【解决方案1】：

您可以将数组作为对象的目标，该对象仅采用数字索引并将其切成所需的长度。

const array = Object
    .assign([], { abc: 1, 0: 100, 1: 101, 39: 139, 40: 140 })
    .slice(0, 40);

console.log(Array.isArray(array));
console.log(array);

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

【讨论】：

但是输出的不是数组，而是对象。
slice 仅适用于数组。请查看数组检查。
@llievredemars 它应该无论如何都是一个数组

【解决方案2】：

在 javascript 中，即使您使用 number 作为键创建对象，键始终是字符串，例如：

const obj = {
  [1]: 1,
  anotherThing: 2
};

console.log(Object.keys(obj))

但是，由于'1' 或1 是文字，因此无法在解构赋值中使用它们，为了使用数字键，您必须将对象转换为iterable 或手动映射属性，

将对象转换为可迭代对象的最简单方法是将Object.assign 与数组一起使用，因为数组也是对象，您可以执行以下操作：

const arr = Object.assign([], obj);

为了实现您的目的，例如：

const obj = {
  [0]: 0,
  [1]: 1,
  wheaterData: 'wheaterData',
  anotherNonNumericProp: '1'
};

const arrOfNumericProps = Object.assign([], obj);

const [prop0, prop1] = arrOfNumericProps;

const {wheaterData,
  ...rest
} = arrOfNumericProps;

console.log(prop0);
console.log(prop1);

console.log(wheaterData);
console.log(rest);

【讨论】：

整数命名的属性不需要计算键。
@Bergi 不，但这样更容易识别它们。