Lodash是一个著名的javascript原生库,不需要引入其他第三方依赖。是一个意在提高开发者效率,提高JS原生方法性能的JS库。简单的说就是,很多方法lodash已经帮你写好了,直接调用就行,不用自己费尽心思去写了,而且可以统一方法的一致性。Lodash使用了一个简单的 _ 符号,就像Jquery的 $ 一样,十分简洁。
类似的还有Underscore.js和Lazy.js
支持
chrome 43往上
Firefox 38往上
IE 6-11
MS Edge
Safari 5往上
(几乎涵盖现在市面上可以见到的大部分浏览器)
如何安装
浏览器
直接下载下来引入,或者使用cdn
NPM
$ npm i -g npm
$ npm i --save lodash
先全局安装,在单独安装到项目中
node.js
var _ = require('lodash');
为什么使用lodash
通过使用数组,数字,对象,字符串等方法,Lodash使JavaScript变得更简单。
常用lodash函数
(参考版本lodash v4.16.1)
1、N次循环
for
语句是执行循环的不二选择,但在上面代码的使用场景下,_.times()
的解决方式更加简洁和易于理解。
2、深层查找属性值
Lodash中的_.map
方法和JavaScript中原生的数组方法非常的像,但它还是有非常有用的升级。 你可以通过一个字符串而不是回调函数来浏览深度嵌套的对象属性。
3、深克隆对象
深度克隆JavaScript对象是困难的,并且也没有什么简单的解决方案。你可以使用原生的解决方案:JSON.parse(JSON.stringify(objectToClone))
进行深度克隆。但是,这种方案仅在对象内部没有方法的时候才可行。
4、在指定范围内获取一个随机值
Lodash中的 _.random
方法要比上面的原生方法更强大与灵活。你可以只传入一个参数作为最大值, 你也可以指定返回的结果为浮点数_.random(15,20,true)
5、扩展对象
_.assign
方法也可以接收多个参数对象进行扩展,都是往后面的对象上合并
6、从列表中随机的选择列表项
此外,你也可以指定随机返回元素的个数_.sampleSize(smartTeam,n)
,n为需要返回的元素个数
7、判断对象中是否含有某元素
_.includes()
第一个参数是需要查询的对象,第二个参数是需要查询的元素,第三个参数是开始查询的下标
8、遍历循环
这两种方法都会分别输出‘1’和‘2’,不仅是数组,对象也可以,数组的是后key
是元素的下标,当传入的是对象的时候,key
是属性,value
是值
9、遍历循环执行某个方法
_.map()
10、检验值是否为空
_.isEmpty()
11、查找属性
_.find()
、_.filter()
、_.reject()
_.find()
第一个返回真值的第一个元素。_.filter()
返回真值的所有元素的数组。_.reject()
是_.filter
的反向方法,不返回真值的(集合)元素
_.uniq(array)
创建一个去重后的array数组副本。
参数array (Array)
: 要检查的数组。
返回新的去重后的数组
_.uniqBy(array,[iteratee=_.identity])
这个方法类似 _.uniq
,除了它接受一个 iteratee
(迭代函数),调用每一个数组(array)的每个元素以产生唯一性计算的标准。iteratee 调用时会传入一个参数:(value)。
Math.floor
只是向下取整,去重,并没有改变原有的数组,所以还是2.1和1.2,不是2和1。
13、模板插入
_.template([string=''], [options={}])
注意,这个标签的
type
是text/template
,类似于react的JSX的写法,就是js和html可以混写,用<% %>
括起来的就是js代码,可以执行,直接写的就是html的标签,并且有类似MVC框架的的数据绑定,在<%= %>
中可以调用到数据呈现(纯属个人见解,不知道理解的对不对)