停止使用迴圈 教你用underscore優雅的寫程式碼

　　你一天（一週）內寫了多少個迴圈了？

var i;
for(i = 0; i < someArray.length; i++) {
  var someThing = someArray[i];
  doSomeWorkOn(someThing);
}

　　這當然無害，但這種寫法非常醜而且奇怪，這也不是真正需要抱怨的。但這種寫法太平庸了。

var i,
  j;
for(i = 0; i < someArray.length; i++) {
  var someThing = someArray[i];
  for(j = 0; j < someThing.stuff.length; j++) {
      doSomeWorkOn(someThing.stuff[j]);
  }
}

　　在擴充套件糟糕的程式碼，在你丟擲一大堆if前，你已經精神錯亂了。

　　我在兩年裡沒有寫一個迴圈(loop)。

　　“你在說什麼？”

　　這是真的，一個冷笑話。其實不是一個都沒有（好吧，我確實寫了幾個），因為我不寫迴圈(loops)，我的程式碼更容易理解。你

　　怎麼做的呢？

_.each(someArray, function(someThing) {
  doSomeWorkOn(someThing);
})

　　或者更好一點：

_.each(someArray, doSomeWorkOn);

　　這就是underscorejs所做到的。乾淨，簡單，易讀，短，沒有中間變數，沒有成堆的分號，簡單非常優雅。

　　這是另外一些例子。

var i,
  result = [];
for(i = 0; i < someArray.length; i++) {
  var someThing = someArray[i];
  // 打到這，我已經手疼了
  if(someThing.isAwesome === true) {
      result.push(someArray[i]);
  }
}

　　同樣，一個使用迴圈浪費時間的典型用例。即便這些網站是宣傳禁菸和素食主義的，看到這些程式碼我也感到義憤。看看簡單的寫法。

var result = _.filter(someArray, function(someThing) {
  return someThing.isAwesome === true;
})

　　像underscore中的filter（過濾）的名字那樣，隨手寫的3行程式碼就可以給你一個新的陣列（array)。

　　或者你想把這些陣列轉換成另外一種形式？

var result = _.map(someArray, function(someThing) {
  return trasformTheThing(someThing);
})

　　上面三個例子在日常生活中已經夠用了，但這些功能還不足矣讓underscore放到檯面上。

var grandTotal = 0,
  somePercentage = 1.07,
  severalNumbers = [33, 54, 42],
  i; // don't forget to hoist those indices;
for(i = 0; i < severalNumbers.length; i++) {
  var aNumber = severalNumbers[i];
  grandTotal += aNumber * somePercentage;
}

　　underscore版本

var somePercentage = 1.07,
  severalNumbers = [33, 54, 42],
  grandTotal;
grandTotal = _.reduce(severalNumbers, function(runningTotal, aNumber) {
  return runningTotal + (aNumber * somePercentage);
}, 0)

　　這個剛開始看上去可能有點怪，我查了下關於reduce的文件，知道了它的存在。因為我拒絕使用迴圈，所以它是我的首選。上面這些東西僅僅是入門，underscorejs庫還有一大堆牛B的功能。

　　30天不使用迴圈的挑戰。

　　在一下一個30天裡，不要使用任何迴圈，如果你看到一堆討厭和粗糙的東西，用each或者map將他們替換掉。再用一點reducing。

　　你需要注意到，Underscore是通往函數語言程式設計的。一種看得見，看不見的方式。一條很好的途徑。

　　OurJS注*目前現代瀏覽器已經支援each, filter, map, reduce方法，但underscore庫可以實現對舊版IE的相容，下面是使用ES5原生方法寫的例子：

[3,4,5,3,3].forEach(function(obj){
    console.log(obj);
});

[1,2,3,4,5].filter(function(obj){
    return obj < 3
});

[9,8,5,2,3,4,5].map(function(obj){
    return obj + 2;
});

[1,2,3,4,5].reduce(function(pre, cur, idx, arr) {
    console.log(idx);    //4 個迴圈: 2-5
    return pre + cur;
});   //15

//sort方法同樣很有用
[9,8,5,2,3,4,5].sort(function(obj1, obj2){
    return obj1 - obj2;
});

　　原文 joelhooks.com