欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

​lodash常用/最频繁使用的方法

lodash常用/最频繁使用的方法

lodash是js集Array/Object/String/Function的Util于一身。

lodash打包了Array/Object/String/Function里一些Api,好处是连ES6的也打包了,所以让你想在ES5环境下使用诸如Array#reduce#includes#some#every等时可以借lodash来帮忙

lodash可以让代码更简短,以下列几个最频繁使用的方法:

_.range(10) 

//生成元素为0到9的数组

_.times(10, (i)=>console.log(i))

 //循环10次

_.uniqueId()

 //生成不同的id,用于元素中的id值再好不过

_.startWith 

//判断字符串是否以xx开头

_.endWith 

//判断字符串是否以xx结尾

_.truncat 

//截取指定长度后加… 用于处理标题过长再好不过

_.template 

//es6有字符串模板的语法,而lodash是es5的替代方案

_.assign

 //合并,es6有Object.assign,类似于jQuery.extend

_.assignIn 

//lodash里很多方法带In的都是可枚举原型链上的属性

_.defaults 

//安全合并,即忽略undefined/null的重写

_.findKey 

//根据value的属性值找key

.mapKeys

 //遍历重写key, 相当于.forIn

.mapValues 

//遍历重写value , 相当于.forIn

_.invert 

//反转映射,快速通过value值找key

_.omit 

 //返回移除部分属性的副本,比如提交表单时有些字段不要提交

_.pick 

//与omit相反,提取部分属性的副本,比如只提交某些字段

_. clamp

 //确认所给值只在min,max之间

_.max 

//最大

_.min

//最小

_.sum

 //求和

_.random

 //生成随机数

_.round 

//四舍五入,允许指定精确位数

_.isNumber

_.isInterger

_.isFunction

_.isPlainObject

_.isArray

_.isDate

_.isElement

_.isNil 

//null or undefined

_.isEmpty 

//{} or 空数组

_.isEqual 

//支持对象和数组

_.isMatch

 //匹配对象属性值

_.cloneDeep 

//深度复制

_.clone 

//浅复制

_.once 

//只执行一次

_.before 

//最多n-1次

_.after 

 //n次后执行

_.debounce 

//忽略频繁执行

_.union

 //合并两数组,去重

_.uniq

 //去重

_.pull(array,element1,element2) 

// 直接在array中移除元素,

_.without(array,element1,element2) 

//得到新array中移除元素

_.remove(array, function) 

//直接在array移除在function返回true的元素

_.sameple(array) 

//随机取1

_.samepleSize(array, int)

//  随机取n

_.shuffle(array)

 //乱序, jQuery.shuffle

_.find(array, function | object) 

//根据function返回值和对象查找1个结果

_.filter(array, function | object) 

//根据function返回值和对象查找多个结果

_.groupBy(array, string) 

//分组,与多合一相反

_.keyBy(array, string)

 //分组,类似groupBy, 但只有唯一值

_.countBy(array, string) 

//分组统计

_.orderBy(array, array, array)

_.sortBy(array, array)

_.difference(array1,array2)

 //找不同于array2,元素是Object用differenceBy

_.xor(array1,array2) 

//得到非交集,元素是Object用xorBy

_.intersection(array1,array2) 

//得到交集,元素是Object用intersectionBy


文章最后发布于: 2018-06-21 11:28:11
有 0 个人打赏

来自  https://blog.csdn.net/Embrace924/article/details/80757854



lodash常用方法


版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/debbyDeng/article/details/85247110

Array方法

_.chunk(arr,[size=1]): 数组等分,返回包含拆分区块的新数组。
_.compact(arr): 返回新数组,包含原数组所有非假值元素。
_.concat(arr,[value]): 返回新数组,数组或值进行拼接
_.difference(arr, [values]): 返回新数组,过滤掉后面数组中给定的值
_.differenceBy(arr,[values],iteratee:迭代器): 先用迭代器对检查数组,和排除的值进行迭代,过滤掉符合条件的。返回新数组。迭代器可以为arr, function, object, string
_.differenceWith(arr,[values],[comparator:比较器]):返回过滤值后的新数组
_.drop(arr,[n=1]): 返回新数组-arr剩余切片。去除arr前面的n个元素
_.dropRight(arr,[n=1]): 去掉arr尾部的n个元素
_.fill(arr,value,[start=0],[end=arr.length]):改变原数组,用value填充arr
.findIndex(arr,[predicate=.identity]): 类似find,返回通过predicate判断为真值的元素的索引值.
.findLastIndex(arr,[predicate=.identity]): 从右到做迭代arr中元素
_.flatten(arr): 返回新数组,减少一级arr嵌套深度
_.flattenDeep(arr): 返回新一维数组,将arr递归为一维数组
_.flattenDepth(arr,[depth=1]):返回新数组,根据depth递归减少arr嵌套层级
_.head(arr): 获取数组第一个元素
_.tail(arr): 获取arr第一个元素以外的全部元素
_.take(arr):从arr起始元素开始提取n个元素。
_.takeRight(arr,[n=1]):从arr的最后一个元素开始提取n个元素
_.last(arr): 获取数组最后一个元素
_.nth(arr,[n=0]): 获取数组第n个元素,若为负数,返回从结尾开始的第n个元素
_.indexOf(arr,value,[fromIndex=0]):若fromIndex为负,从arr尾部进行匹配。
_.lastIndexOf(arr,value,[fromIndex=arr.length-1])
_.initial(arr): 返回新数组,获取arr中除最后一个元素外所有元素.
_.intersection([arrs]):返回所有给定数组的交集组成的新数组
.join(arr,[separator=’,’]):返回连接字符串
_.pull(arr,[values]):移除数组中和给定值相等的元素,改变原数组
_.pullAll(arr,values):同pull区别是第二个参数为数组。改变原数组
_.pullAt(arr,[indexes]): 移除arr中对应的元素,返回被移除元素的数组。改变原数组
**_.remove(arr, [predicate=
.identity]): 移除数组中predicate返回真值的元素,predicate传入3参数(value,index,array) , 改变原数组**
_.reverse(arr): 改变原数组,反转arr
_.slice(arr, [start=0],[end=arr.length]): 返回新数组,从start到end(不包含)
_.sortedUniqBy(arr,[iteratee]): 返回新的不重复数组。
_.union([arrs]):返回按顺序排列的唯一值联合数组
_.uniq(arr):返回新数组,去重
_.zipObject([props=[]],[values=[]]):接受2个数组,第一个数组中的值作为对象的属性名,第二个数组中的值作为对应属性的值,返回一个对象

集合Collection方法

.every(collection,[predicate=.identity]): 通过断言函数检查collection中的所有元素是否都返回真值,一旦predicate返回假值,迭代马上停止,如果都返回真值,则返回true否则返回false。

collection: (array|object): 一个用来迭代的集合
[predicate=_.identity](Array|function|object|string):每次迭代调用的函数

.filter(collection,[predicate=.identity]):返回断言函数返回真值的所有元素组成的数组
_.reject(collection,[predicate]):返回非真值集合
.find(collection,[predicate=.identity],[fromIndex=0]): 返回predicate第一个返回真值的元素。
_.findLast(collection,[predicate],[fromIndex=collection.length-1])
.forEach(collection,[iteratee=.identity]),如果迭代函数显示返回false, 迭代会提前退出
.groupBy(collection,[iteratee=.identity]): 根据迭代器创建一个对象,key是遍历集合中的每个元素返回的结果,每个键对应的值为生成key的元素组成的数组
_.includes(collection,value,[fromIdex=0]): 检查是否包含,返回布尔值
_.keyBy(collection,[iteratee=._identity]): 创建一个对象组成,key是collection中每个元素经过迭代函数处理后返回的结果,每个key对应的值是生成key的最后一个元素。
.orderBy(collection,[iteratees=[.identity]],[orders]):排序

[iteratees=[._identity]](Array[]|Function[]|object[]|string[])
[orders](string[]): 迭代函数的排列顺序

lang方法

_.isEmpty(value):检验value是否为空对象,集合,映射或者set
_.isEqual(value,other):执行深比较
_.isEqualWith(value,other,[customizer]):

[customizer]: 定制比较函数,参数为objValue,othValue[,index|key, object, other, stack]
如果customizer返回undefined, customizer将会作为比较方法。

object 方法

.mapValues(object,[iteratee=.identity]): 创建一个对象,key与object 的key一致,值是通过iteratee运行object中的每个自身可枚举属性名字符串产生。iteratee调用三个参数,value, key,object




Lodash常用用法总结

0.574字数 1696阅读 3047


Lodash是一个轻量级的JavaScript工具函数库,它方便了日常开发中对数据的操作,提高了开发效率。

日常开发中,通常会对数据,特别是数组和对象进行各种读写等操作:比如去重,拷贝,合并,过滤,求交集,求和等等。根据平时开发中对数据的操作,我对Lodash常见的用法做了以下总结,方便今后的学习和整理。

Array

Create

  • 创建一个数组,元素为0, 1, 2, ... , 23

    _.range([start=0], end, [step=1])

    let arr = _.range(24)
    
    console.log(arr) // [0, 1, 2, 3, ... , 23]
    
  • 创建一个数组,元素为100, 100, 100, 100, 100

    _.fill(array, value, [start=0], [end=array.length])

    let arr = _.fill(Array(5), 100)
    
    console.log(arr) // [100, 100, 100, 100, 100]
    

Read

  • 获取数组中最后一个元素

    _.last(array)

    let arr = [1, 2, 3, 4, 5]
    let lastElement = _.last(arr) 
    
    console.log(lastElement) // 5
    
  • 获取数组中倒数第二个元素

    _.nth(array, [n=0])

    let arr = [1, 2, 3, 4, 5]
    let lastSecondElement = _.nth(-2) 
    
    console.log(lastSecondElement) // 4
    
  • 获取对象数组中某一同名属性的属性值集合

    .map(collection, [iteratee=.identity])

    let users = [{
          id: 12,
          name: 'Adam',
          hobbies: [
            {name: 'running', index: 100},
            {name: 'cycling', index: 95}
          ]
       },{
          id: 14,
          name: 'Bob',
          hobbies: [
            {name: 'movie', index: 98},
            {name: 'music', index: 85}
          ]
       },{
          id: 16,
          name: 'Charlie',
          hobbies: [
           {name: 'travelling', index: 90},
           {name: 'fishing', index: 88}
          ]
       },{
          id: 18,
          name: 'David',
          hobbies: [
           {name: 'walking', index: 99},
           {name: 'football', index: 85}
         ]                
    
    
       }
    ]
    let userIds = _.map(users, 'id')
    let mostFavouriteHobbies = _.map(users, 'hobbies[0].name')
    
    console.log(userIds) // [12, 14, 16, 18]
    console.log(mostFavouriteHobbies) // ["running", "movie", "travelling", "walking"]
    
  • 获取对象数组中某一属性值最大的对象

    .maxBy(array, [iteratee=.identity])

    let arr = [{a:1, b: 2, c: {d:4}}, {a:3, b: 4, c: {d:6}}]
    let maxBObj = _.maxBy(arr, 'b')
    
    console.log(maxBObj) // {a: 3, b: 4, c: {d: 6}}
    
  • 找出两个数组中元素值相同的元素

    _.intersection([arrays])

    let arr1 = [2, 1, {a: 1, b: 2}]
    let arr2 = [2, 3, {a: 1, b: 2}]
    let intersection = _.intersection(arr1, arr2) 
    
    console.log(intersection) // [2]
    
  • 求数值数组中元素值的平均数

    _.mean(array)

    let numbers = [1, 2, 3, 4, 5]
    let average = _.mean(numbers)
    
    console.log(average) // 3
    
  • 求对象数组中某个属性值的平均数

    .meanBy(array, [iteratee=.identity])

    let objects = [{ 'n': 4 }, { 'n': 2 }, { 'n': 8 }, { 'n': 6 }]
    let average = _.meanBy(objects, 'n')
    
    console.log(average) // 5
    
  • 获取数组中前n个元素,不改变原数组

    _.take(array, [n=1])

    let arr = [1, 2, 3, 4, 5]
    let part1Arr = _.take(arr, 4)
    let part2Arr = _.take(arr, 6)
    let part3Arr = _.take([], 5)
    
    console.log(part1Arr) // [1, 2, 3, 4]
    console.log(part2Arr) // [1, 2, 3, 4, 5]
    console.log(part3Arr) // []
    

