Question

我有一个简化结构的对象，如下所示：

state = {
  todo: {
    1: {text: 'Buy apples'},
    2: {text: 'Buy milk'}
  }
}

如果我想删除todo项目的不变性，根据Stack Overflow上的其他答案，我可以解构todo的列表：

const idToDelete = 2

let {
  [idToDelete]: deleted,
  ...newTodo
} = state.todo

如果我console.log(newTodo)，则它具有相同的state.todo值，这意味着它尚未移除到ID为2的todo项目。如果我console.log(deleted)则返回我要删除的待办事项的内容：{text: 'Buy milk'}。

我知道使用诸如Immutable.js这样的库来管理它会更容易一些，但是我想知道为什么解析对象不会删除todo项目。感谢。

Answer 1

你需要阶段0才能达到你想要的效果。如果你检查我的代码，你会看到如果使用字符串来破坏参数，它将按预期工作，但如果你使用数字变量，结果将是完整的对象。我想这应该是实现中的一个错误。

＆＃13;

const state = {
  todo: {
    1: {text: 'Buy apples'},
    2: {text: 'Buy milk'}
  }
}
const id = 1
const { [id]: deleted, ...newTodo } = state.todo

console.log(deleted)
console.log(newTodo)

/********* GOOD EXAMPLE *********/

const { [id.toString()]: del, ...goodNewTodo } = state.todo

console.log(del)
console.log(goodNewTodo)

＆＃13;

Answer 2

处理字符串键与数字键的方式似乎有所不同。按照我的想法，这似乎不合适，所以我想知道某处是否有错误。

const orig = {
  a:1,
  b:2,
  1:'a',
  2:'b'
};

const {2:val_for_2, ...rest_for_2} = orig;
const {b:val_for_b, ...rest_for_b} = orig;

console.log('val_for_2:', val_for_2);
console.log('rest_for_2:', rest_for_2);
console.log('val_for_b:', val_for_b);
console.log('rest_for_b:', rest_for_b);

// output (as of late Feb, 2017):
// val_for_2: b
// rest_for_2: {
//   "1": "a",
//   "2": "b",
//   "a": 1,
//   "b": 2
// }
// val_for_b: 2
// rest_for_b: {
//   "1": "a",
//   "2": "b",
//   "a": 1
// }

通过解构从对象中移除键的不变性

2 个答案: