在 web 开发领域，我们经常面临乍一看很简单的挑战，但很快就会变成复杂的难题。最近，我在 angular 项目中经历了一次有趣的经历，它提醒我在 typescript 中评估布尔条件时精确度的重要性。我想与您分享这个教训，希望它能帮助您避免同样的陷阱。
问题的背景
初步情况
在我的 angular 项目中，我遇到了涉及四个布尔变量的情况。在这四个中，两个依赖于通过可观察的来自后端的异步数据。目标很简单：只有当这两个特定变量为假时，条件才应该为真。
最初的方法及其局限性
最初，我选择了一种对我来说似乎合乎逻辑且简洁的方法：
if (terrainpret && arbitrearrive &&
!equipelocaleabsente && !equipevisiteuseabsente) {
// commencer le match
}
这种方法看起来很优雅：使用感叹号（！）来确保异步变量为 false。然而，我很快发现这个方法隐藏着一个微妙的陷阱。
布尔求值陷阱
启示录
当我意识到我的代码没有按预期运行时，问题就出现了。经过调查，我意识到我忽略了 typescript 中布尔求值的一个关键方面。
技术说明
在 typescript 中，有几个值被认为是“falsy”，也就是说，它们在布尔上下文中被评估为 false。这些值包括：
- 假
- 0
- “”（空字符串）
- 空
- 未定义
- nan
就我而言，在从后端接收值之前，异步变量可能是未定义的。因此，例如，条件 !equipelocaleabsente 不仅在变量为 false 时为 true，而且在变量未定义时也为 true。
解决方案：明确
纠正的方法
为了解决这个问题，我必须更明确地表达我的情况：
if (terrainPret && arbitreArrive &&
equipeLocaleAbsente === false && equipeVisiteuseAbsente === false) {
// Commencer le match
}
这种方法确保异步变量特别为假，而不仅仅是“假”值。
精度的好处
这个解决方案有几个优点：
- 它消除了评估条件时的歧义。
- 它使代码更具可读性并且其意图更明确。
- 它可以防止与“虚假”值评估相关的意外行为。
结论
这次经历提醒我代码精确和清晰的重要性，尤其是在处理异步操作和布尔求值时。它还强调需要充分理解我们使用的语言的细微差别。