Delete

  • 删除数组中值为falsy的元素

    _.compact(array)

    let arr = [0, 1, false, 2, '', 3, null, undefined, NaN]
    let truthyArr = _.compact(arr) 
    
    console.log(truthyArr) // [1, 2, 3]
    

Format

  • 去重。

    _.uniq(array)

    let arr = [2, 1, 2, '2', true]
    let uniqArr = _.uniq(arr)
    
    console.log(uniqArr) // [2, 1, '2', true]
    
  • 排序。对象数组,根据对象中的某个属性的值,升序或降序排序

    .orderBy(collection, [iteratees=[.identity]], [orders])

    let users = [
      {user: 'Tom', age: 25},
      {user: 'Amy', age: 23},
      {user: 'Perter', age: 22},
      {user: 'Ben', age: 29}
    ]
    let sortedUsers = _.orderBy(users, 'age', 'desc')
    
    console.log(sortedUsers)
    // [{user: "Ben", age: 29}, {user: "Tom", age: 25}, {user: "Amy", age: 23}, {user: "Perter", age: 22}]
    
  • 分割数组[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]为 [1, 2, 3, 4, 5] 和 [6, 7, 8, 9, 10]

    _.chunk(array, [size=1])

    let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
    let [left, right] = _.chunk(arr, 5)
    
    console.log(left) // [1, 2, 3, 4, 5]
    console.log(right) // [6, 7, 8, 9, 10]
    
  • 脱掉一层[]

    _.flatten(array)

    let address = {
      '江苏省': ['南京市', '苏州市'],
      '浙江省': ['杭州市', '绍兴市']
    }
    let cities = _.flatten(_.values(address))
    
    console.log(cities) // ["南京市", "苏州市", "杭州市", "绍兴市"]
    
  • 将多维数组转为一维数组

    _.flattenDeep(array)

    let flattenedArr = _.flattenDeep([1, [2, [3, [4]], 5]]);
    
    console.log(flattenedArr) // [1, 2, 3, 4, 5]
    

Object

Create

  • 通过数组["x", "y"] 和 数组[10, 10] 创建对象 {x: 10, y: 10}

    _.zipObject([props=[]], [values=[]])

    let keys = ["x", "y"]
    let values = [10, 10]
    let obj = _.zipObject(keys, values) 
    
    console.log(obj) // {x: 10, y: 10}
    
  • 合并对象

    _.assign(object, [sources])

    let desObj = {name: '', gender: 'male', job: 'developer'}
    let sourceObj = {name: 'Tom', job: ''}
    let mergedObj = _.assign(desObj, sourceObj)
    
    console.log(mergedObj) // {name: "Tom", gender: "male", job: ""}
    
  • 深拷贝对象

    _.cloneDeep(value)

    let sourceObj = {department_id: 1, permissions: {management: [1, 2, 3, 4], store: [11, 12, 13, 14]}}
    let desObj = _.cloneDeep(sourceObj)
    desObj.permissions.store.push(15, 16)
    
    console.log(desObj)
    // {department_id: 1, permissions: {management: [1, 2, 3, 4], store: [11, 12, 13, 14, 15, 16]}}
    console.log(sourceObj)
    // {department_id: 1, permissions: {management: [1, 2, 3, 4], store: [11, 12, 13, 14]}}
    
  • 合并多个对象中key值相同的键值对

    _.merge(object, [sources])

    let obj1 = {'9': {name: '乐购超市'}}
    let obj2 = {'9': {storeToken: 'xxx'}}
    let obj3 = {'9': {storePosition: 'Hangzhou'}}
    let mergedObj = _.merge(obj1, obj2, obj3) 
    
    console.log(mergedObj)
    // 9: {name: "乐购超市", storeToken: "xxx", storePosition: "Hangzhou"}
    

