lodash库——封装好的数组方法介绍

简介: lodash库——封装好的数组方法介绍

array数组(海王)

作为中央空调的数组,可以容纳多种数据类型的元素

let array=[1,2,3,4,5,6,'yma16',true,[2,3]]
console.log(array)

导入lodash

<script src="lodash.js"></script>

chunk方法—数组拆分

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

默认拆分为单个元素组成的数组,返回拆分的数组

let array=['y','m','a',1,6]
let result=_.chunk(array,2)
console.log(result)

compact方法—过滤假值

_.compact(arrray)

过滤掉数组中的false,0,null,NaN,undefined

let array=['yma16',undefined,null,NaN,0,true,false,1]
let result=_.compact(array)
console.log(result)

concat方法——拼接数组

_.concat(array1,array2)

返回拼接的数组array1之后接着array2

let array1=['y']
let array2=['ma16']
let result=_.concat(array1,array2)
console.log(result)

difference方法——创建唯一值

_.difference(array,[values])

区别于values的元素,返回新数组

let array=['yma16',1949,10,1,3,3,3,4]
let result=_.difference(array,[3,4])
console.log(result)

differenceBy(array,[values],iteratee=_.identity)

迭代器iteratee调用value形成过滤值

let array=['yma16',1,2,8,9,3,5,4]
let result=_.differenceBy(array,[3,4],o=>{return o})
console.log(result)

differencewith(array,[values],[comparator])

比较comparator:array和value,结果数组来自array

let array=['yma16',1,2,8,9,3,5,4]
let result=_.differenceWith(array,[3,4],_.isEqual)
console.log(result)

drop方法—切片

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

去除前n个元素默认为1,返回原来数组剩下的切片内容

let array=['y','m','a',1,6]
let result=_.drop(array,2)
console.log(result)

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

从右边到左边开始切片

let array=['y','m','a',1,6]
let result=_.dropRight(array,2)
console.log(result)

dropRightWhile(array,[predicate=_.identify])

去除array中从 predicate 返回假值开始到尾部的部分。predicate 会传入3个参数: (value, index, array)。

返回array剩余切片内容

let users = [
  { 'user': 'yma16',  'active': true },
  { 'user': 'china',    'active': false },
  { 'user': 'up', 'active': false }
];
let result=_.dropRightWhile(users,o=>{ return !o.active; });
console.log(result)

dropWhile(array,[predicate=_.identify])

类似dropRightWhile

let users = [
  { 'user': 'yma16',  'active': true },
  { 'user': 'china',  'active': false },
  { 'user': 'up', 'active': false }
];
let result=_.dropWhile(users,o=>{ return !o.active; });
console.log(result)

区别

let users = [
  { 'user': 'china',   'active': false },
  { 'user': 'up', 'active': false },
  { 'user': 'yma16',  'active': true }
];
let result=_.dropWhile(users,o=>{ return !o.active; });
console.log(result)

fills方法—填充替换

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

value为填充的内容,默认开始到结束

let array=['I','am','yam16',666]
let result=_.fill(array,'china')
console.log(result)

findIndex方法

.findIndex(array,[predicate=.identity])

返回第一个通过predicate断言的元素索引值(位置下标)

从左到右

let users=[{'user':'yma16','active':true},
{'user':'why?','active':true}]
let result=_.findIndex(users,o=>{return o.active})
console.log(result)

findlastIndex函数从右到左

let users=[{'user':'yma16','active':true},
{'user':'why?','active':true}]
let result=_.findLastIndex(users,o=>{return o.active})
console.log(result)

indexOf方法—返回索引

_.indexof(array,value,[fromIndex=0])

查找value的索引值,默认从左边第一个开始查找

let array=['y','ma','y']
let result1=_.indexOf(array,'y')
let result2=_.indexOf(array,'y',1)
console.log(result1,result2)

flatten方法—数组的降维

_.flatten(array)

降一层

_.flattenDeep(array,[depth=1])

可降多层维度

let array=['wow',[[1949,[1998],'yma16']],1,]
let result1=_.flatten(array)
let result2=_.flattenDeep(array,2)
console.log(result1,result2)

first、head、last方法

参数为array

字面意思取第一个和最后一个元素

let array=['y','m','a',16]
let first=_.first(array),head=_.head(array),last=_.last(array)
console.log(first,head,last)

initial方法—去除最后一个元素

initial(array)

let array=['y','m','a',16]
let result=_.initial(array)
console.log(result)

fromPairs—返回键值对象

_.fromPairs(pairs)

键值对pairs,返回新的对象object

let array=[['yma16',16],['16','yma']]
let result=_.fromPairs(array)
console.log(result)

join方法—分隔符字符串

_.join(array,[separator=’,’])

转化为元素之间添加 , 的字符串

let array=['y','m','a',1,6]
let result=_.join(array,'')
console.log(result)

nth函数—取元素

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

n<0时从右边结尾开始取

let array=['y','m','a',1,6,null]
let result=_.nth(array,-2)
console.log(result)

remove方法—移除元素

remove(array,[predicate=_.identity])

可以用来过滤

let array=[1,2,3,4,5,6]
let result=_.remove(array,o=>{return o>3})
console.log(result)

slice函数—裁剪数组

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

返回裁剪数组

let array=['yma',1,2,3,4,5]
let result=_.slice(array,0,3)
console.log(result)

reverse函数—取反

reverse(array)

let array=[1,9,9,8,0,8]
let result=_.reverse(array)
console.log(result)


目录
相关文章
|
设计模式 资源调度 Kubernetes
微前端应用 乾坤 开发实践
乾坤作为一款微前端应用框架,可以有效的实现前端应用程序的模块化设计,代码复用和可维护性。下面我们来通过实际开发来看看乾坤的使用方式以及实践。
|
JavaScript
Vue2使用全局函数或变量的两种常用方式
这篇文章介绍了在Vue 2项目中实现全局函数或变量的两种常用方式:一种是通过挂载到Vue的`prototype`,另一种是使用Vue的全局混入(Vue.mixin)。
1281 0
Vue2使用全局函数或变量的两种常用方式
|
存储 JavaScript 前端开发
js数组高阶函数——includes()方法
js数组高阶函数——includes()方法
605 0
|
人工智能 测试技术
人工智能帮你一键生成完美架构图
本文介绍了如何利用ChatGPT和Plantuml创建架构图。首先,明确业务需求是关键,如需设计一个测试平台产品,包括测试用例管理、用户管理等功能。然后,确定输出格式,由于ChatGPT无法直接生成图形,可以借助Plantuml等工具将提示词转化为类图。通过ChatGPT提供的类图信息,结合Plantuml可间接生成架构图。实践中,要注意清晰表述需求,系统测试并逐步拆解复杂任务,以实现有效的架构图设计。
|
安全 定位技术 网络安全
禁止应用在模拟器上运行的方案及app安全问题
禁止应用在模拟器上运行的方案及app安全问题
1436 1
|
Java 开发工具 git
【Python】已解决:ERROR: No matching distribution found for JPype1
【Python】已解决:ERROR: No matching distribution found for JPype1
878 0
|
JavaScript
vue动画——翻转动画(悬浮触发、点击触发)
vue动画——翻转动画(悬浮触发、点击触发)
221 0
Element UI 自定义/修改下拉弹窗的样式(如级联选择器的下拉弹窗样式)
Element UI 自定义/修改下拉弹窗的样式(如级联选择器的下拉弹窗样式)
1205 0
Echarts设置y轴值间隔
Echarts设置y轴值间隔
921 0
下一篇
开通oss服务