中文 - https://www.lodashjs.com/docs/latest
英文- https://lodash.com/docs/4.17.15
1、作用lodash是一套工具库,内部封装了很多字符串、数组、对象等常见数据类型的处理函数。
2、组成lodash :全部功能
lodash.core:只有核心的一些函数,详细见这儿https://github.com/lodash/lod...
lodash.fp :全部功能的函数式实现,文档见 https://github.com/lodash/lodash/wiki/FP-Guide
lodash.fp 暂不介绍(待写)
3、竞品比较Lodash最初是 Underscore 的分支,后来逐渐壮大后自立门户。
Lodash 功能比 Underscore 更丰富,且 Underscore 已有3、4年没有更新,所以推荐使用 Loadash。
二、安装 1、browser <script src="http://www.likecs.com/lodash.js"></script>CDN:
https://cdn.jsdelivr.net/npm/lodash@4.17.15/lodash.min.js
2、Node.jsnpm i lodash
// Load the full build. var _ = require('lodash'); // Load the core build. var _ = require('lodash/core'); // Load method categories. var array = require('lodash/array'); // Load method. var chunk = require('lodash.chunk'); 三、使用注:本人装的是 latest 版本,_.VERSION可查看版本号,为4.17.15。
下面介绍的方法,是一些我认为属于重难点的、常用的。并有一些解释借鉴了 underscore 文档。
1、Array (1)集合运算intersection - 交集
union - 并集
difference - ( A - B )
xor - 只要一个元素出现两次及以上,则 remove 掉,其他的元素合并成一个新数组。
(2)differencedifference - 没有第三个参数
differenceBy - 第三个参数传的是 iteratee (value)
differenceWith - 第三个参数传的是 comparator (arrVal, othVal)
// 1、difference _.difference([3, 2, 1], [4, 2]); // => [3, 1] // 2、differenceBy _.differenceBy([3.1, 2.2, 1.3], [4.4, 2.5], Math.floor); // => [3.1, 1.3] // 3、differenceWith var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }]; _.differenceWith(objects, [{ 'x': 1, 'y': 2 }], _.isEqual); // => [{ 'x': 2, 'y': 1 }]注:x、xBy、xWith 这三种模式在别的很多方法中也有体现。如 pullAll / pullAllBy / pullAllWith。
(3)dropdrop - 从数组左边 remove 元素,可指定个数
dropRight - 从数组右边 remove 元素,可指定个数
dropWhile - 从数组左边 按条件 remove 元素,遇到条件不符合则终止
dropRightWhile - 从数组右边 按条件 remove 元素,遇到条件不符合则终止
这里是 遇到条件不符合则终止,若想 遇到条件不符合不终止,也就没有左右之分,一律用 filter 替换即可。
注:x、xWhile 这两种模式在别的很多方法中也有体现。如 zip / zipWith。
(4)几种 删数组元素的方法1、提供另一些 元素/数组/索引 来删除
without(提供元素)- 不改变原数组
difference(提供数组) - 不改变原数组
pull(提供元素)/pullAll(提供数组)/ pullAt (提供索引)- 改变了原数组
2、单纯针对原数组去删除
filter - 不改变原数组
remove - 改变了原数组
所以 lodash 提供的方法也不都是 Immutable 的。
(5)remove 类空值remove 掉: false, null, 0, "", undefined, 和 NaN 。
_.compact([0, 1, false, 2, '', 3]);// => [1, 2, 3] 2、Collection集合函数能在数组,对象,和类数组对象,比如 arguments, NodeList 和类似的数据类型 (如 string) 上正常工作。
但是它通过鸭子类型工作,所以要避免传递一个不固定length属性的对象。
拓展:什么是鸭子类型?原话:“当看到一只鸟走起来像鸭子、游泳起来像鸭子、叫起来也像鸭子,那么这只鸟就可以被称为鸭子。”
所以鸭子类型关注点在对象的行为,而不是类型。
怎么有种 “不管黑猫白猫,抓住老鼠就是好猫” 的既视感。
(1)判断every - 全都符合返回 true
some - 只要一条符合返回 true
注意:上面对空集合还是会返回 true。
(2)筛选filter - 正
reject - 反
partition - 同时输出正与反
(3)排序sortBy - 只能升序
orderBy - 可升序可降序
(4)遍历forEach / forEachRight
_([1, 2]).forEach(function(value) { console.log(value); }); // => Logs `1` then `2`. _.forEach({ 'a': 1, 'b': 2 }, function(value, key) { console.log(key); }); // => Logs 'a' then 'b' (iteration order is not guaranteed). (5)遍历输出map
invokeMap - this 相当于 map 的 item,此外还可以额外传入多个参数参与运算
function square(item) { return item * item; } function invokeSquare(n, m) { return this * n * m; } re1 = _.map([1, 2], square); re2 = _.invokeMap([1, 2], invokeSquare, 2, 3); console.log(re1); // [ 1, 4 ] console.log(re2); // [ 6, 12 ]还有类似 map 的 flatMap/flatMapDeep/flatMapDepth ,在 map 的基础上实现扁平化。
(6)聚合countBy - 只算出现的次数
groupBy - 囊括出现的内容
keyBy - 自定义程度更高
(7)迭代归纳reduce 和transform