概述

Underscore.js是一个很精干的库，压缩后只有4KB。它提供了几十种函数式编程的方法，大大方便了Javascript的编程。MVC框架backbone.js就是基于这个库。

它定义了一个下划线（_）对象，函数库的所有方法都属于这个对象。这些方法大致上可以分成：集合（collection）、数组（array）、函数（function）、对象（object）和工具（utility）五大类。

在node.js下安装

Underscore.js不仅可以用于浏览器环境，还可以用于node.js。安装命令如下：

代码如下:

score

但是，node.js不能直接使用_作为变量名，因此要用下面的方法使用underscore.js。

代码如下:

score");

与集合有关的方法

Javascript语言的数据集合，包括两种结构：数组和对象。以下的方法同时适用于这两种结构。

map

该方法对集合的每个成员依次进行某种操作，将返回的值依次存入一个新的数组。

代码如下:

each

该方法与map类似，依次对集合的每个成员进行某种操作，但是不返回值。

代码如下:

reduce

该方法依次对集合的每个成员进行某种操作，然后将操作结果累计在某一个初始值之上，全部操作结束之后，返回累计的值。

该方法接受三个参数。第一个参数是被处理的集合，第二个参数是对每个成员进行操作的函数，第三个参数是累计用的变量。

_.reduce([1,function(memo,num){ return memo + num; },0); // 6 reduce方法的第二个参数是操作函数，它本身又接受两个参数，第一个是累计用的变量，第二个是集合每个成员的值。

filter 和 reject

filter方法依次对集合的每个成员进行某种操作，只返回操作结果为true的成员。

代码如下:

reject方法只返回操作结果为false的成员。

代码如下:

every 和 some

every方法依次对集合的每个成员进行某种操作，如果所有成员的操作结果都为true，则返回true，否则返回false。

代码如下:

some方法则是只要有一个成员的操作结果为true，则返回true，否则返回false。

代码如下:

find

该方法依次对集合的每个成员进行某种操作，返回第一个操作结果为true的成员。如果所有成员的操作结果都为false，则返回undefined。

代码如下:

contains

如果某个值在集合内，该方法返回true，否则返回false。

代码如下:

countBy

该方法依次对集合的每个成员进行某种操作，将操作结果相同的成员算作一类，最后返回一个对象，表明每种操作结果对应的成员数量。

代码如下:

shuffle

该方法返回一个打乱次序的集合。

代码如下:

size

该方法返回集合的成员数量。

代码如下:

与对象有关的方法

toArray

该方法将对象转为数组。

代码如下:

pluck

该方法将多个对象的某一个属性的值，提取成一个数组。

代码如下:

与函数相关的方法

bind

该方法绑定函数运行时的上下文，作为一个新函数返回。

代码如下:

请看下面的实例。

代码如下:

bindAll

该方法将某个对象的所有方法（除非特别声明），全部绑定在该对象上面。

代码如下:

score',onClick : function(){ alert('clicked: ' + this.label); },onHover : function(){ console.log('hovering: ' + this.label); } }; _.bindAll(buttonView);

partial

该方法绑定将某个函数与参数绑定，然后作为一个新函数返回。

代码如下:

memoize

该方法缓存一个函数针对某个参数的运行结果。

代码如下:

如果一个函数有多个参数，则需要提供一个hashFunction，用来生成标识缓存的哈希值。

delay

该方法可以将函数推迟指定的时间再运行。

代码如下:

defer

该方法可以将函数推迟到待运行的任务数为0时再运行，类似于setTimeout推迟0秒运行的效果。

代码如下:

throttle

该方法返回一个函数的新版本。连续调用这个新版本的函数时，必须等待一定时间才会触发下一次执行。

代码如下:

函数的新版本 var throttled = _.throttle(updatePosition,100); // 新版本的函数每过100毫秒才会触发一次 $(window).scroll(throttled);

debounce

该方法也是返回一个函数的新版本。每次调用这个新版本的函数，必须与上一次调用间隔一定的时间，否则就无效。它的典型应用是防止用户双击某个按钮，导致两次提交表单。

代码如下:

once

该方法返回一个新版本的函数，使得这个函数只能被运行一次。主要用于对象的初始化。

代码如下:

after

该方法返回一个新版本的函数，这个函数只有在被调用一定次数后才会运行，主要用于确认一组操作全部完成后，再做出反应。

代码如下:

wrap

该方法将一个函数作为参数，传入另一个函数，最终返回前者的一个新版本。

代码如下:

compose

该方法接受一系列函数作为参数，由后向前依次运行，上一个函数的运行结果，作为后一个函数的运行参数。也就是说，将f(g(),h())的形式转化为f(g(h()))。

代码如下:

工具方法

template

该方法用于编译HTML模板。它接受三个参数。

代码如下:

三个参数的含义如下：

templateString：模板字符串 data：输入模板的数据 settings：设置

templateString

模板字符串templateString就是普通的HTML语言，其中的变量使用<%= … %>的形式插入；data对象负责提供变量的值。

代码如下:

Hello World

代码如下:

如果变量的值包含五个特殊字符（& < > ” ‘ /），就需要用<%- … %>转义。

代码如下:

H & W

JavaScript命令可以采用<% … %>的形式插入。下面是判断语句的例子。

代码如下:

" + "<% } %>"; _.template(txt,{word : "Hello World"}) // Hello World

