OR運算（||）與inArray（）的性能

Question

假設您要檢查用戶在表單字段中輸入的輸入字符串。 對於可能的值列表，哪一個是檢查此輸入的最快方法？

以下示例使用jQuery 。

第一種方法：使用||

if (input == "firstValue" || input == "secondValue" || ... ) {
    ...
}

第二種方法：使用inArray()

if ($.inArray(input, array) >= 0) {
    ...
}

這兩種方法之間是否存在顯着差異？

Answer 1

你不想要最快但最可讀的方式。 這是in_array() （JavaScript： array.indexOf(value) >= 0 ），超過2或3個值。

性能差異可以忽略不計 - 雖然函數調用和數組創建肯定會有一些開銷，但與昂貴的操作（如文件訪問，數據庫訪問，網絡訪問等）相比無關緊要。所以最后沒有人會注意到差異。

這是一個簡短的基准測試 ，每個測試都有100萬次迭代：

5.4829950332642 - in_array, the array is recreated everytime
2.9785749912262 - in_array, the array is created only once
0.64996600151062 - isset(), the array way created only once and then the values were turned to keys using array_flip()
2.0508298873901 - ||

因此，最快但仍然非常易讀的方法就是這樣。 除非你創建$arr只有一次，用了很多次，也沒有必要為這一點，你可以簡單地留在in_array()

$arr = array_flip(array('your', 'list', 'of', 'values'));
if(isset($arr[$value])) ...

---

如果你確實要求JavaScript（在這種情況下擺脫那些$前綴！ ），最好的解決方案是使用Array.indexOf() ：

['a', 'b', 'c'].indexOf(value) >= 0

然而，並不是所有的瀏覽器已經支持Array.indexOf()所以你可能需要使用例如，從功能Underscore.js ：

_.contains(['a', 'b', 'c'], value)

jQuery還有一個功能：

$.inArray(value, ['a', 'b', 'c'])

最快的方法是使用object和in運算符，但是對象定義的可讀性低於數組定義：

value in {'a':0, 'b':0, 'c':0}

以下是針對各種解決方案的JSPerf基准測試： http ：//jsperf.com/inarray-vs-or - 但在大多數情況下，相當大的性能差異可以忽略不計，因為您不會在數百萬次執行代碼環。

Answer 2

答案是， 這取決於 ......

如果只有幾種可能性，請使用if (a || b || c) 。

如果最多可能有10個，請使用Array.indexOf()

請注意，對於上面的兩個建議，選擇應該取決於可讀性而不是真正的性能。

如果有多個（多個），使用一個鍵值等於的Object ，那么你可以使用if (myVar in myKeyObj) 。 這應該給出最差的O(log n)性能。

Answer 3

在執行javascript時，性能通常不是一個問題，通常是難以回答的問題。

在此示例中，解決方案之間的關鍵區別在於擴展。 第一個解決方案將始終執行預定數量的比較，inArray解決方案會變得更糟，因為如果有更多值，它將進行更多比較。

然而我仍然會在inArray中，99.99％的機會表現真的無關緊要。 您希望保持代碼的可維護性，這一點更為重要。

Answer 4

在大多數語言中，inArray（）實現如下：

function inArray(needle, haystack) {
  for (i = 0; i < length; i++) {
    if (haystack[index] == needle) {
      return true;
    }
  }

  return false;
}

如果你要展開那個循環，你最終會這樣做

if (haystack[0] == needle) {
  return true;
} 
if (haystack[1] == needle) {
  return true;
}
if (haystack[3] == needle) {
  return true;
}
// and so on

這可以濃縮成

if (haystack[0] == needle || haystack[2] == needle || … ) {
  return true;
}

沒有改變引擎蓋下發生的事情。

---

如果你反復不得不查找這樣的東西，我建議你去了解地圖。 代替

var haystack = ['hello', 'world', 'how', 'is', 'life'];
if (inArray("life", haystack)) {
  // …
}

你做

var haystack = {'hello' : true, 'world' : true, 'how' : true, 'is' : true, 'life' : true};
if (haystack["life"]) {
  // …
}

必須檢查的元素越多，與數組相比，地圖的執行效果越好。