例:

'use strict';
_.map([1, 2, 3], (x) => x * x); // [1, 4, 9]

No1:

【every/some】

当集合的所有元素都满足条件时,_.every()函数返回true,当集合的至少一个元素满足条件时,_.some()函数返回true

'use strict';
// 所有元素都大于0?
_.every([1, 4, 7, -3, -9], (x) => x > 0); // false
// 至少一个元素大于0?
_.some([1, 4, 7, -3, -9], (x) => x > 0); // true

No2:

【max/min】

'use strict';
var arr = [3, 5, 7, 9];
_.max(arr); //
_.min(arr); // // 空集合会返回-Infinity和Infinity,所以要先判断集合不为空:
_.max([])
-Infinity
_.min([])
Infinity

No3:

【groupBy】

groupBy()把集合的元素按照key归类,key由传入的函数返回:

'use strict';

var scores = [20, 81, 75, 40, 91, 59, 77, 66, 72, 88, 99];
var groups = _.groupBy(scores, function (x) {
if (x < 60) {
return 'C';
} else if (x < 80) {
return 'B';
} else {
return 'A';
}
});
// 结果:
// {
// A: [81, 91, 88, 99],
// B: [75, 77, 66, 72],
// C: [20, 40, 59]
// }

No4:

【shuffle/sample】

shuffle()用洗牌算法随机打乱一个集合

'use strict';
// 注意每次结果都不一样:
_.shuffle([1, 2, 3, 4, 5, 6]); // [3, 5, 4, 6, 2, 1]

sample()则是随机选择一个或多个元素:

'use strict';
// 注意每次结果都不一样:
// 随机选1个:
_.sample([1, 2, 3, 4, 5, 6]); //
// 随机选3个:
_.sample([1, 2, 3, 4, 5, 6], 3); // [6, 1, 4]

No5:

【first/last】

'use strict';
var arr = [2, 4, 6, 8];
_.first(arr); //
_.last(arr); //

No6:

【flatten】

flatten()接收一个Array,无论这个Array里面嵌套了多少个Arrayflatten()最后都把它们变成一个一维数组:

'use strict';

_.flatten([1, [2], [3, [[4], [5]]]]); // [1, 2, 3, 4, 5]

No7:

【zip/unzip】

zip()把两个或多个数组的所有元素按索引对齐,然后按索引合并成新数组。例如,你有一个Array保存了名字,另一个Array保存了分数,现在,要把名字和分数给对上,用zip()轻松实现:

'use strict';

var names = ['Adam', 'Lisa', 'Bart'];
var scores = [85, 92, 59];
_.zip(names, scores);
// [['Adam', 85], ['Lisa', 92], ['Bart', 59]]

unzip()则是反过来:

'use strict';
var namesAndScores = [['Adam', 85], ['Lisa', 92], ['Bart', 59]];
_.unzip(namesAndScores);
// [['Adam', 'Lisa', 'Bart'], [85, 92, 59]]

No8:

【object】

把名字和分数直接对应成Object

'use strict';

var names = ['Adam', 'Lisa', 'Bart'];
var scores = [85, 92, 59];
_.object(names, scores);
// {Adam: 85, Lisa: 92, Bart: 59}

No9:

【range】快速生成一个序列

'use strict';

// 从0开始小于10:
_.range(10); // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] // 从1开始小于11:
_.range(1, 11); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] // 从0开始小于30,步长5:
_.range(0, 30, 5); // [0, 5, 10, 15, 20, 25] // 从0开始大于-10,步长-1:
_.range(0, -10, -1); // [0, -1, -2, -3, -4, -5, -6, -7, -8, -9]

No10:

【bind】bind()可以帮我们把s对象直接绑定在fn()this指针上,以后调用fn()就可以直接正常调用了

'use strict';

var s = ' Hello  ';
var fn = _.bind(s.trim, s);
fn();
// 输出Hello

当用一个变量fn指向一个对象的方法时,直接调用fn()是不行的,因为丢失了this对象的引用。用bind可以修复这个问题。

No11:

【partial】为一个函数创建偏函数

'use strict';

var pow2N = _.partial(Math.pow, 2);
pow2N(3); //
pow2N(5); //
pow2N(10); //

No12:

