理解语法
前几天我检查一段代码时,遇到了一组以前从未见过的语法。它看起来像这样:
!!{...obj, ...obj2}.item
这段代码里有些片段我能认出来。但全部放在一起?就不太清楚了。
物体扩散
如果按照运算顺序,我们首先需要查看这个表达式中的展开部分。
{...obj, ...obj2}
幸好我之前写过这篇文章。它讲的是如何将两个对象合并成一个包含所有唯一键值对的单一对象。
接下来会发生什么?
这是我首先需要弄清楚的事情。我相当肯定接下来要执行的语法是.item选择器,但我不确定。
事实证明这是正确的。由于扩展表达式的结果是一个对象,我们访问的是item该对象中键的值。
为了更清晰地解释,我们可以这样写。
const newObj = {...obj, ...obj2}
const item = newObj.item
砰砰
这可能是最不熟悉的语法部分。` !&` 在 JavaScript 中表示“非”,但它到底是!!什么意思呢?实际上,它的意思是“非非”。它保证表达式的结果始终为 `&`true或 `& false`。
我觉得这篇文章解释得最好,但我还是试着在这里总结一下。
在 JavaScript 中,我们有假值和真值。null例如,`if` 是假值,这意味着这个语句为真。
!null === true
如果我们再添加一个,!就会发现该表达式等价于false。
!!null === false
所以!!它告诉我们,我们的表达是真还是假。
总而言之
让我们回顾一下最初的例子。
!!{...obj, ...obj2}.item
如果我们仔细分析,它其实是这样做的。
const newObj = {...obj, ...obj2}
const item = newObj.item
if (item) {
return true
} else {
return false
}
结果完全取决于我们的对象。让我们来看两种情况。
例1:
const obj = {
item: null
}
const obj2 = {
key: "thing"
}
在这种情况下,表达式为false,因为null是假的。
例2:
const obj = {
key: false
}
const obj2 = {
item: "some value"
}
在这个例子中,表达式true“!”"some value"是真值。
真酷
你觉得怎么样?我不确定自己会经常用到它,但这段代码确实很巧妙。它允许我们遍历多个对象,并判断某个特定键是否存在有效值。
文章来源:https://dev.to/laurieontech/making-sense-of-syntax-3i1