underscore.js中的each和map方法与jquery进行比较
上一篇《jquery中的each和map详解,别再傻傻分不清》介绍了jquery中$.each()和$.map()的区别。
这里先介绍underscore.js中_.each()与$.each()的区别:
我们先引入jquery和underscore这2个js,然后分别测试以下方法:
test1 = $.each([52, 97], function(index, value) { console.log(index+"="+value); return value*2; }); test3 = _.each([52, 97], function(value, index) { console.log(index+"="+value); return value*2; });
同样的返回值,同样是原来的数组,同样省内存。但是,请看清楚,在underscore中的index和value位置与jquery相反。查看underscore手册可以发现:
each_.each(list, iteratee, [context])
Alias: forEach
遍历list中的所有元素,按顺序用遍历输出每个元素。如果传递了context参数,则把iteratee绑定到context对象上。每次调用iteratee都会传递三个参数:(element, index, list)。如果list是个JavaScript对象,iteratee的参数是(value, key, list))。返回list以方便链式调用。
使用underscore的时候一定要注意iteratee的参数问题。除此之外,_.each()竟然还支持这样的方式:
_.each([1, 2, 3], alert); => alerts each number in turn... _.each({one: 1, two: 2, three: 3}, alert); => alerts each number value in turn...
如果换成jquery是会报错的。
接下来看看$.map()和_.map()的区别:
test2 = $.map([52, 97], function(value, index) { console.log(index+"="+value); return value*2; }); test4 = _.map([52, 97], function(value, index) { console.log(index+"="+value); return value*2; }); console.log(test2); console.log(test4);
这下子参数的顺序就没有区别了,返回新的数组也是预料之中了。不过_.map()的功能相对于$.map()还是强大许多,例如,_.map()还可以这样玩:
_.map([[1, 2], [3, 4]], _.first); => [1, 3]
也就这么点区别了,只要记住jquery的$.each()的参数顺序与其他都不一样就行了,平时使用的时候多多测试。
文章网址:http://blog.zhengshuiguang.com/js/underscore-each-map.html
随意转载^^但请附上教程地址。
评论已关闭