【memoize】自动缓存函数计算的结果

'use strict';

var factorial = _.memoize(function(n) {
console.log('start calculate ' + n + '!...');
if (n < 2) {
return 1;
}
return n * factorial(n - 1);
}); factorial(10); //
// 输出结果说明factorial(1)~factorial(10)都已经缓存了:
// start calculate 10!...
// start calculate 9!...
// start calculate 8!...
// start calculate 7!...
// start calculate 6!...
// start calculate 5!...
// start calculate 4!...
// start calculate 3!...
// start calculate 2!...
// start calculate 1!... factorial(9); //
// console无输出

No13:

【once】保证某个函数执行且仅执行一次

'use strict';
var register = _.once(function () {
alert('Register ok!');
});
// 测试效果:
register();
register();
register();

No14:

【delay】让一个函数延迟执行

'use strict';

// 2秒后调用alert():
_.delay(alert, 2000);
'use strict';

var log = _.bind(console.log, console);
_.delay(log, 2000, 'Hello,', 'world!');
// 2秒后打印'Hello, world!':

No15:

【keys/allKeys】keys()可以非常方便地返回一个object自身所有的key,但不包含从原型链继承下来的;allKeys()除了object自身的key,还包含从原型链继承下来的:

'use strict';

function Student(name, age) {
this.name = name;
this.age = age;
} var xiaoming = new Student('小明', 20);
_.keys(xiaoming); // ['name', 'age']
'use strict';

function Student(name, age) {
this.name = name;
this.age = age;
}
Student.prototype.school = 'No.1 Middle School';
var xiaoming = new Student('小明', 20);
_.allKeys(xiaoming); // ['name', 'age', 'school']

No16:

【values】返回object自身但不包含原型链继承的所有值

'use strict';

var obj = {
name: '小明',
age: 20
}; _.values(obj); // ['小明', 20]

No17:

【mapObject】针对object的map版本:

'use strict';

var obj = { a: 1, b: 2, c: 3 };
// 注意传入的函数签名,value在前,key在后:
_.mapObject(obj, (v, k) => 100 + v); // { a: 101, b: 102, c: 103

No18:

【invert】把object的每个key-value来个交换,key变成value,value变成key

'use strict';

var obj = {
Adam: 90,
Lisa: 85,
Bart: 59
};
_.invert(obj); // { '59': 'Bart', '85': 'Lisa', '90': 'Adam' }

No19:

【extend/extendOwn】多个object的key-value合并到第一个object并返回:

'use strict';

var a = {name: 'Bob', age: 20};
_.extend(a, {age: 15}, {age: 88, city: 'Beijing'}); // {name: 'Bob', age: 88, city: 'Beijing'}
// 变量a的内容也改变了:
a; // {name: 'Bob', age: 88, city: 'Beijing'}

extendOwn()extend()类似,但获取属性时忽略从原型链继承下来的属性

No20:

【clone】复制

'use strict';
var source = {
name: '小明',
age: 20,
skills: ['JavaScript', 'CSS', 'HTML']
};
var copied = _.clone(source);
console.log(JSON.stringify(copied, null, ' '));

No21:

【isEqual】

'use strict';

var o1 = { name: 'Bob', skills: { Java: 90, JavaScript: 99 }};
var o2 = { name: 'Bob', skills: { JavaScript: 99, Java: 90 }}; o1 === o2; // false
_.isEqual(o1, o2); // true

No22:

【chaining】链式调用

_.filter(_.map([1, 4, 9, 16, 25], Math.sqrt), x => x % 2 === 1);
// [1, 3, 5]
-----》修改
var r = _.chain([1, 4, 9, 16, 25])
.map(Math.sqrt)
.filter(x => x % 2 === 1)
.value();
console.log(r); // [1, 3, 5]

因为每一步返回的都是包装对象,所以最后一步的结果需要调用value()获得最终结果

