这是那位神仙姐姐大哥翻译的啊!
太给力了。虽然一般不看中文文档。嘿嘿
装载于 http://www.css88.com/doc/underscore/
Version (1.2.3)
Underscore 一个非常实用的JavaScript库,提供许多编程功能的支持,就像你期望 Prototype.js (或者 Ruby), 有这些功能且不扩展任何JavaScript的原生对象。 It's the tie to go along with jQuery's tux.
Underscore提供60多个方法,即有普通的功能,例如: map, select, invoke — 也有更多特殊的编程辅助方法,例如:函数绑定、javascript模板、绝对相等判断等待。 如果一些现代的浏览器提供了内置的 forEach, map, reduce, filter, every, some 和 indexOf方法,Underscore就委托给浏览器原生的方法。
Underscore提供完整的测试用例集供你精读。
你也可以阅读有注释的源代码。
项目代码放在GitHub上,你可以通过issues页、Freenode的#documentcloud频道、发送tweets给@documentcloud三个途径报告bug以及参与特性讨论。
Underscore是DocumentCloud的一个开源组件。
下载 (Right-click, and use "Save As")
Development Version (1.2.3) 34kb, Uncompressed with Comments
Production Version (1.2.3) < 4kb, Minified and Gzipped
Table of Contents
Object-Oriented and Functional Styles(面向对象和函数风格)
Collections(收集)
each, map, reduce, reduceRight, find, filter, reject, all, any, include, invoke, pluck, max, min, sortBy, groupBy, sortedIndex, shuffle, toArray, size
Arrays(数组)
first, initial, last, rest, compact, flatten, without, union, intersection, difference, uniq, zip, indexOf, lastIndexOf, range
Functions(函数)
bind, bindAll, memoize, delay, defer, throttle, debounce, once, after, wrap, compose
Objects(对象)
keys, values, functions, extend, defaults, clone, tap, isEqual, isEmpty, isElement, isArray, isArguments, isFunction, isString, isNumber, isBoolean, isDate, isRegExp, isNaN, isNull, isUndefined
Utility(功能)
noConflict, identity, times, mixin, uniqueId, escape, template
Chaining
chain, value
Object-Oriented and Functional Styles
根据自己的喜好,您可以使用下划线在一个面向对象或函数风格,下面的两行代码相同的效果,都是一组数字乘2。
_.map([1, 2, 3], function(n){ return n * 2; });
_([1, 2, 3]).map(function(n){ return n * 2; });
使用面向对象的风格允许您链式调用多个方法。在一个包装对象上调用调用chain,会导致后续所有的方法调用同时返回包装对象。使用value方法得到检索的最终值。这里有一个链式使用map/flatten/reduce的例子,为了获得每个单词在歌词中的数量。
var lyrics = [
{line : 1, words : "I'm a lumberjack and I'm okay"},
{line : 2, words : "I sleep all night and I work all day"},
{line : 3, words : "He's a lumberjack and he's okay"},
{line : 4, words : "He sleeps all night and he works all day"}
];
_(lyrics).chain()
.map(function(line) { return line.words.split(' '); })
.flatten()
.reduce(function(counts, word) {
counts[word] = (counts[word] || 0) + 1;
return counts;
}, {}).value();
=> {lumberjack : 2, all : 4, night : 2 ... }
另外,Array原型的方法通过链式代理Underscore对象, ,所以也能够在链式中使用数组的reverse、push方法修改数组。
Collection Functions (Arrays or Objects)
each_.each(list, iterator, [context]) Alias: forEach
遍历list中的所有元素,按顺序用遍历输出每个元素。如果传递了context参数,则把iterator绑定到context对象上。每次调用iterator都会传递三个参数:(element, index, list)。如果list是个JavaScript对象,iterator的参数是 (value, key, list))。存在原生的forEach方法,Underscore就委托给forEach。
_.each([1, 2, 3], function(num){ alert(num); });
=> alerts each number in turn...
_.each({one : 1, two : 2, three : 3}, function(num, key){ alert(num); });
=> alerts each number in turn...
map_.map(list, iterator, [context])
用转换函数把list中的每个值映射到一个新的数组。存在原生的map方法,就用原生map方法代替。如果list是个JavaScript对象,iterator的参数是(value, key, list)。
_.map([1, 2, 3], function(num){ return num * 3; });
=> [3, 6, 9]
_.map({one : 1, two : 2, three : 3}, function(num, key){ return num * 3; });
=> [3, 6, 9]
reduce_.reduce(list, iterator, memo, [context]) Aliases: inject, foldl
reduce的别名为inject 和 foldl。reduce方法把列表中元素归结为一个简单的数值。Memo是reduce函数的初始值,reduce的每一步都需要由iterator返回。
var sum = _.reduce([1, 2, 3], function(memo, num){ return memo + num; }, 0);
=> 6
reduceRight_.reduceRight(list, iterator, memo, [context]) Alias: foldr
reducRight是从右侧开始组合的元素的reduce函数,如果存在JavaScript 1.8版本的reduceRight,则用其代替。Foldr在javascript中不像其它有懒计算的语言那么有用(lazy evaluation:一种求值策略,只有当表达式的值真正需要时才对表达式进行计算)。
var list = [[0, 1], [2, 3], [4, 5]];
var flat = _.reduceRight(list, function(a, b) { return a.concat(b); }, []);
=> [4, 5, 2, 3, 0, 1]
find_.find(list, iterator, [context]) Alias: detect
遍历list,返回第一个通过iterator真值检测的元素值。如果找到匹配的元素立即返回,不会遍历整个list。
var even = _.find([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
=> 2
filter_.filter(list, iterator, [context]) Alias: select
遍历list,返回包含所有通过iterator真值检测的元素值。如果存在原生filter方法,则委托给filter。。
var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
=> [2, 4, 6]
reject_.reject(list, iterator, [context])
返回那么没有通过iterator真值检测的元素数组,select的相反函数。
var odds = _.reject([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
=> [1, 3, 5]
all_.all(list, iterator, [context]) Alias: every
如果list中的所有元素都通过iterator的真值检测就返回true。如果存在原生的every方法,则委托给every。
_.all([true, 1, null, 'yes'], _.identity);
=> false
any_.any(list, [iterator], [context]) Alias: some
如果有任何一个元素通过通过 iterator 的真值检测就返回true。如果存在原生的some方法,则委托给some
_.any([null, 0, 'yes', false]);
=> true
include_.include(list, value) Alias: contains
如果list包含指定的value则返回true,使用===检测是否相等。如果list 是数组,内部使用indexOf判断。
_.include([1, 2, 3], 3);
=> true
invoke_.invoke(list, methodName, [*arguments])
在list的每个元素上执行methodName方法。任何传递给invoke的额外参数,invoke都会在调用methodName方法的时候传递给它。
_.invoke([[5, 1, 7], [3, 2, 1]], 'sort');
=> [[1, 5, 7], [1, 2, 3]]
pluck_.pluck(list, propertyName)
pluck是map最常使用的用例模型的版本,即萃取对象数组中某属性值,返回一个数组
var stooges = [{name : 'moe', age : 40}, {name : 'larry', age : 50}, {name : 'curly', age : 60}];
_.pluck(stooges, 'name');
=> ["moe", "larry", "curly"]
max_.max(list, [iterator], [context])
返回list中的最大值。如果传递iterator参数,iterator将作为list排序的依据。
var stooges = [{name : 'moe', age : 40}, {name : 'larry', age : 50}, {name : 'curly', age : 60}];
_.max(stooges, function(stooge){ return stooge.age; });
=> {name : 'curly', age : 60};
min_.min(list, [iterator], [context])
返回list中的最小值。如果传递iterator参数,iterator将作为list排序的依据。
var numbers = [10, 5, 100, 2, 1000];
_.min(numbers);
=> 2
sortBy_.sortBy(list, iterator, [context])
返回一个排序后的list。如果有iterator参数,iterator将作为list排序的依据。
_.sortBy([1, 2, 3, 4, 5, 6], function(num){ return Math.sin(num); });
=> [5, 4, 6, 3, 1, 2]
groupBy_.groupBy(list, iterator)
把一个集合分组为多个集合,iterator为分组条件的迭代器
_.groupBy([1.3, 2.1, 2.4], function(num){ return Math.floor(num); });
=> {1: [1.3], 2: [2.1, 2.4]}
_.groupBy(['one', 'two', 'three'], 'length');
=> {3: ["one", "two"], 5: ["three"]}
sortedIndex_.sortedIndex(list, value, [iterator])
使用二分查找确定value在list中的位置序号,value按此序号插入能保持list原有的排序。如果传递iterator参数,iterator将作为list排序的依据
_.sortedIndex([10, 20, 30, 40, 50], 35);
=> 3
shuffle_.shuffle(list)
返回 list 的序的副本,使用 Fisher-Yates shuffle版本
_.shuffle([1, 2, 3, 4, 5, 6]);
=> [4, 1, 6, 3, 5, 2]
toArray_.toArray(list)
把list(任何可以迭代的对象)转换成一个Array,有助于arguments对象的转换。
(function(){ return _.toArray(arguments).slice(0); })(1, 2, 3);
=> [1, 2, 3]
size_.size(list)
返回list的长度。
_.size({one : 1, two : 2, three : 3});
=> 3
Array Functions
注: arguments(参数) 对象将在所有数组函数中工作 。
Note: All array functions will also work on the arguments object.
first_.first(array, [n]) Alias: head
返回array(数组)的第一个元素。传递 n参数将返回数组中从第一个元素开始的n个元素。
_.first([5, 4, 3, 2, 1]);
=> 5
initial_.initial(array, [n])
返回数组中除了最后一个元素外的其他全部元素。尤其用于参数对象。传递 n参数将从结果中排除从最后一个开始的n个元素。
_.initial([5, 4, 3, 2, 1]);
=> [5, 4, 3, 2]
last_.last(array, [n])
返回array(数组)的最后一个元素。传递 n参数将返回数组中从最后一个元素开始的n个元素。
_.last([5, 4, 3, 2, 1]);
=> 1
rest_.rest(array, [index]) Alias: tail
返回数组中除了第一个元素外的其他全部元素。传递 index参数将返回数组中从index开始的新数组。
_.rest([5, 4, 3, 2, 1]);
=> [4, 3, 2, 1]
compact_.compact(array)
返回一个删除所有false值的 array副本。 在javascript中, false, null, 0, "", undefined 和 NaN 都是false值.
_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]
flatten_.flatten(array)
返回一个单嵌套的array(数组)(嵌套可以是任何深度)。
_.flatten([1, [2], [3, [[[4]]]]]);
=> [1, 2, 3, 4];
without_.without(array, [*values])
返回一个删除所有实例值的 array副本。使用===表达式做相等测试。
_.without([1, 2, 1, 0, 3, 1, 4], 0, 1);
=> [2, 3, 4]
union_.union(*arrays)
计算传入的 arrays(数组)并集:按顺序返回一个存在于一个或多个 arrays(数组)中独一无二的项目列表。
_.union([1, 2, 3], [101, 2, 1, 10], [2, 1]);
=> [1, 2, 3, 101, 10]
intersection_.intersection(*arrays)
计算传入的 arrays(数组)交集。结果中的每个值是存在于传入的每个arrays(数组)。
_.intersection([1, 2, 3], [101, 2, 1, 10], [2, 1]);
=> [1, 2]
difference_.difference(array, *others)
类似于without,但从返回的值来自array参数数组,不存在于other 数组.
_.difference([1, 2, 3, 4, 5], [5, 2, 10]);
=> [1, 3, 4]
uniq_.uniq(array, [isSorted], [iterator]) Alias: unique
数组去重,生成无重复的array版本,使用===表达式做相等测试。如果您事先知道该 array 进行已经排序,传递true给isSorted将会更快的算法运行,如果您要计算转变类型的唯一项,可以传递一个iterator 函数。 If you want to compute unique items based on a transformation, pass an iterator function.
_.uniq([1, 2, 1, 3, 1, 4]);
=> [1, 2, 3, 4]
zip_.zip(*arrays)
将 每个相应位置的arrays的值合并在一起。当你有单独的有用数据源时通过匹配数组索引协调。如果您正在使用嵌套的数组矩阵,zip.apply可以转置矩阵相似的方式。
Merges together the values of each of the arrays with the values at the corresponding position. Useful when you have separate data sources that are coordinated through matching array indexes. If you're working with a matrix of nested arrays, zip.apply can transpose the matrix in a similar fashion.
_.zip(['moe', 'larry', 'curly'], [30, 40, 50], [true, false, false]);
=> [["moe", 30, true], ["larry", 40, false], ["curly", 50, false]]
indexOf_.indexOf(array, value, [isSorted])
返回value在该 array 中的索引值,如果value不存在 array中就返回-1。使用原生的indexOf 函数,除非它失效。如果您正在使用一个大数组,你知道数组已经排序,传递true给isSorted将更快的用二进制搜索
_.indexOf([1, 2, 3], 2);
=> 1
lastIndexOf_.lastIndexOf(array, value)
返回value在该 array 中的从最后开始的索引值,如果value不存在 array中就返回-1。如果支持原生的lastIndexOf,将使用原生的lastIndexOf函数。
_.lastIndexOf([1, 2, 3, 1, 2, 3], 2);
=> 4
range_.range([start], stop, [step])
一个用来创建整数灵活编号的列表的函数,便于each 和 map循环。如果省略start则默认为 0;step 默认为 1.返回一个从start 到stop的整数的列表,用step来增加 (或减少)独占。
_.range(10);
=> [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
_.range(1, 11);
=> [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
_.range(0, 30, 5);
=> [0, 5, 10, 15, 20, 25]
_.range(0, -10, -1);
=> [0, -1, -2, -3, -4, -5, -6, -7, -8, -9]
_.range(0);
=> []
Function (uh, ahem) Functions
bind_.bind(function, object, [*arguments])
把一个function绑定给一个object,任何时候调用方法,this都指向此object。随意的给函数绑定参数,预先设置这些参数,也称作currying(加脂法,怎么翻译好呢?)。
var func = function(greeting){ return greeting + ': ' + this.name };
func = _.bind(func, {name : 'moe'}, 'hi');
func();
=> 'hi: moe'
bindAll_.bindAll(object, [*methodNames])
把methodNames参数指定的方法绑定到对象上,这些方法就会在对象的上下文环境中执行。绑定函数用作事件处理函数时非常便利,否则函数被调用时this一点用也没有。如果不设置methodNames参数,对象上的所有方法都会被绑定。
var buttonView = {
label : 'underscore',
onClick : function(){ alert('clicked: ' + this.label); },
onHover : function(){ console.log('hovering: ' + this.label); }
};
_.bindAll(buttonView);
jQuery('#underscore_button').bind('click', buttonView.onClick);
=> When the button is clicked, this.label will have the correct value...
memoize_.memoize(function, [hashFunction])
Memoizes方法可以缓存某函数的计算结果。对于耗时较长的计算很有帮助。如果传递了hashFunction参数,就用hashFunction的返回值作为key存储函数的计算结果。 hashFunction默认使用function的第一个参数作为key
var fibonacci = _.memoize(function(n) {
return n < 2 ? n : fibonacci(n - 1) + fibonacci(n - 2);
});
delay_.delay(function, wait, [*arguments])
delay类似setTimeout,等待wait毫秒后调用function。如果传递可选的参数arguments,当function执行时arguments会传递给function。
var log = _.bind(console.log, console);
_.delay(log, 1000, 'logged later');
=> 'logged later' // Appears after one second.
defer_.defer(function)
延迟调用function直到当前调用栈清空,类似使用延时为0的setTimeout方法。有助于执行开销大的计算和无阻塞UI线程的HTML渲染。
_.defer(function(){ alert('deferred'); });
// Returns from the function before the alert runs.
throttle_.throttle(function, wait)
返回一个像节流阀一样的函数,当重复调用函数的时候,最多每隔wait毫秒调用一次该函数。 对于想控制一些触发频率较高的事件有帮助。
var throttled = _.throttle(updatePosition, 100);
$(window).scroll(throttled);
debounce_.debounce(function, wait)
重复调用一个防反跳的方法,每隔wait毫秒执行一次。所谓防反跳就是setTimeout前先clearTimeout,防止新定时器开始后还执行上次的定时任务。对于必须在一些输入(多是一些用户操作)停止到达后执行的行为有帮助。例如:渲染一个减价评论的预览,window resized后计算布局。
var lazyLayout = _.debounce(calculateLayout, 300);
$(window).resize(lazyLayout);
once_.once(function)
创建一个只能调用一次的函数。重复调用改进的方法也没有效果,还是返回第一次执行的结果。有助于初始化类型的方法,代替过去设置一个boolean标记及后续对标记检测。
var initialize = _.once(createApplication);
initialize();
initialize();
// Application is only created once.
after_.after(count, function)
创建一个某生命体(函数或方法)被调用count次后才可执行的函数。当你想在一组异步请求都返回后执行一段程序时after方法非常有帮助。
var renderNotes = _.after(notes.length, render);
_.each(notes, function(note) {
note.asyncSave({success: renderNotes});
});
// renderNotes is run once, after all notes have saved.
wrap_.wrap(function, wrapper)
把function包装进wrapper方法,function作为第一个参数。允许wrapper在function运行前后执行代码,并且有条件的执行。
var hello = function(name) { return "hello: " + name; };
hello = _.wrap(hello, function(func) {
return "before, " + func("moe") + ", after";
});
hello();
=> 'before, hello: moe, after'
compose_.compose(*functions)
返回一个函数列的组合物,其中每个函数消费其后跟随函数的返回值。在数学关系上,f() g()和h()函数的组合产生f(g(h()))。
var greet = function(name){ return "hi: " + name; };
var exclaim = function(statement){ return statement + "!"; };
var welcome = _.compose(exclaim, greet);
welcome('moe');
=> 'hi: moe!'
Object Functions
keys_.keys(object)
检索object的所有的属性名称。
_.keys({one : 1, two : 2, three : 3});
=> ["one", "two", "three"]
values_.values(object)
返回 object所有的属性的值。
_.values({one : 1, two : 2, three : 3});
=> [1, 2, 3]
functions_.functions(object) Alias: methods
返回对象中的每个方法的名称排序列表 —即是说,每个对象的属性函数的名称。
_.functions(_);
=> ["all", "any", "bind", "bindAll", "clone", "compact", "compose" ...
extend_.extend(destination, *sources)
复制source对象中的所有属性覆盖到destination对象上,他是按照循序的,所以最后源将重写在前面参数相同名称的属性。
_.extend({name : 'moe'}, {age : 50});
=> {name : 'moe', age : 50}
defaults_.defaults(object, *defaults)
用defaults 对象中属性填充object中缺少的属性的默认值。尽快填充属性,进一步的默认值将没有任何效果。
var iceCream = {flavor : "chocolate"};
_.defaults(iceCream, {flavor : "vanilla", sprinkles : "lots"});
=> {flavor : "chocolate", sprinkles : "lots"}
clone_.clone(object)
创建 一个浅复制(浅拷贝)的克隆object。任何嵌套的对象或数组都通过引用拷贝,不会复制。
_.clone({name : 'moe'});
=> {name : 'moe'};
tap_.tap(object, interceptor)
用 object调用interceptor,然后返回object。这种方法的主要目的是"进入"方法链,为了对中间结果链内执行操作。
_([1,2,3,200]).chain().
filter(function(num) { return num % 2 == 0; }).
tap(console.log).
map(function(num) { return num * num }).
value();
=> [2, 200]
=> [4, 40000]
isEqual_.isEqual(object, other)
执行两个对象之间的优化深度比较,确定他们是否应被视为相等。
var moe = {name : 'moe', luckyNumbers : [13, 27, 34]};
var clone = {name : 'moe', luckyNumbers : [13, 27, 34]};
moe == clone;
=> false
_.isEqual(moe, clone);
=> true
isEmpty_.isEmpty(object)
如果object 不包含值,返回true
_.isEmpty([1, 2, 3]);
=> false
_.isEmpty({});
=> true
isElement_.isElement(object)
如果object是一个DOM元素,返回true
_.isElement(jQuery('body')[0]);
=> true
isArray_.isArray(object)
如果object是一个数组,返回true
(function(){ return _.isArray(arguments); })();
=> false
_.isArray([1,2,3]);
=> true
isArguments_.isArguments(object)
如果object是一个参数对象,返回true
(function(){ return _.isArguments(arguments); })(1, 2, 3);
=> true
_.isArguments([1,2,3]);
=> false
isFunction_.isFunction(object)
如果object是一个函数,返回true
_.isFunction(alert);
=> true
isString_.isString(object)
如果object是一个字符串,返回true
_.isString("moe");
=> true
isNumber_.isNumber(object)
如果object是一个数值,返回true
_.isNumber(8.4 * 5);
=> true
isBoolean_.isBoolean(object)
如果object是一个布尔值,返回true
_.isBoolean(null);
=> false
isDate_.isDate(object)
如果object是一个日期时间,返回true
_.isDate(new Date());
=> true
isRegExp_.isRegExp(object)
如果object是一个正则表达式,返回true
_.isRegExp(/moe/);
=> true
isNaN_.isNaN(object)
如果object是 NaN,返回true。
注意: 这和原生的isNaN 函数不一样,如果变量是undefined,原生的isNaN 函数也会返回 true。
_.isNaN(NaN);
=> true
isNaN(undefined);
=> true
_.isNaN(undefined);
=> false
isNull_.isNull(object)
如果object的值是 null,返回true。
_.isNull(null);
=> true
_.isNull(undefined);
=> false
isUndefined_.isUndefined(variable)
如果variable是undefined,返回true。
_.isUndefined(window.missingVariable);
=> true
Utility Functions
noConflict_.noConflict()
放弃Underscore 的控制变量"_"。返回Underscore 对象的引用。
var underscore = _.noConflict();
identity_.identity(value)
返回用作参数的相同值。数学 f(x) = x
此函数查找无用,但使用整个Underscore作为默认的迭代器。
var moe = {name : 'moe'};
moe === _.identity(moe);
=> true
times_.times(n, iterator)
调用给定的迭代函数n次
_(3).times(function(){ genie.grantWish(); });
mixin_.mixin(object)
您可以用您自己的实用程序函数扩展Underscore。传递一个 {name: function}定义的哈希添加到Underscore对象,以及面向对象包装。
_.mixin({
capitalize : function(string) {
return string.charAt(0).toUpperCase() + string.substring(1).toLowerCase();
}
});
_("fabio").capitalize();
=> "Fabio"
uniqueId_.uniqueId([prefix])
为需要的客户端模型或DOM元素生成一个全局唯一的id。如果prefix参数存在, id 将附加给它
_.uniqueId('contact_');
=> 'contact_104'
escape_.escape(string)
转义HTML字符串,替换&, <, >, ", ', and /字符
_.escape('Curly, Larry & Moe');
=> "Curly, Larry & Moe"
template_.template(templateString, [context])
将 JavaScript 模板编译为可以计算用于呈现的函数。 HTML 的复杂的结构用JSON数据源用呈现。模板函数可以是以下两种内部变量:使用<%= … %>,以及用<% … %>执行任意 JavaScript 代码。如果您想插入一个值,它将 HTML 转义,当你使用<%- … %> 评估模板函数,在传递有对应于该模板的属性变量context。如果你在写一次过,你可以传递context作为 template 的第二个参数,以便立即呈现而不是返回的模板函数。
Compiles JavaScript templates into functions that can be evaluated for rendering. Useful for rendering complicated bits of HTML from JSON data sources. Template functions can both interpolate variables, using
<%= … %>, as well as execute arbitrary JavaScript code, with <% … %>. If you wish to interpolate a value, and have it be HTML-escaped, use <%- … %> When you evaluate a template function, pass in a context object that has properties corresponding to the template's free variables. If you're writing a one-off, you can pass the context object as the second parameter to template in order to render immediately instead of returning a template function.
var compiled = _.template("hello: <%= name %>");
compiled({name : 'moe'});
=> "hello: moe"
var list = "<% _.each(people, function(name) { %> <li><%= name %></li> <% }); %>";
_.template(list, {people : ['moe', 'curly', 'larry']});
=> "<li>moe</li><li>curly</li><li>larry</li>"
var template = _.template("<b><%- value %></b>");
template({value : '<script>'});
=> "<b><script></b>"
您还可以使用 JavaScript 代码内print 。这是有时比使用<%= ... %>更方便 .
var compiled = _.template("<% print('Hello ' + epithet); %>");
compiled({epithet: "stooge"});
=> "Hello stooge."
If ERB-style delimiters aren't your cup of tea, 您可以更改下划线的模板设置,使用不同的符号来表示插值的代码。定义 interpolate 正则表达式,和 (可选)evaluate正则表达式来匹配,但是必须分别是inserted 和 evaluated,如果不提供evaluate正则表达式,您的模板将只能够的插补值。 例如, 看看 Mustache.js 样式模板:
_.templateSettings = {
interpolate : /\{\{(.+?)\}\}/g
};
var template = _.template("Hello {{ name }}!");
template({name : "Mustache"});
=> "Hello Mustache!"
Chaining
chain_(obj).chain()
返回一个对象被包装的对象。对象上调用方法将继续以返回被包装的对象,直到 value被使用。 (一个更现实的例子)
var stooges = [{name : 'curly', age : 25}, {name : 'moe', age : 21}, {name : 'larry', age : 23}];
var youngest = _(stooges).chain()
.sortBy(function(stooge){ return stooge.age; })
.map(function(stooge){ return stooge.name + ' is ' + stooge.age; })
.first()
.value();
=> "moe is 21"
value_(obj).value()
提取被包装的对象的值。
_([1, 2, 3]).value();
=> [1, 2, 3]
太给力了。虽然一般不看中文文档。嘿嘿
装载于 http://www.css88.com/doc/underscore/
Version (1.2.3)
Underscore 一个非常实用的JavaScript库,提供许多编程功能的支持,就像你期望 Prototype.js (或者 Ruby), 有这些功能且不扩展任何JavaScript的原生对象。 It's the tie to go along with jQuery's tux.
Underscore提供60多个方法,即有普通的功能,例如: map, select, invoke — 也有更多特殊的编程辅助方法,例如:函数绑定、javascript模板、绝对相等判断等待。 如果一些现代的浏览器提供了内置的 forEach, map, reduce, filter, every, some 和 indexOf方法,Underscore就委托给浏览器原生的方法。
Underscore提供完整的测试用例集供你精读。
你也可以阅读有注释的源代码。
项目代码放在GitHub上,你可以通过issues页、Freenode的#documentcloud频道、发送tweets给@documentcloud三个途径报告bug以及参与特性讨论。
Underscore是DocumentCloud的一个开源组件。
下载 (Right-click, and use "Save As")
Development Version (1.2.3) 34kb, Uncompressed with Comments
Production Version (1.2.3) < 4kb, Minified and Gzipped
Table of Contents
Object-Oriented and Functional Styles(面向对象和函数风格)
Collections(收集)
each, map, reduce, reduceRight, find, filter, reject, all, any, include, invoke, pluck, max, min, sortBy, groupBy, sortedIndex, shuffle, toArray, size
Arrays(数组)
first, initial, last, rest, compact, flatten, without, union, intersection, difference, uniq, zip, indexOf, lastIndexOf, range
Functions(函数)
bind, bindAll, memoize, delay, defer, throttle, debounce, once, after, wrap, compose
Objects(对象)
keys, values, functions, extend, defaults, clone, tap, isEqual, isEmpty, isElement, isArray, isArguments, isFunction, isString, isNumber, isBoolean, isDate, isRegExp, isNaN, isNull, isUndefined
Utility(功能)
noConflict, identity, times, mixin, uniqueId, escape, template
Chaining
chain, value
Object-Oriented and Functional Styles
根据自己的喜好,您可以使用下划线在一个面向对象或函数风格,下面的两行代码相同的效果,都是一组数字乘2。
_.map([1, 2, 3], function(n){ return n * 2; });
_([1, 2, 3]).map(function(n){ return n * 2; });
使用面向对象的风格允许您链式调用多个方法。在一个包装对象上调用调用chain,会导致后续所有的方法调用同时返回包装对象。使用value方法得到检索的最终值。这里有一个链式使用map/flatten/reduce的例子,为了获得每个单词在歌词中的数量。
var lyrics = [
{line : 1, words : "I'm a lumberjack and I'm okay"},
{line : 2, words : "I sleep all night and I work all day"},
{line : 3, words : "He's a lumberjack and he's okay"},
{line : 4, words : "He sleeps all night and he works all day"}
];
_(lyrics).chain()
.map(function(line) { return line.words.split(' '); })
.flatten()
.reduce(function(counts, word) {
counts[word] = (counts[word] || 0) + 1;
return counts;
}, {}).value();
=> {lumberjack : 2, all : 4, night : 2 ... }
另外,Array原型的方法通过链式代理Underscore对象, ,所以也能够在链式中使用数组的reverse、push方法修改数组。
Collection Functions (Arrays or Objects)
each_.each(list, iterator, [context]) Alias: forEach
遍历list中的所有元素,按顺序用遍历输出每个元素。如果传递了context参数,则把iterator绑定到context对象上。每次调用iterator都会传递三个参数:(element, index, list)。如果list是个JavaScript对象,iterator的参数是 (value, key, list))。存在原生的forEach方法,Underscore就委托给forEach。
_.each([1, 2, 3], function(num){ alert(num); });
=> alerts each number in turn...
_.each({one : 1, two : 2, three : 3}, function(num, key){ alert(num); });
=> alerts each number in turn...
map_.map(list, iterator, [context])
用转换函数把list中的每个值映射到一个新的数组。存在原生的map方法,就用原生map方法代替。如果list是个JavaScript对象,iterator的参数是(value, key, list)。
_.map([1, 2, 3], function(num){ return num * 3; });
=> [3, 6, 9]
_.map({one : 1, two : 2, three : 3}, function(num, key){ return num * 3; });
=> [3, 6, 9]
reduce_.reduce(list, iterator, memo, [context]) Aliases: inject, foldl
reduce的别名为inject 和 foldl。reduce方法把列表中元素归结为一个简单的数值。Memo是reduce函数的初始值,reduce的每一步都需要由iterator返回。
var sum = _.reduce([1, 2, 3], function(memo, num){ return memo + num; }, 0);
=> 6
reduceRight_.reduceRight(list, iterator, memo, [context]) Alias: foldr
reducRight是从右侧开始组合的元素的reduce函数,如果存在JavaScript 1.8版本的reduceRight,则用其代替。Foldr在javascript中不像其它有懒计算的语言那么有用(lazy evaluation:一种求值策略,只有当表达式的值真正需要时才对表达式进行计算)。
var list = [[0, 1], [2, 3], [4, 5]];
var flat = _.reduceRight(list, function(a, b) { return a.concat(b); }, []);
=> [4, 5, 2, 3, 0, 1]
find_.find(list, iterator, [context]) Alias: detect
遍历list,返回第一个通过iterator真值检测的元素值。如果找到匹配的元素立即返回,不会遍历整个list。
var even = _.find([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
=> 2
filter_.filter(list, iterator, [context]) Alias: select
遍历list,返回包含所有通过iterator真值检测的元素值。如果存在原生filter方法,则委托给filter。。
var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
=> [2, 4, 6]
reject_.reject(list, iterator, [context])
返回那么没有通过iterator真值检测的元素数组,select的相反函数。
var odds = _.reject([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
=> [1, 3, 5]
all_.all(list, iterator, [context]) Alias: every
如果list中的所有元素都通过iterator的真值检测就返回true。如果存在原生的every方法,则委托给every。
_.all([true, 1, null, 'yes'], _.identity);
=> false
any_.any(list, [iterator], [context]) Alias: some
如果有任何一个元素通过通过 iterator 的真值检测就返回true。如果存在原生的some方法,则委托给some
_.any([null, 0, 'yes', false]);
=> true
include_.include(list, value) Alias: contains
如果list包含指定的value则返回true,使用===检测是否相等。如果list 是数组,内部使用indexOf判断。
_.include([1, 2, 3], 3);
=> true
invoke_.invoke(list, methodName, [*arguments])
在list的每个元素上执行methodName方法。任何传递给invoke的额外参数,invoke都会在调用methodName方法的时候传递给它。
_.invoke([[5, 1, 7], [3, 2, 1]], 'sort');
=> [[1, 5, 7], [1, 2, 3]]
pluck_.pluck(list, propertyName)
pluck是map最常使用的用例模型的版本,即萃取对象数组中某属性值,返回一个数组
var stooges = [{name : 'moe', age : 40}, {name : 'larry', age : 50}, {name : 'curly', age : 60}];
_.pluck(stooges, 'name');
=> ["moe", "larry", "curly"]
max_.max(list, [iterator], [context])
返回list中的最大值。如果传递iterator参数,iterator将作为list排序的依据。
var stooges = [{name : 'moe', age : 40}, {name : 'larry', age : 50}, {name : 'curly', age : 60}];
_.max(stooges, function(stooge){ return stooge.age; });
=> {name : 'curly', age : 60};
min_.min(list, [iterator], [context])
返回list中的最小值。如果传递iterator参数,iterator将作为list排序的依据。
var numbers = [10, 5, 100, 2, 1000];
_.min(numbers);
=> 2
sortBy_.sortBy(list, iterator, [context])
返回一个排序后的list。如果有iterator参数,iterator将作为list排序的依据。
_.sortBy([1, 2, 3, 4, 5, 6], function(num){ return Math.sin(num); });
=> [5, 4, 6, 3, 1, 2]
groupBy_.groupBy(list, iterator)
把一个集合分组为多个集合,iterator为分组条件的迭代器
_.groupBy([1.3, 2.1, 2.4], function(num){ return Math.floor(num); });
=> {1: [1.3], 2: [2.1, 2.4]}
_.groupBy(['one', 'two', 'three'], 'length');
=> {3: ["one", "two"], 5: ["three"]}
sortedIndex_.sortedIndex(list, value, [iterator])
使用二分查找确定value在list中的位置序号,value按此序号插入能保持list原有的排序。如果传递iterator参数,iterator将作为list排序的依据
_.sortedIndex([10, 20, 30, 40, 50], 35);
=> 3
shuffle_.shuffle(list)
返回 list 的序的副本,使用 Fisher-Yates shuffle版本
_.shuffle([1, 2, 3, 4, 5, 6]);
=> [4, 1, 6, 3, 5, 2]
toArray_.toArray(list)
把list(任何可以迭代的对象)转换成一个Array,有助于arguments对象的转换。
(function(){ return _.toArray(arguments).slice(0); })(1, 2, 3);
=> [1, 2, 3]
size_.size(list)
返回list的长度。
_.size({one : 1, two : 2, three : 3});
=> 3
Array Functions
注: arguments(参数) 对象将在所有数组函数中工作 。
Note: All array functions will also work on the arguments object.
first_.first(array, [n]) Alias: head
返回array(数组)的第一个元素。传递 n参数将返回数组中从第一个元素开始的n个元素。
_.first([5, 4, 3, 2, 1]);
=> 5
initial_.initial(array, [n])
返回数组中除了最后一个元素外的其他全部元素。尤其用于参数对象。传递 n参数将从结果中排除从最后一个开始的n个元素。
_.initial([5, 4, 3, 2, 1]);
=> [5, 4, 3, 2]
last_.last(array, [n])
返回array(数组)的最后一个元素。传递 n参数将返回数组中从最后一个元素开始的n个元素。
_.last([5, 4, 3, 2, 1]);
=> 1
rest_.rest(array, [index]) Alias: tail
返回数组中除了第一个元素外的其他全部元素。传递 index参数将返回数组中从index开始的新数组。
_.rest([5, 4, 3, 2, 1]);
=> [4, 3, 2, 1]
compact_.compact(array)
返回一个删除所有false值的 array副本。 在javascript中, false, null, 0, "", undefined 和 NaN 都是false值.
_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]
flatten_.flatten(array)
返回一个单嵌套的array(数组)(嵌套可以是任何深度)。
_.flatten([1, [2], [3, [[[4]]]]]);
=> [1, 2, 3, 4];
without_.without(array, [*values])
返回一个删除所有实例值的 array副本。使用===表达式做相等测试。
_.without([1, 2, 1, 0, 3, 1, 4], 0, 1);
=> [2, 3, 4]
union_.union(*arrays)
计算传入的 arrays(数组)并集:按顺序返回一个存在于一个或多个 arrays(数组)中独一无二的项目列表。
_.union([1, 2, 3], [101, 2, 1, 10], [2, 1]);
=> [1, 2, 3, 101, 10]
intersection_.intersection(*arrays)
计算传入的 arrays(数组)交集。结果中的每个值是存在于传入的每个arrays(数组)。
_.intersection([1, 2, 3], [101, 2, 1, 10], [2, 1]);
=> [1, 2]
difference_.difference(array, *others)
类似于without,但从返回的值来自array参数数组,不存在于other 数组.
_.difference([1, 2, 3, 4, 5], [5, 2, 10]);
=> [1, 3, 4]
uniq_.uniq(array, [isSorted], [iterator]) Alias: unique
数组去重,生成无重复的array版本,使用===表达式做相等测试。如果您事先知道该 array 进行已经排序,传递true给isSorted将会更快的算法运行,如果您要计算转变类型的唯一项,可以传递一个iterator 函数。 If you want to compute unique items based on a transformation, pass an iterator function.
_.uniq([1, 2, 1, 3, 1, 4]);
=> [1, 2, 3, 4]
zip_.zip(*arrays)
将 每个相应位置的arrays的值合并在一起。当你有单独的有用数据源时通过匹配数组索引协调。如果您正在使用嵌套的数组矩阵,zip.apply可以转置矩阵相似的方式。
Merges together the values of each of the arrays with the values at the corresponding position. Useful when you have separate data sources that are coordinated through matching array indexes. If you're working with a matrix of nested arrays, zip.apply can transpose the matrix in a similar fashion.
_.zip(['moe', 'larry', 'curly'], [30, 40, 50], [true, false, false]);
=> [["moe", 30, true], ["larry", 40, false], ["curly", 50, false]]
indexOf_.indexOf(array, value, [isSorted])
返回value在该 array 中的索引值,如果value不存在 array中就返回-1。使用原生的indexOf 函数,除非它失效。如果您正在使用一个大数组,你知道数组已经排序,传递true给isSorted将更快的用二进制搜索
_.indexOf([1, 2, 3], 2);
=> 1
lastIndexOf_.lastIndexOf(array, value)
返回value在该 array 中的从最后开始的索引值,如果value不存在 array中就返回-1。如果支持原生的lastIndexOf,将使用原生的lastIndexOf函数。
_.lastIndexOf([1, 2, 3, 1, 2, 3], 2);
=> 4
range_.range([start], stop, [step])
一个用来创建整数灵活编号的列表的函数,便于each 和 map循环。如果省略start则默认为 0;step 默认为 1.返回一个从start 到stop的整数的列表,用step来增加 (或减少)独占。
_.range(10);
=> [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
_.range(1, 11);
=> [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
_.range(0, 30, 5);
=> [0, 5, 10, 15, 20, 25]
_.range(0, -10, -1);
=> [0, -1, -2, -3, -4, -5, -6, -7, -8, -9]
_.range(0);
=> []
Function (uh, ahem) Functions
bind_.bind(function, object, [*arguments])
把一个function绑定给一个object,任何时候调用方法,this都指向此object。随意的给函数绑定参数,预先设置这些参数,也称作currying(加脂法,怎么翻译好呢?)。
var func = function(greeting){ return greeting + ': ' + this.name };
func = _.bind(func, {name : 'moe'}, 'hi');
func();
=> 'hi: moe'
bindAll_.bindAll(object, [*methodNames])
把methodNames参数指定的方法绑定到对象上,这些方法就会在对象的上下文环境中执行。绑定函数用作事件处理函数时非常便利,否则函数被调用时this一点用也没有。如果不设置methodNames参数,对象上的所有方法都会被绑定。
var buttonView = {
label : 'underscore',
onClick : function(){ alert('clicked: ' + this.label); },
onHover : function(){ console.log('hovering: ' + this.label); }
};
_.bindAll(buttonView);
jQuery('#underscore_button').bind('click', buttonView.onClick);
=> When the button is clicked, this.label will have the correct value...
memoize_.memoize(function, [hashFunction])
Memoizes方法可以缓存某函数的计算结果。对于耗时较长的计算很有帮助。如果传递了hashFunction参数,就用hashFunction的返回值作为key存储函数的计算结果。 hashFunction默认使用function的第一个参数作为key
var fibonacci = _.memoize(function(n) {
return n < 2 ? n : fibonacci(n - 1) + fibonacci(n - 2);
});
delay_.delay(function, wait, [*arguments])
delay类似setTimeout,等待wait毫秒后调用function。如果传递可选的参数arguments,当function执行时arguments会传递给function。
var log = _.bind(console.log, console);
_.delay(log, 1000, 'logged later');
=> 'logged later' // Appears after one second.
defer_.defer(function)
延迟调用function直到当前调用栈清空,类似使用延时为0的setTimeout方法。有助于执行开销大的计算和无阻塞UI线程的HTML渲染。
_.defer(function(){ alert('deferred'); });
// Returns from the function before the alert runs.
throttle_.throttle(function, wait)
返回一个像节流阀一样的函数,当重复调用函数的时候,最多每隔wait毫秒调用一次该函数。 对于想控制一些触发频率较高的事件有帮助。
var throttled = _.throttle(updatePosition, 100);
$(window).scroll(throttled);
debounce_.debounce(function, wait)
重复调用一个防反跳的方法,每隔wait毫秒执行一次。所谓防反跳就是setTimeout前先clearTimeout,防止新定时器开始后还执行上次的定时任务。对于必须在一些输入(多是一些用户操作)停止到达后执行的行为有帮助。例如:渲染一个减价评论的预览,window resized后计算布局。
var lazyLayout = _.debounce(calculateLayout, 300);
$(window).resize(lazyLayout);
once_.once(function)
创建一个只能调用一次的函数。重复调用改进的方法也没有效果,还是返回第一次执行的结果。有助于初始化类型的方法,代替过去设置一个boolean标记及后续对标记检测。
var initialize = _.once(createApplication);
initialize();
initialize();
// Application is only created once.
after_.after(count, function)
创建一个某生命体(函数或方法)被调用count次后才可执行的函数。当你想在一组异步请求都返回后执行一段程序时after方法非常有帮助。
var renderNotes = _.after(notes.length, render);
_.each(notes, function(note) {
note.asyncSave({success: renderNotes});
});
// renderNotes is run once, after all notes have saved.
wrap_.wrap(function, wrapper)
把function包装进wrapper方法,function作为第一个参数。允许wrapper在function运行前后执行代码,并且有条件的执行。
var hello = function(name) { return "hello: " + name; };
hello = _.wrap(hello, function(func) {
return "before, " + func("moe") + ", after";
});
hello();
=> 'before, hello: moe, after'
compose_.compose(*functions)
返回一个函数列的组合物,其中每个函数消费其后跟随函数的返回值。在数学关系上,f() g()和h()函数的组合产生f(g(h()))。
var greet = function(name){ return "hi: " + name; };
var exclaim = function(statement){ return statement + "!"; };
var welcome = _.compose(exclaim, greet);
welcome('moe');
=> 'hi: moe!'
Object Functions
keys_.keys(object)
检索object的所有的属性名称。
_.keys({one : 1, two : 2, three : 3});
=> ["one", "two", "three"]
values_.values(object)
返回 object所有的属性的值。
_.values({one : 1, two : 2, three : 3});
=> [1, 2, 3]
functions_.functions(object) Alias: methods
返回对象中的每个方法的名称排序列表 —即是说,每个对象的属性函数的名称。
_.functions(_);
=> ["all", "any", "bind", "bindAll", "clone", "compact", "compose" ...
extend_.extend(destination, *sources)
复制source对象中的所有属性覆盖到destination对象上,他是按照循序的,所以最后源将重写在前面参数相同名称的属性。
_.extend({name : 'moe'}, {age : 50});
=> {name : 'moe', age : 50}
defaults_.defaults(object, *defaults)
用defaults 对象中属性填充object中缺少的属性的默认值。尽快填充属性,进一步的默认值将没有任何效果。
var iceCream = {flavor : "chocolate"};
_.defaults(iceCream, {flavor : "vanilla", sprinkles : "lots"});
=> {flavor : "chocolate", sprinkles : "lots"}
clone_.clone(object)
创建 一个浅复制(浅拷贝)的克隆object。任何嵌套的对象或数组都通过引用拷贝,不会复制。
_.clone({name : 'moe'});
=> {name : 'moe'};
tap_.tap(object, interceptor)
用 object调用interceptor,然后返回object。这种方法的主要目的是"进入"方法链,为了对中间结果链内执行操作。
_([1,2,3,200]).chain().
filter(function(num) { return num % 2 == 0; }).
tap(console.log).
map(function(num) { return num * num }).
value();
=> [2, 200]
=> [4, 40000]
isEqual_.isEqual(object, other)
执行两个对象之间的优化深度比较,确定他们是否应被视为相等。
var moe = {name : 'moe', luckyNumbers : [13, 27, 34]};
var clone = {name : 'moe', luckyNumbers : [13, 27, 34]};
moe == clone;
=> false
_.isEqual(moe, clone);
=> true
isEmpty_.isEmpty(object)
如果object 不包含值,返回true
_.isEmpty([1, 2, 3]);
=> false
_.isEmpty({});
=> true
isElement_.isElement(object)
如果object是一个DOM元素,返回true
_.isElement(jQuery('body')[0]);
=> true
isArray_.isArray(object)
如果object是一个数组,返回true
(function(){ return _.isArray(arguments); })();
=> false
_.isArray([1,2,3]);
=> true
isArguments_.isArguments(object)
如果object是一个参数对象,返回true
(function(){ return _.isArguments(arguments); })(1, 2, 3);
=> true
_.isArguments([1,2,3]);
=> false
isFunction_.isFunction(object)
如果object是一个函数,返回true
_.isFunction(alert);
=> true
isString_.isString(object)
如果object是一个字符串,返回true
_.isString("moe");
=> true
isNumber_.isNumber(object)
如果object是一个数值,返回true
_.isNumber(8.4 * 5);
=> true
isBoolean_.isBoolean(object)
如果object是一个布尔值,返回true
_.isBoolean(null);
=> false
isDate_.isDate(object)
如果object是一个日期时间,返回true
_.isDate(new Date());
=> true
isRegExp_.isRegExp(object)
如果object是一个正则表达式,返回true
_.isRegExp(/moe/);
=> true
isNaN_.isNaN(object)
如果object是 NaN,返回true。
注意: 这和原生的isNaN 函数不一样,如果变量是undefined,原生的isNaN 函数也会返回 true。
_.isNaN(NaN);
=> true
isNaN(undefined);
=> true
_.isNaN(undefined);
=> false
isNull_.isNull(object)
如果object的值是 null,返回true。
_.isNull(null);
=> true
_.isNull(undefined);
=> false
isUndefined_.isUndefined(variable)
如果variable是undefined,返回true。
_.isUndefined(window.missingVariable);
=> true
Utility Functions
noConflict_.noConflict()
放弃Underscore 的控制变量"_"。返回Underscore 对象的引用。
var underscore = _.noConflict();
identity_.identity(value)
返回用作参数的相同值。数学 f(x) = x
此函数查找无用,但使用整个Underscore作为默认的迭代器。
var moe = {name : 'moe'};
moe === _.identity(moe);
=> true
times_.times(n, iterator)
调用给定的迭代函数n次
_(3).times(function(){ genie.grantWish(); });
mixin_.mixin(object)
您可以用您自己的实用程序函数扩展Underscore。传递一个 {name: function}定义的哈希添加到Underscore对象,以及面向对象包装。
_.mixin({
capitalize : function(string) {
return string.charAt(0).toUpperCase() + string.substring(1).toLowerCase();
}
});
_("fabio").capitalize();
=> "Fabio"
uniqueId_.uniqueId([prefix])
为需要的客户端模型或DOM元素生成一个全局唯一的id。如果prefix参数存在, id 将附加给它
_.uniqueId('contact_');
=> 'contact_104'
escape_.escape(string)
转义HTML字符串,替换&, <, >, ", ', and /字符
_.escape('Curly, Larry & Moe');
=> "Curly, Larry & Moe"
template_.template(templateString, [context])
将 JavaScript 模板编译为可以计算用于呈现的函数。 HTML 的复杂的结构用JSON数据源用呈现。模板函数可以是以下两种内部变量:使用<%= … %>,以及用<% … %>执行任意 JavaScript 代码。如果您想插入一个值,它将 HTML 转义,当你使用<%- … %> 评估模板函数,在传递有对应于该模板的属性变量context。如果你在写一次过,你可以传递context作为 template 的第二个参数,以便立即呈现而不是返回的模板函数。
Compiles JavaScript templates into functions that can be evaluated for rendering. Useful for rendering complicated bits of HTML from JSON data sources. Template functions can both interpolate variables, using
<%= … %>, as well as execute arbitrary JavaScript code, with <% … %>. If you wish to interpolate a value, and have it be HTML-escaped, use <%- … %> When you evaluate a template function, pass in a context object that has properties corresponding to the template's free variables. If you're writing a one-off, you can pass the context object as the second parameter to template in order to render immediately instead of returning a template function.
var compiled = _.template("hello: <%= name %>");
compiled({name : 'moe'});
=> "hello: moe"
var list = "<% _.each(people, function(name) { %> <li><%= name %></li> <% }); %>";
_.template(list, {people : ['moe', 'curly', 'larry']});
=> "<li>moe</li><li>curly</li><li>larry</li>"
var template = _.template("<b><%- value %></b>");
template({value : '<script>'});
=> "<b><script></b>"
您还可以使用 JavaScript 代码内print 。这是有时比使用<%= ... %>更方便 .
var compiled = _.template("<% print('Hello ' + epithet); %>");
compiled({epithet: "stooge"});
=> "Hello stooge."
If ERB-style delimiters aren't your cup of tea, 您可以更改下划线的模板设置,使用不同的符号来表示插值的代码。定义 interpolate 正则表达式,和 (可选)evaluate正则表达式来匹配,但是必须分别是inserted 和 evaluated,如果不提供evaluate正则表达式,您的模板将只能够的插补值。 例如, 看看 Mustache.js 样式模板:
_.templateSettings = {
interpolate : /\{\{(.+?)\}\}/g
};
var template = _.template("Hello {{ name }}!");
template({name : "Mustache"});
=> "Hello Mustache!"
Chaining
chain_(obj).chain()
返回一个对象被包装的对象。对象上调用方法将继续以返回被包装的对象,直到 value被使用。 (一个更现实的例子)
var stooges = [{name : 'curly', age : 25}, {name : 'moe', age : 21}, {name : 'larry', age : 23}];
var youngest = _(stooges).chain()
.sortBy(function(stooge){ return stooge.age; })
.map(function(stooge){ return stooge.name + ' is ' + stooge.age; })
.first()
.value();
=> "moe is 21"
value_(obj).value()
提取被包装的对象的值。
_([1, 2, 3]).value();
=> [1, 2, 3]
相关推荐
Underscore.js是一款轻量级的JavaScript实用库,它提供了许多功能强大的函数,用于处理数组、对象、函数等,极大地增强了JavaScript的编程体验。在深入理解这个库之前,我们需要了解其核心理念:提供一套一致的方法...
Underscore.js是目前最好用的Javascript工具包,提供了100多个函数。Underscore.php是Underscore.js的PHP移植版,并且实现了部分Underscore.js中的功能! 我花了一个月的时间将Underscore.php的文档翻译为中文,开源...
underscore.js api文档 chm
underscore.js是一款轻量级的JavaScript实用库,它为JavaScript开发提供了大量的实用函数,极大地增强了原生JavaScript对象的处理能力。在"underscore-1.6.0.zip"这个压缩包中,包含的就是underscore库的1.6.0版本。...
在软件开发中,JavaScript的underscore.js库因其强大的功能和简洁的API而广受开发者喜爱。它提供了许多实用的函数,如数组操作、对象处理以及函数编程的支持,极大地提高了开发效率。然而,在Java世界里,特别是在...
underscore.js,作为一款轻量级的JavaScript库,它提供了一整套实用的功能,旨在简化和优化JavaScript开发中的常见任务。在本文中,我们将深入探讨underscore.js的核心特性、设计理念以及如何在实际项目中有效地利用...
Underscore.js,一个轻量级的JavaScript实用库,以其强大的工具集和对JavaScript原生功能的补充,深受开发者喜爱。在本篇文章中,我们将深入探讨Underscore 1.4.3版本中的关键特性、设计理念以及如何在实际项目中...
Backbone.js是一款轻量级的JavaScript库,专为构建丰富的Web应用程序而设计。它通过提供模型(Models)、视图(Views)、集合(Collections)和路由器(Routers)等核心概念,帮助开发者组织代码并实现MVC(Model-...
Underscore.php Underscore.php是一个PHP端口 。 除了移植Underscore的功能外,Underscore.php还... 感谢Jeremy Ashkenas和Underscore.js的所有贡献者。 有关文档,许可证,测试,更改日志和下载的信息,请参见: :
《深入解析 underscore.js:一个强大的JavaScript工具库》 在JavaScript的世界里,underscore.js 是一个备受推崇的工具库,它提供了大量的实用函数,帮助开发者更高效地处理数组、对象、函数等核心JavaScript数据...
JavaScript、jQuery和Underscore.js是Web开发中的三个重要库,它们为前端开发者提供了丰富的功能和便利性。这里,我们详细探讨这三个库的核心概念、用途和API。 首先,JavaScript是Web开发的基础,它是一种轻量级的...
Underscore.js是一款轻量级的JavaScript实用库,它提供了大量的函数式编程工具,使得JavaScript开发者能够更加高效地处理数组、对象、函数等数据结构。作为一款广受欢迎的库,其源码充满了智慧和设计精巧的实现,是...
《流星的Underscore.String——JavaScript中的字符串处理利器》 在JavaScript编程中,字符串操作是一项常见且重要的任务。为了简化这一过程,开发人员通常会利用各种库和工具,其中之一便是`meteor-underscore....
"Typescript-Type-Ahead-Binding-and-Filter-with-Knoc.pdf" 这个文件名暗示我们有一个PDF文档,详细介绍了如何在Typescript项目中进行预填充绑定(Type-Ahead Binding)和过滤操作,同时使用了Knockout.js库。...
### Underscore.js API 文档概述 #### 一、引言 Underscore.js 是一个功能强大的 JavaScript 工具库,它提供了大量的函数式编程支持,这些支持在 Prototype.js 或 Ruby 中是常见的,但并未扩展任何内置的 ...
在现代数据分析和可视化领域,D3.js(Data-Driven Documents)是一个强大的JavaScript库,它允许开发人员结合数据和DOM(文档对象模型)来创建动态且交互式的图表。在给定的项目“ForestSpecies_Dendrogram_D3”中,...
Backbone.js是一款轻量级的JavaScript库,专为构建可扩展的、结构化的Web应用而设计。它提供了模型-视图-控制器(MVC)架构,帮助开发者在处理复杂的数据和用户交互时保持代码的组织性和可维护性。在"backbone.js ...
Backbone.js 建立在 jQuery 和 Underscore.js 之上,因此它可以无缝集成到已经使用这些库的项目中。此外,它还支持通过 RESTful JSON 接口与服务器通信,使得前后端之间的数据交换更加高效。 #### 二、通过 Hello...
"Unity3D_EggArray" 是一个针对C#编程语言的库,其灵感来源于JavaScript中的underscore.js库。这个库的目标是为C#程序员提供与underscore.js类似的实用函数,以便在C#环境中实现便捷的数据操作。 首先,让我们深入...