博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Underscore实例教程
阅读量:6403 次
发布时间:2019-06-23

本文共 2505 字,大约阅读时间需要 8 分钟。

摘要: 是一个轻量级的JavaScript库,提供了许多非常实用的函数。熟练使用Underscore可以更快地写出更简洁的代码。本文将通过一个简单的编程实例,介绍几个常用的Underscore函数。

GitHub地址:

  • 作者:

  • 日期:

图片描述

一. 编程实例

输入数据是一个数组:

["b", "d", "a", "d", "d", "b", "c", "c", "d", "c"];

其中,数组中存在重复的元素。例如,"c"重复了3次。

现在需要根据元素在数组中的重复个数进行排序。通过观察可知,"a"为1个,"b"为2个,"c"为3个,"d"为4个。

因此,输出结果是:

[ 'a', 'b', 'c', 'd' ]

当然,计算机暂时还没办法像人一样通过观察解决问题,所以得敲代码...

问题本身很容易理解,但是代码并不好写。不使用underscore的话,程序是这样的:

var X = ["b", "d", "a", "d", "d", "b", "c", "c", "d", "c"];// 对数组元素进行计数var A = {};for (var i = 0; i < X.length; i++){    var x = X[i];    if (A.hasOwnProperty(X[i]))    {        A[x]++;    }    else    {        A[x] = 1;    }}// 将对象转化为二维数组var B = [];for (var a in A){    B.push([a, A[a]]);}// 根据二维数组的第2列元素进行排序B.sort(    function(a, b)    {        return a[1] - b[1];    });// 获取二维数组的第1列元素var Y = [];for (var i = 0; i < B.length; i++){    Y.push(B[i][0]);}console.log(Y); // [ 'a', 'b', 'c', 'd' ]

虽然我在代码中使用了一些JavasScript自带的库函数例如sort,但是代码仍然比较冗长。

使用了Underscore之后,代码被极大地简化了:

var _ = require("underscore");var X = ["b", "d", "a", "d", "d", "b", "c", "c", "d", "c"];var Y = _.chain(X)    .countBy() // 对数组元素进行计数    .pairs()   // 将对象转化为二维数组    .sortBy(1) // 根据二维数组的第2列元素进行排序    .pluck(0)  // 获取二维数组的第1列元素    .value();  // 获取计算结果console.log(Y); // [ 'a', 'b', 'c', 'd' ]

可知,我使用了4个Underscore函数: ,,和。并且通过将这4个函数依次链接起来,实现了前一段代码中完全相同的功能。

下面,我会依次介绍代码中所使用的Underscore函数。

二. 函数介绍

1.

功能:

  • 对数组中的元素进行计数

实例:

var X = ["b", "d", "a", "d", "d", "b", "c", "c", "d", "c"]; // 输入var Y = _.countBy(X);console.log(Y); // 输出: { b: 2, d: 4, a: 1, c: 3 }

2.

功能:

  • 将对象中的属性与属性值转化为键值对数组

实例:

var X = {    b: 2,    d: 4,    a: 1,    c: 3}; // 输入var Y = _.pairs(X);console.log(Y); // 输出: [ [ 'b', 2 ], [ 'd', 4 ], [ 'a', 1 ], [ 'c', 3 ] ]

3.

功能:

  • 对数组中的元素进行排序;对于二维数组,可以根据某一列的元素值进行排序。

实例:

var X = [    ['b', 2],    ['d', 4],    ['a', 1],    ['c', 3]]; // 输入var Y = _.sortBy(X, 1); // 根据二维数组的第2列进行排序console.log(Y); // 输出: [ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ], [ 'd', 4 ] ]

4.

功能:

  • 获取对象的某个属性的Value列表;或者获取二维数组中的某一列

实例:

var X = [    ['a', 1],    ['b', 2],    ['c', 3],    ['d', 4]]; // 输入var Y = _.pluck(X, 0); // 获取二维数组的第1列console.log(Y); // 输出: [ 'a', 'b', 'c', 'd' ]

5.

功能:

  • 将多个Underscore函数链接起来完成计算任务

var X = ["b", "d", "a", "d", "d", "b", "c", "c", "d", "c"]; // 输入var Y = _.chain(X)    .countBy() // 对数组元素进行计数    .pairs()   // 将对象转化为二维数组    .sortBy(1) // 根据二维数组的第2列元素进行排序    .pluck(0)  // 获取二维数组的第1列元素    .value();  // 获取计算结果console.log(Y); // 输出: [ 'a', 'b', 'c', 'd' ]

很多时候,需要使用多个Underscore函数来完成单个计算任务。类似于Linux中的管道,前一个函数的输出是后一个函数的输入,这时可以通过使用将多个函数链接起来,最后使用获取计算结果。

转载地址:http://zhnea.baihongyu.com/

你可能感兴趣的文章
东大OJ-5到100000000之间的回文质数
查看>>
linux C 快速排序法
查看>>
模仿与创新
查看>>
Python用subprocess的Popen来调用系统命令
查看>>
Java NIO与IO的差别和比較
查看>>
.NET源代码的内部排序实现
查看>>
解决Strict Standards: Only variables should be passed by reference
查看>>
解决JBoss只能通过localhost(127.0.0.1)而不能通过IP访问
查看>>
MS SQL处理双引号(DoubleQuote)函数
查看>>
[智能架构系列]什么是Buddy智能开发框架
查看>>
三十一、关于android camera setParameters出错
查看>>
【收藏】QCIF、 CIF、2CIF、DCIF、D1(4CIF)格式介绍
查看>>
hdu 3836 Equivalent Sets (tarjan缩点)
查看>>
一些iOS高效开源类库(转)
查看>>
JAVA编程心得-JAVA实现CRC-CCITT(XMODEM)算法
查看>>
C# DES加密
查看>>
浅谈Oracle分区表之范围分区
查看>>
IBM Tivoli NetView网管软件实战
查看>>
IPSec逻辑体系架构
查看>>
Exchange 2013部署系列之(六)配置邮件流和客户端访问
查看>>