JS逆序遍歷實作程式碼_javascript技巧

最常用的遍歷方式為for語句（也有遞迴、while方式）。當我們遍歷一個陣列的時候，我們通常會這麼做：

複製程式碼 程式碼如下:

var arr = [1,2,3,4,5,6,7,8,9,10];
for(var i=0,total=arr.length;i   console.log(i,arr[i]);
}

這是最常用的遍歷方式：正序遍歷。它從數組的第一項依序走到最後一項。

那為什麼今天小劇還會提到逆序遍歷呢？

這裡不得不提下小劇寫的元件裡最常用的一個模組：events。用於建立自訂事件模型，處理事件的監聽及觸發，最簡單的發布訂閱（pub/sub）模式。因為最近發現記憶體溢出的隱患，需要在原有的基礎上增加一個解除綁定的方法。

因為同一事件名的回呼函數是放在同一數組中，解除綁定也只需要從數組中找到對應的回調函數（同一回調函數可能綁定多次），並且移除即可。

很簡單的需求，於是很自然地寫出類似下面的程式碼：

複製程式碼 程式碼如下:

//移除陣列中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i=0,total=arr.length;i   if(arr[i] == 2){
    //符合條件，移除
    arr.splice(i,1);
  }
}
console.log(arr);

很正常的程式碼有木有，可最終輸出結果卻是：[1, 2, 2, 1, 1, 2],顯然執行結果不符合預期。

問題出在哪裡呢？

仔細分析了一下，發現問題出在了每次匹配成功，執行移除操作之後，都會跳過下一個待檢查項，因為數組中之後的每一項都向前上升一位。

找到了問題所在，改了下程式碼，在執行移除操作之後，調整序列索引index（i）。

複製程式碼 程式碼如下:

//移除陣列中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i=0,total=arr.length;i   if(arr[i] == 2){
    //符合條件，移除
    arr.splice(i,1);
    //調整序列索引
    i = i-1;
  }
}
console.log(arr);

問題解決了，但總覺得修改序列索引是件調戲for循環的事。於是靈光一閃，啪啪啪，敲出下面的程式碼：

複製程式碼 程式碼如下:

//移除陣列中的2
var arr = [1,2,2,2,2,1,1,2,2];
for(var i = arr.length-1;i!=-1;i--){
  if(arr[i] == 2){
    //符合條件，移除
    arr.splice(i,1);
  }
}
console.log(arr);

遍歷的過程不變，唯一變化的是遍歷的順序變了，對了，還少了一個變數total。

好吧，我承認今天寫的東西很屌絲，但透過這個例子，給以後寫程式碼的時候提了個醒，在遍歷過程中，如果涉及到修改數組本身（增刪），逆序遍歷是個比較保險的遍歷方式。

coding筆記，留給以後嘲笑自己！

轉載請註明來源：http://bh-lay.com/blog/148c07761fa