lodash 学习笔记

什么是 lodash

Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。

为什么要用 lodash

JS 先天提供的功能不够丰富
Lodash 对 JS 的这种不足提供了补充,它将一些常用的功能进行了封装
Lodash 通过降低array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单
支持最新的运行环境,兼容性好

特点

Lodash 的大部分函数都不会再原有的数据上进行操作, 而是复制出一个新的数据而不改变原有数据

使用

安装

首先终端执行 npm i -g npm, 如果报错提示 permission denied, 在命令前加上 sudo, 回车输入密码,再回车等待安装完成即可
然后终端执行npm i --save lodash,执行成功就安装好了

引用

安装完成后就可以在需要的文件中引入: import _ from 'lodash'

使用

在需要使用的地方直接_.***(lodash 方法)就好, 比如 _.uniq([1,1,2,2,3])

常用函数

字符串

camelCase([string='']),转换字符串 string 为驼峰写法

_.camelCase('Foo Bar');// => 'fooBar'
_.camelCase('--foo-bar--');// => 'fooBar'
_.camelCase('__FOO_BAR__');// => 'fooBar'

capitalize([string='']), 转换字符串 string 首字母为大写,剩下为小写
endWith([string=''],[target],[position=string.length]),检查字符串 string 是否以给定的 target 字符串结尾
escape([string='']),转义 string 中的&、<、>、""、""、"`"字符为 HTML实体字符
escapeRegExp([string='']),转义 RegExp 字符串中特殊的字符 "^", "$", "", ".", "*", "+", "?", "(", ")", "[", "]", ", ", 和 "|"
unescape([string='']), escape的反向版。这个方法转换string字符串中的 HTML 实体&amp, &lt, &gt, &quot, &#39, 和 &#96 为对应的字符。
lowerCase([string="]),转换字符串 string 以空格分开单词,并转换为小写
lowerFirst([string='']),转换字符串 string 的首字母为小写
replace([string=''],pattern,replacement),替换 string 字符串中匹配的 pattern 为给定的 replacement
_.replace('Hi Fred', 'Fred', 'Barney');// 'Hi Barney'
split([string=''], separator, [limit]), 根绝 separator 拆分字符串 string,limit 为限制结果的数量
_.split('a-b-c', '-', 2);// ['a', 'b']
startWith([string=''], [target], [position=0]), 检查字符串 string 是否以 target 开头
_.startsWith('abc', 'a');// true
toLower([string='']), 转换整个 string 字符串的字符为小写
toUpper([string='']), 转换整个 string 字符串的字符为小写
trim([string='', [chars=whitespace]),从 string 字符串中移除前面和后面的空格或指定的字符
trimEnd([string='', [chars=whitespace]),从 string 字符串中移除后面的空格或指定的字符
trimStart([string='', [chars=whitespace]),从 string 字符串中移除前面的空格或指定的字符
upperCase([string='']),转换字符串 String 为空格分隔的大写单词
_.upperCase('--foo-bar');// 'FOO BAR'
upperFirst([string='']),转换字符串 string 的首字母为大写

_.upperFirst('fred'); // 'Fred'
_.upperFirst('FRED'); // 'FRED'

words([string=''],[pattern]),拆分字符串 string 中的词为数组

数组

chunk(array, [size=1]), 将数组切分

const arr = [1,2,3,4,5,6,7,8,9];
_chunk(arr,2) // [[1,2],[3,4],[5,6],[7,8],[9]]

compact(array), 剔除数组中的非假值元素,假值元素包括false、null、0、''、undefined、NaN
_.compact([0, 1, false, 2, '', 3]);
concat(array, [values]), 将 array与任何数组或值连接在一起

var other = _.concat(array, 2, [3], [[4]]); // [1, 2, 3, [4]]

difference(array,[values]), 将 values 中包含的元素从 array 中剔除
_.difference([3, 2, 1], [4, 2]);// [3, 1]
drop(array,[n=1]),去除 array 中的前 n 个元素
_.drop([1, 2, 3], 2);
dropRight(array,[n=1]) 去除 array 尾部的 n 个元素
_.dropRight([1, 2, 3], 2);
fill(array,value,[start=0],[end=array.length]), 从 start 开始到 end 结束(不包括 end),使用 value 填充
_.fill([4, 6, 8, 10], '*', 1, 3); // [4, '*', '*', 10]
indexOf(array,value,[fromIndex=0]), 返回首次value在数组 array中被找到的索引值，如果fromIndex为负值，将从数组array尾端引进行匹配。
_.indexOf([1, 2, 1, 2], 2, 2); // 3
join(array, [separator=","]), 将 array 中的所有元素转换为由 separator 分隔的字符串
_.join(['a', 'b', 'c'], '~');// 'a~b~c'
last(array),获取 array 中的最后一个元素
_.last([1, 2, 3]);// => 3
pull(array,[values]), 移除数组 array 中所有和给定值相等的元素

var array = [1, 2, 3, 1, 2, 3];
_.pull(array, 2, 3);
console.log(array); // [1,1]

pullAll(array,values),将 values 中包含的所有值都从 array 中移除

var array = [1, 2, 3, 1, 2, 3];
_.pullAll(array, [2, 3]);
console.log(array);
remov(array, [predicate=_.identity]),移除数组中predicate（断言）返回为真值的所有元素 
var array = [1, 2, 3, 4];
var evens = _.remove(array, function(n) {
  return n % 2 == 0;
});
console.log(array); //  [1, 3]

reverse(array) ,数组反转

集合

countBy(collection,[iteratee=_.identity])创建一个组成对象，key（键）是经过iteratee（迭代函数）执行处理collection中每个元素后返回的结果，每个key（键）对应的值是 iteratee（迭代函数）返回该key（键）的次数（注：迭代次数）
_.countBy(['one', 'two', 'three'], 'length');// { '3': 2, '5': 1 }
each/forEach(collection, iteratee=_.identity),调用 iteratee 便利 collection 中的每个元素,iteratee 调用三个参数(value,index|key,collection).如果迭代函数 iteratee 显式的返回 false,迭代会提前退出,迭代的顺序是不确定的

_.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
  console.log(key);  // 'a'  'b'
});

eachRight/forEachRight(collection, iteratee=_.identity), 从后开始遍历
every(collection, [predicate=_.identity]),通过 predicate 检查 collection 中的所有元素是否都返回真值,一旦返回假值,迭代马上停止
filter(collection, predicate=_.identity),遍历 collection 元素,返回 predicate 返回真值的所有元素的数组,predicate调用三个参数(value,index|key,collection)

var users = [
  { 'user': 'barney', 'age': 36, 'active': true },
  { 'user': 'fred',   'age': 40, 'active': false }
];
_.filter(users, function(o) { return !o.active; });// objects for ['fred']

find(collection, [predicate=_.identity],[fromIndex=0]), 遍历 collection ,返回 predicate 第一个返回真值的元素,predicate 调用三个参数(value,index|key,collection)

var users = [
  { 'user': 'barney',  'age': 36, 'active': true },
  { 'user': 'fred',    'age': 40, 'active': false },
  { 'user': 'pebbles', 'age': 1,  'active': true }
];
_.find(users, function(o) { return o.age < 40; });//  object for 'barney'

findLast(collection,[predicate=_.identity],[fromIndex=collection.length-1]),从尾部开始找
groupBy(collection, iteratee=_.identity),创建一个对象,key是 iteratee 遍历 collection 中的每个元素返回的结果,分组值的顺序是由他们出现在 collection 中的顺序确定的,没个键对应的值负责生成 key 的元素组成的数组

_.groupBy(['one', 'two', 'three'], 'length');//  { '3': ['one', 'two'], '5': ['three'] }

includes(collection,value,[fromIndex=0]), 从指定的位置开始检查该集合是否包含给定的元素

_.includes([1, 2, 3], 1, 2);//  false

map(collection,[iteratee=_.identity]),将迭代函数 iteratee 返回的结果作为一个数组返回

_.map([4, 8], (value)=>{
return value*value;
}; //  [16, 64]

orderBy(collection,[iteratees=[_.identity]],[orders]),根据 iteratee 结果进行排序, 如果没有指定 orders,默认以升序排序,否者,指定为'desc'降序,或者指定'asc'升序,排序对应值

var users = [
  { 'user': 'fred',   'age': 48 },
  { 'user': 'barney', 'age': 34 },
  { 'user': 'fred',   'age': 40 },
  { 'user': 'barney', 'age': 36 }
];
// 以 `user` 升序排序 再  `age` 以降序排序。
_.orderBy(users, ['user', 'age'], ['asc', 'desc']);// objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]

reduce(collection, [iteratee=_.identity],[accumulator]), 通过 iteratee 遍历 collection 中的每个元素,每次返回的值会作为下一次迭代的第一个参数使用,如果没有提供 accumulator,则 collection 中的第一个元素作为初始值,iteratee 调用 4 个参数(accumlator, value,index|key,collection)

_.reduce({ 'a': 1, 'b': 2, 'c': 1 }, function(result, value, key) {
  (result[value] || (result[value] = [])).push(key);
  return result;
}, {}); //  { '1': ['a', 'c'], '2': ['b'] } (无法保证遍历的顺序)

sample(collection), 从 collection 中随机获取一个元素

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

some(collection,[predicate=_.identity]),通过 predicate 检查 collection中是否存在符合条件的元素,一旦找到,遍历就停止, predicate 调用三个参数(value,index|key,collection)

_.some([null, 0, 'yes', false], Boolean);//  true

sortBy(collection, [iteratees=[_.identity]]),创建一个元素数组,以 iteratee 处理的结果升序排序,这个方法执行稳定排序,

var users = [
  { 'user': 'fred',   'age': 48 },
  { 'user': 'barney', 'age': 36 },
  { 'user': 'fred',   'age': 40 },
  { 'user': 'barney', 'age': 34 }
];
_.sortBy(users, function(o) { return o.user; });//  objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]
_.sortBy(users, ['user', 'age']);//  objects for [['barney', 34], ['barney', 36], ['fred', 40], ['fred', 48]]
_.sortBy(users, 'user', function(o) {
  return Math.floor(o.age / 10);
});// objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]

对象

findKey(object,[predicate=_.identity]), 返回最先被 predicate 判断为真值的元素 key,而不是元素本身

var users = {
  'barney':  { 'age': 36, 'active': true },
  'fred':    { 'age': 40, 'active': false },
  'pebbles': { 'age': 1,  'active': true }
};
_.findKey(users, function(o) { return o.age < 40; });// 'barney' (iteration order is not guaranteed)

has(object, path), 检查 path 是否是 object 对象的直接属性
hasIn(obj,path),检查 path 是否是 obj 对象的直接或继承属性
nvoke(obj,path,[args]),调用 obj 对象 path 上的方法

var object = { 'a': [{ 'b': { 'c': [1, 2, 3, 4] } }] };
_.invoke(object, 'a[0].b.c.slice', 1, 3);//  [2, 3]

函数

after(n,func), 当他被调用 n 或更多次后将马上触发 func

var saves = ['profile', 'settings'];
var done = _.after(saves.length, function() {
  console.log('done saving!');
});
_.forEach(saves, function(type) {
  asyncSave({ 'type': type, 'complete': done });
});// => Logs 'done saving!' after the two async saves have completed.

debounce(func,[wait=0], [options=]),防抖函数,该函数会从上一次被调用后,延迟 wait 毫秒后调用 func 方法, options.leading 与 options.trailing 决定延迟前后如何触发,是先调用后等待,还是先等待后调用
defer(func, [args]), 推迟调用 func,知道当前堆栈清理完毕,调用是,任何附件的参数都会传给 func
delay(func, wait, [args]), 延迟 wait 毫秒后调用 func,调用时,任何附加的参数会传给func
once(func),创建只能调用一次的函数,重复调用返回第一次调用结果,func 调用时,this 绑定到创建的函数,并传入对应参数

var initialize = _.once(createApplication);
initialize();
initialize();// `initialize` 只能调用 `createApplication` 一次。

判断

eq(value,other), 判断两个值是否相等,执行SameValueZero比较两者的值
gt(value,other),检查 value 是否大于 other
gte(value,other),检查 value 是否大于或等于 other
lt(value,other),检查 value 是否小于 other
lte(value,other),检查 value 是否小于等于 other
isArguments(value),检查 value 是否是一个类 arguments 对象
isArray(value),检查value是否是 Array 类对象
isArrayBuffer(value),检查value是否是 ArrayBuffer对象
isArrayLike(value),检查value是否是类数组
isBoolean(value),检查value是否是原始 boolean 类型或对象
isBuffer(value),检查value是否是个 buffer
isDate(value),检查value是否是Date对象
isElement(value),检查value是否可能是 DOM 对象
isEmpty(value),检查 value 是否是一个空对象,集合,映射或者 set,判断的依据是除非是有枚举属性的对象，length 大于 0 的 arguments object, array, string 或类jquery选择器。
isEqual(value,other),执行深比较来确定两者的值是否相等
isEqualWith(value,other,[customizer]),接收一个 customizer 用来定制比较值
isError(value), 检查 value 是否是Error,EvalError,RangeError,ReferenceError,SyntaxError,TypeError 或者 URIError
isFinite(value),检查 value 是否是原始有限数值
isFunction(value),检查 value 是否是Function 对象
isInteger(value),检查 value 是否是整数
isLength(value),检查 value 是否为有效的长度
isMap(value),检查 value 是否为一个 Map 对象
isMatch(object,source),执行一个深度比较,来确定 object 是否含有和 source 完全相等的属性值
isMatch(object,source,[customizer]),接收一个 customizer 定制比较的值
is(NaN(value),检查 value 是否是NaN
isNative(value),检查 value 是否是一个原生函数
isNil(value),检查 value 是否是null 或者 undefined
isNull(value),检查 value 是否是null
isNumber(value),检查 value 是否是Number 数值型或对象
isObject(value),检查是否为 object 的 language type, 例如: arrays,functions,objects,regexes, new Number(0),以及 new String('')
isObjectLike(value),检查 value 是否是类对象,如果是类对象,那么它不应该是null,而且 typeof 后的结果是 object
isPlainObject(value),检查 value 是否是普通对象,也就是该对象由 object 构造函数创建
isRegExp(value), 检查 value 是否为 RegExp 对象
isSafeInteger(value),检查 value 是否是一个安全整数
isSet(value),检查 value 是否是一个 Set 对象
isString(value),检查 value 是否是原始字符串 String 或对象
isSymbol(value),检查value 是否是原始 Symbol 或对象
isTypeArray(value),检查value 是否是 TypedArray
isUndefined(value),检查 value 是否是 undefined
isWeakMap(value),检查 value 是否是 WeakMap 对象
isWeakSet(value),检查 value 是否是 WeakSet 对象

类型转换

toArray(value),将 value 转换为一个数组
toFinite(value),将value 转换为一个有限数字
toInteger(value),将 value 转换为一个整数
toLength(value),将value 转换为类数组对象的长度整数
toNumber(value),将 value 转换为一个数字
toPlainObject(value),将value 转换为普通对象,包括继承的可枚举属性
toSafeInteger(value),将 value 装换为安全整数,安全整数可用于比较和准群的表示
toString(value),将 value 转换为字符串,null 和 undefined 将返回空字符串

数学计算

add(augend,addend) 两数相加
multiply(multiplier,multiplicand) 两数相乘
divide(dividend,divisor),两数相除
subtract(minuend,subtrahend),两数相减
ceil(number,[precision=0]),向上取整,precision精度,保留几位小数
floor(number,[precision=0]),向下取整,precision精度,保留几位小数
max(array),取 array 中的最大值,如果未空或者假值,则返回 undefined
maxBy(array,[iteratee=_.identity]), 根据传入的 iteratee 规则来获取最大值
mean(array),计算 array 的平均值
meanBy(array,[iteratee=_.identity]),根据传入的 iteratee 来取平均值
min(array),取最小值
minBy(array,[iteratee=_.identity]),根据传入的 iteratee 来取最小值
round(number, [precision=0]), 根据 precision(精度)四舍五入 number
sum(array), 计算 array 的总和
sumBy(array,[iteratee=_.identity]), 根据传入的 iteratee 来计算总和

实用函数

clamp(number,[lower], upper),返回限制在 lower 和 upper 之间的值
inRange(number,[start=0], end),检查 number 是否在 start 和 end 之间
_.inRange(3, 2, 4);// true
random([lower=0],[upper=1],[floating]),产生一个包括 lower 与 upper 之间的数,如果 floating设为 true,或者 lower 或 upper 是浮点数,结果返回浮点数
attempt(func,[args]),尝试调用 func,返回结果或者捕捉错误对象,任何传入的参数都会在调用时传给 func
bindAll(object,methodNames),绑定一个对象的方法到对象本身,覆盖现有方法
default(value,defaultValue),检查 value,以确定一个默认值是否应被返回,如果 value 为NaN,null,undefined,那么返回 defaultValue 默认值
range([start=0],end,[step=1]),创建一个包含从 start 到 end,但不包含 end 本身范围数字的数组
_.range(0, -4, -1);// => [0, -1, -2, -3]
rangeRight([start=0],end,[step=1]), 跟 range一样,不过是降序生成的
times(n,[iteratee=_.identity]),调用 iteratee n 次,每次调用返回的结果存入到数组中,iteratee 传入一个 index 参数
uniqueId([prefix='']),生成唯一 ID, 如果提供了 prefix,会被添加到 ID前缀上

更多详细内容参见 Lodash 中文文档

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 216,163评论 6赞 498
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 92,301评论 3赞 392
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 162,089评论 0赞 352
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 58,093评论 1赞 292
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 67,110评论 6赞 388
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 51,079评论 1赞 295
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 40,005评论 3赞 417
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 38,840评论 0赞 273
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 45,278评论 1赞 310
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 37,497评论 2赞 332
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 39,667评论 1赞 348
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 35,394评论 5赞 343
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 40,980评论 3赞 325
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 31,628评论 0赞 21
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 32,796评论 1赞 268
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 47,649评论 2赞 368
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 44,548评论 2赞 352

lodash 学习笔记

什么是 lodash

为什么要用 lodash

特点

使用

安装

引用

使用

常用函数

字符串

数组

集合

对象

函数

判断

类型转换

数学计算

实用函数

推荐阅读更多精彩内容