javascript - JavaScript 中三元条件运算符和逻辑与运算符的运算符优先级

Question

大家好，我刚刚浏览了一个 JS 插件的源代码 (dropdown.js)，并遇到了以下代码行:

return $parent && $parent.length ? $parent : $this.parent()

我无法完全掌握上面这行，我理解逻辑与 (&&) 和三元条件运算符 (... ? ... : ...)，但我不在上面的例子中似乎理解它们是如何相互作用的。

现在，如果我在 return 语句之前添加一个 console.log:

console.log($parent && $parent.length ? $parent : $this.parent());

我得到:

Object { 0: <li.dropdown.open>, length: 1, prevObject: Object, context: <a.dropdown-toggle>, selector: ".parent()" }

这确实是 $this.parent()

此外，在我的例子中，$parent 的计算结果为 false。

所以这些是我的乐高积木，有人可以帮我把它放好并给我一个清晰的图片来说明它是如何工作的吗:

return $parent && $parent.length ? $parent : $this.parent()

谢谢。

---

*请注意，这个问题的预编辑版本有一个不正确的标题，并且在仔细阅读之前没有解释问题的真正含义，因此请不要对下面可能看起来的任何答案投反对票谈论“短路”来代替这个问题的实际主题(运算符优先级)，仅仅是为了看起来离题和粗心

Answer 1

由于 JavaScript 的 operator precedence ，您发布的表达式等效于:

return ($parent && $parent.length) ? $parent : $this.parent();

这是由于 && 运算符在 ?: 之前被求值。或者，您可以使用 if else 重写表达式:

if ($parent && $parent.length)
    return $parent;
else
    return $this.parent();