JavaScript中具有三元條件和邏輯的運算符優先級和運算符

Question

大家好，我只是通過JS插件的源代碼（ dropdown.js ），遇到了以下代碼行：

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

我無法完全掌握以上內容，我了解Logical And（&&）和三元條件運算符（ ... ? ... : ... ），但我似乎不理解它們在上面的例子。

現在，如果我在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的運算符優先級 ，您發布的表達式等效於：

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

這是因為&&運算符在?:之前被求值。 另外，您可以使用if else重寫表達式：

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

Answer 2

在這里， $parent和$this都是JQuery對象。 $parent && $parent.length ? $parent : $this.parent() $parent && $parent.length ? $parent : $this.parent()等效於：

if($parent && $parent.length) {
  return $parent;
}
return $this.parent();

因此， $parent && $parent.length實際上被評估為： 如果$parent和$parent.length不為null ， undefined ， 0或false （偽造的值），則返回$parent ，否則返回$this.parent() 。

Answer 3

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

那樣閱讀。 這兩個條件都必須為真。 在JS中，條件為false時，&&操作數將返回false

Answer 4

如果$parent解析為一個“真實”的值，而$parent.length也是如此（這意味着它不為0），則它將返回$parent的值。

如果$parent為false（很可能為null或未定義），或者parent的長度為0，則返回$this.parent() 。

Answer 5

在javascript中，尤其是在條件語句中，以下是正確的

if($parent) //checking whether the $parent variable has a value

您發布的條件語句的措詞如下

如果$ parent不是null / undefined並且$ parent.length不是null / undefined，則返回$ parent，否則返回$ this.parent（）;。

讓我們再來看一遍

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

首先是三元運算符的條件

$parent && $parent.length

短路運算符在這里起作用，因為如果$ parent為null / undefined，它將不會求值$ parent.length（這將引發JavaScript異常）。 如果不為null，則評估$ parent.length是否不為null / undefined。

可以將相同的代碼編寫為（僅出於簡潔目的使用“ null”）

if($parent != null && $parent.length !=null) {
    return $parent;
} else {
    return $this.parent();
}