常见的用法还有循环语句。

代码如下:

方法只有第一个参数templateString，省略第二个参数，那么会返回一个函数，以后可以向这个函数输入数据。

代码如下:

!"); t1({ user: "" }) // 'Hello !'

data

templateString中的所有变量，在内部都是obj对象的属性，而obj对象就是指第二个参数data对象。下面两句语句是等同的。

代码如下:

!",{ user: "" }) _.template("Hello <%=obj.user%>!",{ user: "" })

如果要改变obj这个对象的名字，需要在第三个参数中设定。

代码如下:

Title: <%= title %><% } %>",null,{ variable: "data" });

因为template在变量替换时，内部使用with语句，所以上面这样的做法，运行速度会比较快。

原文链接：https://www.f2er.com/js/55564.html

常用方法

上一篇：js实现文字跟随鼠标移动而移动的方下一篇：使用命令对象代替switch语句的写法

猜你在找的JavaScript相关文章

Javascript中的事件冒泡与捕获

事件冒泡和事件捕获起因：今天在封装一个bind函数的时候，发现el.addEventListener函数支...

作者：前端之家时间：2021-02-22

搞懂js中小数运算精度问题原因及解决办法

js小数运算会出现精度问题 js number类型 JS 数字类型只有number类型，number类型相当于其...

作者：前端之家时间：2021-02-22

搞懂：前端跨域问题JS解决跨域问题VUE代理解决跨域问题原理

什么是跨域跨域：广义的跨域包含一下内容： 1.资源跳转（链接跳转，重定向跳转，表单提...

作者：前端之家时间：2021-02-22

前端对base64编码的理解，原生js实现字符base64编码

@ "TOC" 常见对base64的认知(不完全正确) 首先对base64常见的认知，也是...

作者：前端之家时间：2021-02-22

搞懂：MVVM模型以及VUE中的数据绑定数据劫持发布订阅模式

搞懂：MVVM模式和Vue中的MVVM模式 MVVM MVVM ：的缩写，说都能直接说出来：模型，：视图...

作者：前端之家时间：2021-02-22

js判断浏览器是否支持webGL

起因是我之前开发的网页，用到了three.js制作了一个3d的旋转球体效果。在各种浏览器上运行...

作者：前端之家时间：2021-02-14

js判断undefined和null

js判断undefined js判断null js判断null和undefined

作者：前端之家时间：2021-02-14

将文字自动转为banner打印形式的工具

http://patorjk.com/software/taag/

作者：前端之家时间：2021-02-14

聊一聊 bootstrap 的轮播图插件

今天做工作的时候，轻车熟路的做完，又用到了bootstrap的轮播图，觉得有必要安利一下这个插...

作者：前端之家时间：2021-02-14

js实现图片无缝循环跑马灯

html 代码 css js代码 function mylsRunHorseLight() { if (mylsTimer != null) { clearIn...

作者：前端之家时间：2021-02-14

Underscore.js常用方法总结

概述

在node.js下安装

与集合有关的方法

map

each

reduce

filter 和 reject

every 和 some

find

contains

countBy

shuffle

size

与对象有关的方法

toArray

pluck

与函数相关的方法

bind

bindAll

partial

memoize

delay

defer

throttle

debounce

once

after

wrap

compose

工具方法

template

templateString

Hello World

H & W

data

猜你在找的JavaScript相关文章