使用动态属性解构删除对象属性时数字键名不生效如何解决？

问题原因 #

你使用的动态解构移除属性的语法本身没有问题，prop = '3'时无法生效的核心原因是你传入的prop实际是数字类型的3，而非字符串类型的'3'。
JavaScript对象的所有键在存储时都会自动转换为字符串/Symbol类型，你定义的'3'这个属性键，实际存储的是字符串值'3'，如果prop是数字3，解构时匹配的是数字类型的键，自然无法命中对象里的字符串键，也就没法把对应属性摘出。

解决方法 #

在解构前把prop转为字符串类型即可，修改后的代码如下：

// 先转类型再解构
const stringProp = String(prop)
const {[stringProp]: removedItem, ...rest} = myObject

也可以直接在解构表达式中转换：

const {[String(prop)]: removedItem, ...rest} = myObject

验证示例 #

const myObject = {
  'property1': {},
  'property2': {},
  '3': {}
}
const prop = 3 // 数字类型的参数
const {[String(prop)]: removedItem, ...rest} = myObject
console.log(rest) // 输出 {property1: {}, property2: {}}，已成功移除'3'对应属性

内容的提问来源于stack exchange，提问作者Mahdieh Roustaei