ES6 деструктуризация: как создать новый объект, в котором пропущены ключи с динамической ссылкой

Question

Существует ли решение 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 сделать это (если он существует).

Большое спасибо заранее

Answer 1

Я не думаю, что с помощью деструктуризации ES6 можно добиться чистых результатов. Поскольку другие ответы включают изменение состояния, попробуйте вместо этого:

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

const idToDelete = 12344

const newState = Object.assign({}, state);
delete newState[idToDelete];

console.log('newState:', newState)
console.log('old state:', state);

Answer 2

при деструктурировании с использованием динамического идентификатора вам нужно установить переменную со значением remove: документ об этом

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)