你一天(一周)内写了多少个循环了?

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

最新文章

  1. CAN基础知识
  2. Maven创建webapp(二)
  3. spring注入参数详解
  4. (转)UML序列图总结
  5. 关于Visual Studio中的TraceDebugging文件夹
  6. 关于ubuntu16.04给firefox安装flash的补充
  7. VIM设置-发现VIM的美
  8. RBF network
  9. loadView 再思考
  10. node中定时器, process.nextTick(), setImediate()的区别与联系
  11. 《.NET 设计规范》第 8 章:使用规范
  12. BPDU报文(传统STP)
  13. 易酷 cms2.5 本地文件包含漏洞 getshell
  14. [matlab] 17.网格矩阵
  15. 剑指Offer_编程题_8
  16. 用我所学去讲C语言指针
  17. JDK源码核心包
  18. AWTK(Toolkit AnyWhere): 为嵌入式、手机和桌面开发的通用GUI【转】
  19. 添加Google搜索
  20. JQuery EasyUI 日期控件 怎样做到只显示年月,而不显示日

热门文章

  1. js控制div动起来
  2. Windows Server 2003开机自动启动MySQL服务设置方法
  3. How to using T-SQL statement copy table[SQL]
  4. a 标签 跳转4种类型
  5. OXPattern
  6. 编译android程序时DEX过程出现错误
  7. main函数的argc和argv
  8. ListView的多布局中的小问题
  9. android几种定时器机制及区别
  10. 教你怎么安装Redis