【JavaScript】underscore的更多相关文章

  1. 【javascript】html5中使用canvas编写头像上传截取功能

    [javascript]html5中使用canvas编写头像上传截取功能 本人对canvas很是喜欢,于是想仿照新浪微博头像上传功能(前端使用canvas) 本程序目前在谷歌浏览器和火狐浏览器测试可用 ...

  2. 【JavaScript】出现即使设置了ID也获取不到的可能原因与window.onload

    有时候.在JavaScript中.即使设置了ID也有可能出现document.getElementById()获取不到的情况,然后你就開始想document是否写错之类的.事实上根本就不是你的代码的大 ...

  3. 【JavaScript】我的JavaScript技术总结第一篇——编程细节

    遍历数组 for (var i=0, l=arr.length; i<l; i++) 这样写的一个好处就是让每次循环少一步获取数组对象长度的操作,数组长度越长,价值越明显. 判断变量的真假 if ...

  4. 【JavaScript】下大雪

    引用[JavaScript]满天星的代码,稍作修改的结果: function drawStars() { for (i = 1; i < 100; ++i) { ctx.fillText(&qu ...

  5. 【JavaScript】JavaScript中的replaceAll

    JavaScript中是没有replaceAll的.仅仅有replace,replace仅仅能替换字符中的第一个字符.并且这个replace里面不支持正則表達式,以达到replaceAll的目的. 只 ...

  6. 【JavaScript】Leetcode每日一题-在D天内送包裹的能力

    [JavaScript]Leetcode每日一题-在D天内送包裹的能力 [题目描述] 传送带上的包裹必须在 D 天内从一个港口运送到另一个港口. 传送带上的第 i 个包裹的重量为 weights[i] ...

  7. 【JavaScript】Leetcode每日一题-青蛙过河

    [JavaScript]Leetcode每日一题-青蛙过河 [题目描述] 一只青蛙想要过河. 假定河流被等分为若干个单元格,并且在每一个单元格内都有可能放有一块石子(也有可能没有). 青蛙可以跳上石子 ...

  8. 【JavaScript】Leetcode每日一题-平方数之和

    [JavaScript]Leetcode每日一题-平方数之和 [题目描述] 给定一个非负整数 c ,你要判断是否存在两个整数 a 和 b,使得 a2 + b2 = c . 示例1: 输入:c = 5 ...

  9. 【JavaScript】Leetcode每日一题-二叉搜索树的范围和

    [JavaScript]Leetcode每日一题-二叉搜索树的范围和 [题目描述] 给定二叉搜索树的根结点 root,返回值位于范围 [low, high] 之间的所有结点的值的和. 示例1: 输入: ...

随机推荐

  1. Idea 调试快捷键

    F9            resume programe 恢复程序 Alt+F10       show execution point 显示执行断点 F8            Step Over ...

  2. Confluence 6 当前使用的数据库状态

    进入  > 基本配置(General Configuration) > 问题检查和支持工具(Troubleshooting and support tools) 你就可以看到当前使用的数据 ...

  3. Confluence 6 后台中为站点添加应用导航

    Confluence 6 后台中为站点添加应用导航的连界面和方法. https://www.cwiki.us/display/CONFLUENCEWIKI/Configuring+the+Site+H ...

  4. Vux使用经验

    Vux使用心得 参考链接 布局 简单平分:水平布局和垂直布局 <template> <divider>Horizontal</divider> <flexbo ...

  5. python之通过thread来实现多进程

    代码如下: import threading, time class Test1(threading.Thread): def __init__(self, name): super().__init ...

  6. javadoc 标签功能

    CMD文档注释编译命令: javadoc -d text Helloword2.java(text 是保存标签文档的文件夹,可以写) javadoc -d doc -encoding UTF-8 -c ...

  7. lightoj1214 大数取模模板

    #include<bits/stdc++.h> using namespace std; #define maxn 300 #define ll long long ll a,b; ]; ...

  8. mysql出现10060错误

    报错内容如下 Can't connect to MySQL server (10060) 提示不能连接 mysql服务. 首先检查任务管理器 看看mysqld.exe进程有没有启动.如果启动了就强制结 ...

  9. 计蒜客 X的平方根(二分法)

    设计函数int sqrt(int x),计算 xx 的平方根. 输入格式 输入一个 整数 xx,输出它的平方根.直到碰到文件结束符(EOF)为止. 输出格式 对于每组输入,输出一行一个整数,表示输入整 ...

  10. Leetcode刷题第20天

    一.找树左下角的值 题目:513. Find Bottom Left Tree Value C++ Soution 1: /** * Definition for a binary tree node ...