我正在使用一些像这样的解构:
const { item } = content
console.log(item)
但是我应该如何处理content === undefined
-这将引发错误?
“旧”方式如下所示:
const item = content && content.item
因此,如果content
未定义->item
也将是未定义的。
我可以使用解构来做类似的事情吗?
Answers:
通常或在这种情况下,可以使用短路评估来提供默认值(如果content
该值是伪造的)。undefined
null
const content = undefined
const { item } = content || {}
console.log(item) // undefined
一种比较惯用的方式(请参见此注释)是在破坏对象之前将内容传播到对象中,因为null
和undefineds
值都被忽略了。
const content = undefined
const { item } = { ...content }
console.log(item) // undefined
如果要破坏函数参数,则可以提供默认值(= {}
在示例中)。
注意:仅当解构参数为时undefined
,才应用默认值,这意味着解构null
值将引发错误。
const getItem = ({ item } = {}) => item
console.log(getItem({ item: "thing" })) // "thing"
console.log(getItem()) // undefined
try {
getItem(null)
} catch(e) {
console.log(e.message) // Error - Cannot destructure property `item` of 'undefined' or 'null'.
}
item
如果输入对象不包含该属性,甚至为该属性设置默认值
const getItem = ({ item = "default" } = {}) => item
console.log(getItem({ item: "thing" })) // "thing"
console.log(getItem({ foo: "bar" })) // "default"
unidiomatic
您认为为什么?
const { item } = Object(content)
接受的答案不适用于不是由设置的真正不确定的值const content = undefined
。在这种情况下,它将起作用:
const { item } = (typeof content !== 'undefined' && content) || {}
console.log(item)
undefined
。在content
未声明声明或不在范围内的开发人员控制台中测试上述代码将可以工作,但是将分配替换为content || {}
将引发Uncaught ReferenceError: content is not defined
异常。