Read

  • 判断对象中是否有某个属性

    _.has(object, path)

    let obj = {a: [{b: {c: 3}}]}
    let hasC = _.has(obj, 'a[0].b.c')
    
    console.log(hasC) // true
    
  • 获取对象中的某个属性的值

    _.get(object, path, [defaultValue])

    let obj = {a: [{b: {c: 3}}]}
    let c = _.get(obj, 'a[0].b.c')
    
    console.log(c) // 3
    

Update

  • 设置对象中的某个属性的值

    _.set(object, path, value)

    let obj = {a: [{b: {c: 3}}]}
    let newObj = _.set(obj, 'a[0].b.c', 4);
    
    console.log(obj.a[0].b.c); // 4
    
  • 对多个对象相同属性的属性值求和。

    let customers = {
      new_customer: {0: 33, 1: 5, ... , 23: 0},
      old_customer: {0: 22, 1: 7, ... , 24: 0}
    }
    let customer = {}
    let keys = _.keys(customers.new_customer)
    let values = _.values(customers)
    _.map(keys, key => {
      customer[key] = _.sumBy(values, key)
    })
    
    customers.customer = customer
    
    console.log(customers)
    // console
    {
      customer: {0: 55, 1: 12, ... , 23: 0}
      new_customer: {0: 33, 1: 5, ... , 23: 0}
      old_customer: {0: 22, 1: 7, ... , 23: 0}
    }
    

Number

  • 生成一个随机数,范围n~m

    _.random([lower=0], [upper=1], [floating])

    let random1 = _.random(2, 5)
    let random2 = _.random(5)
    
    console.log(random1) // 2, 3, 4, 5
    console.log(random2) // 0, 1, 2, 3, 4, 5
    

Data Type

  • 判断数据类型

    _.isNumber(value)

    _.isInteger(value)

    ...

    _.isPlainObject(value)

    let variable = 'hello';
    // Number
    console.log(_.isNumber(variable));
    // Integer
    console.log(_.isInteger(variable));
    // Boolean
    console.log(_.isBoolean(variable));
    // String
    console.log(_.isString(variable));
    // Null
    console.log(_.isNull(variable));
    // Undefined
    console.log(_.isUndefined(variable));
    // Array
    console.log(_.isArray(variable));
    // Function
    console.log(_.isFunction(variable));
    // Object
    console.log(_.isPlainObject(variable));
    // Date
    console.log(_.isDate(variable));
    
    // DOM element
    console.log(_.isElement(variable));
    
  • 数据类型转换

    • _.toArray

      _.toArray('abc') // ["a", "b", "c"]
      
    • _.toInteger

      _.toInteger(3.2); // 3
      _.toInteger('3.2'); // 3
      
    • _.toNumber

      _.toNumber('3.2') // 3.2
      
    • _.toString

      _.toString(1); // "1"
      _.toString([1, 2, 3]); // "1,2,3"
      

Util

  • 重复多次某个元素

    .times(n, [iteratee=.identity])

    const dateParams = _.times(2, () => '2018-08-27');
    console.log(dateParams) // ["2018-08-27", "2018-08-27"]
    


5人点赞
拥有37钻 (约3.80元)



来自   https://www.jianshu.com/p/651607d752de


普通分类: