时间戳

首页 > 解决方案 > ES6 解构：如何创建一个省略动态引用键的新对象

javascript - ES6 解构：如何创建一个省略动态引用键的新对象

问题描述

当键引用是动态的时，是否有使用解构和扩展运算符创建一个新对象的 ES6（及更高版本）解决方案，该对象具有从原始对象中删除的键和值，所以：

const state = {
   12344: {
      url: 'http://some-url.com',
      id: '12344'
   },
   12345: {
      url: 'http://some-other-url.com',
      id: '12345'
   }
}

const idToDelete = 12344

const { [idToDelete], ...newState } = state // dynamic key

console.log('newState:', newState)

// desired newState would only have the key 12345 and its value

除非它是我目前的 Babel 设置，否则我无法弄清楚这样做的干净 ES6 方式（如果它存在的话）。

提前谢谢了

标签： javascriptecmascript-6javascript-objects

解决方案

使用动态 id 进行解构时，您需要设置一个带有删除值的 var：关于此的文档

const state = {
   12344: {
      url: 'http://some-url.com',
      id: '12344'
   },
   12345: {
      url: 'http://some-other-url.com',
      id: '12345'
   }
}

const idToDelete = 12344

// the removed object will go to unusedVar
const { [idToDelete]: unusedVar, ...newState } = state // dynamic key

console.log('newState:', newState)

如果您不需要保留已删除的对象，更好的方法是使用关键字delete

const state = {
   12344: {
      url: 'http://some-url.com',
      id: '12344'
   },
   12345: {
      url: 'http://some-other-url.com',
      id: '12345'
   }
}

const idToDelete = 12344

delete state[idToDelete]

console.log('newState:', state)

推荐阅读