在 JS 中解构时嵌套的部分对象默认？

Question

考虑以下代码：

function foo({
    item1 = 'a',
    item2 = 'b',
    item3 = {x: 1, y: 2}
} = {}) {
    console.log(item1,item2,item3.x,item3.y)
}

如果您调用 foo()，您将获得一个包含 item1、item2 和 item3 的默认值的对象。您也可以调用 foo({item1: 'm', item2: 'n'})，您的结果将包括 {x: 1, y: 2} 的默认值 item3。但是，如果您调用：

foo({item1: 'm', item2: 'n', item3: {x: 99}})

您将在函数 foo.

的范围内为 item3.y 获得 undefined

所以：

在这种情况下，有没有办法为 item3 的嵌套属性获取单独的默认值？

Answer 1

这是不可能的。

在参数中，您试图提取 3 个变量：一个 item1 对象、一个 item2 对象和一个 item3 对象。

除此之外，您还尝试改变 item3 对象，以防它不包含某个属性。

但是解构所能做的就是将对象的属性提取到变量中 - 它不能改变任何现有对象（没有一些不应该使用的非常丑陋古怪的代码）。

如果您可以将 item3 的 个别属性 提取到新变量中，则很有可能：

function foo({
  item1 = 'a',
  item2 = 'b',
  item3: {
    x = 1,
    y = 2
  } = {}
} = {}) {
  console.log(item1, item2, x, y)
}


foo({item1: 'm', item2: 'n'})
foo({item1: 'm', item2: 'n', item3: {x: 99}})

Answer 2

是的。解决办法是破坏更多。来自：

function foo({
    item1 = 'a',
    item2 = 'b',
    item3 = {x: 1, y: 2}
} = {}) {
    console.log(item1,item2,item3.x,item3.y)
}

到

function foo({
    item1 = 'a',
    item2 = 'b',
    item3: {x = 1, y = 2} = {},
} = {}) {
    console.log(item1,item2,x,y)
}

遗憾的是，item3 的存在必须删除，只能使用 x 和 y。

另一种解决方案只能item3 = Object.assign({x: 1, y: 2}, item3)作为foo正文的第一行。

Answer 3

有一种骇人听闻的方法可以达到非常接近的效果。您可以声明一个不会出现在原始对象 (item3ex) 中的属性，然后使用原始的属性 (item3) 来覆盖对象传播的默认值.

function foo({
  item1 = 'a',
  item2 = 'b',
  item3,
  item3ex = { x: 1, y: 2, ...item3 } 
} = {}) {
  console.log(item1, item2, item3ex)
}

foo({item1: 'm', item2: 'n'})
foo({item1: 'm', item2: 'n', item3: {x: 99}})

在 JS 中解构时嵌套的部分对象默认？

Nested partial object defaults when destructuring in JS?

javascript

destructuring