underscore学习笔记—实用功能/Utility

来源:互联网 发布:如何更改淘宝账号名 编辑:程序博客网 时间:2024/05/22 18:22

写在前面:

1.5.2版本,计10个函数

1、noConflict(转换_控制变量)

_.noConflict()

放弃Underscore 的控制变量"_"。返回Underscore 对象的引用。

var underscore = _.noConflict();

2、identity(返回传入参数相等的值)

返回与传入参数相等的值. 相当于数学里的: f(x) = x
这个函数看似无用, 但是在Underscore里被用作默认的迭代器iterator.

var moe = {name: 'moe'};moe === _.identity(moe);=> true

3、times(调用n次迭代函数)

_.times(n, iterator, [context])

调用给定的迭代函数n次,每一次传递index参数,调用迭代函数。

_.times(3, alert);=>0,1,2

或者链式语法:

_(3).times(function(n){ genie.grantWishNumber(n); });

4、random(随机整数)

_.random(min,max)

返回一个min 和 max之间的随机整数。如果你只传递一个参数,那么将返回0和这个参数之间的整数。

_.random(0, 100);=> 42

5、mixin(扩展underscore)

_.mixin(object)

可以用自己的函数扩展underscore。传递一个 {name: function}定义的哈希添加到Underscore对象,以及面向对象封装。

_.mixin({  capitalize: function(string) {    return string.charAt(0).toUpperCase() + string.substring(1).toLowerCase();  }});_("fabio").capitalize();=> "Fabio"

6、uniqueId(生成唯一ID)

_.uniqueId([prefix])

为需要的客户端或DOM元素生成一个全局唯一的id。如果prefix存在,则作为id前缀

_.uniqueId('contact_');=> 'contact_104'

7、escape(转义html字符串)

_.escape(string)

&<>"', and /字符

_.escape('Curly, Larry & Moe');=> "Curly, Larry & Moe"

8、unescape(转义成html字符)

_.unescape(string)

替换&&lt;&gt;&quot;&#x27;, and&#x2F;字符。

_.unescape('Curly, Larry & Moe');=> "Curly, Larry & Moe"

9、result(调用对象属性)

_.result(object, property)

如果对象 object 中的属性 property 是函数, 则调用它, 否则, 返回它。

var object = {cheese: 'crumpets', stuff: function(){ return 'nonsense'; }};_.result(object, 'cheese');=> "crumpets"_.result(object, 'stuff');=> "nonsense"

10、template(模板)

_.template(templateString, [data], [settings]) 

将 JavaScript 模板编译为可以用于页面呈现的函数, 对于通过JSON数据源生成复杂的HTML并呈现出来的操作非常有用

<%= … %>插入变量

<% … %>执行任意的 JavaScript 代码

<%- … %>插入一个值, 并让其进行HTML转义

data传值给模板,这样模板就会立即呈现而不是返回一个模板函数

settings 是一个哈希表包含任何可以覆盖的设置 _.templateSettings.

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"
如果ERB式的分隔符您不喜欢, 您可以改变Underscore的模板设置, 使用别的符号来嵌入代码. 定义一个 interpolate 正则表达式来逐字匹配 嵌入代码的语句, 如果想插入转义后的HTML代码 则需要定义一个 escape 正则表达式来匹配, 还有一个 evaluate 正则表达式来匹配 您想要直接一次性执行程序而不需要任何返回值的语句. 您可以定义或省略这三个的任意一个. 例如, 要执行 Mustache.js 类型的模板:

_.templateSettings = {  interpolate: /\{\{(.+?)\}\}/g};var template = _.template("Hello {{ name }}!");template({name: "Mustache"});=> "Hello Mustache!"
默认的, template 通过 with 语句 来取得 data 所有的值. 当然, 您也可以在 variable 设置里指定一个变量名. 这样能显著提升模板的渲染速度.

_.template("Using 'with': <%= data.answer %>", {answer: 'no'}, {variable: 'data'});=> "Using 'with': no"
预编译模板对调试不可重现的错误很有帮助. 这是因为预编译的模板可以提供错误的代码行号和堆栈跟踪, 有些模板在客户端(浏览器)上是不能通过编译的 在编译好的模板函数上, 有 source 属性可以提供简单的预编译功能.

<script>  JST.project = <%= _.template(jstText).source %>;</script>

0 0
原创粉丝点击