lodash常用api(一)

概念简述

lodash 是一个类库 Lodash 通过降低 array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单

数组篇

  • _.chunk(array,[size=1]) 切割数组

作用: 讲数组array拆分成多个size长度的区块,并将这些区块组成一个新的数组,如果array无法分割成等长的区块,那么最后的剩余元素将组成一个区块。

  • 参数 array :需要处理的数组 size=1(number):每个数组区块的长度

  • 返回值 array:返回一个包含拆分区块的新数组(相当于二维数组)

  let arr = [1, 2, 3, 4, 5, 6];
  let arr_result = _.chunk(arr, 2);
  console.log(arr_result);
  // [[1,2],[3,4],[5,6]]
  //如果第二个参数要是4则变成 [[1,2,3,4],[5,6]]
  • _.compact(array) 刨去假值

作用: 创建一个新数组,包含原数组中所有的非假值元素。例如false,null,0,"",undefined,NaN都被认为假值

  • 参数 array(要处理的数组)

  • 返回值 array:返回过滤掉假值的新数组

  let arr = [0, 1, NaN, 2, null, 3, undefined];
  let arr_result = _.compact(arr);
  console.log(arr_result);
  // [1,2,3]
  • _.concat(array,[values]) 两个数组链接起来

创建一个新的数组将array与任何数组或值链接在一起

  • 参数 array:被链接的数组 [values] (...*)连接的值

  • 返回值 (Array):返回连接后的新数组

  let arr = [1];
  let arr2 = _.concat(arr, 2, [3], [[4]], { name: "xx" });
  console.log(arr2);
  // [1, 2, 3, [[4]], { name: "xx" }]
  console.log(arr); 
  // [4]
  • _.difference(array,[values]) 找到不同的

创建一个具有唯一array值得数组, 每个值不包含在其他给定的数组中

  • 参数 array:要检查的数组 [values] :要排除的值

  • 返回值 (Array):返回一个过滤值后的新数组,他是以第一个数组为基准

  let result = _.difference([3, 2, 100], [100, 2]);
  console.log(result);
  // [3]
  • _.differenceBy(array,[values],condition) 找到不同的带条件

创建一个具有唯一array值的数组,

  • 参数 array:要检查的数组 [values] :要排除的值

条件 :他是先把2个数组里面的所有值都执行一遍条件,然后筛选出来

  • 返回值 (Array):返回一个过滤值后的新数组
  let result = _.differenceBy(
    [{ name: "123" }, { sex: "男" }],
    [{ name: "123" }],
    "name"
   );
  console.log(result);
  // [{sex:"男"}]

  let result = _.differenceBy([3.1, 4.2, 5.3], [4.6, 5.1],Math.floor);
  console.log(result);
  // 3.1
  
  let result = _.differenceBy([12, 3, 4], [3, 1], 
  function(item) {
    return item - 4 > 0;
  });
  console.log(result);
// [12]
  • _.drop(array,[n=1]) 从左边去掉

创建一个切片数组,去除array前面的n个元素,从左边开始切割

  • 参数 array:要查询的数组 [values] :要去除的元素个数

  • 返回值 (Array):返回array剩余的切片

  let arr = [1, 2, 3, 4, 5, 6];
  let arr_result = _.drop(arr, 3);
  console.log(arr_result);
  //[4,5,6]
  //如果要去除的元素个数比总长都大,那么返回一个空数组,要是0就不切割了
  • _.dropRight(array,[n=1]) 从右边去掉

创建一个切片数组,去除array前面的n个元素,从右边开始切割

  • 参数 array:要查询的数组 [values] :要去除的元素个数

  • 返回值 (Array):返回array剩余的切片

  let arr = [1, 2, 3, 4, 5, 6];
  let arr_result = _.dropRight(arr, 3);
  console.log(arr_result);
  // [1,2,3]
  //如果要去除的元素个数比总长都大,那么返回一个空数组
  • _.dropwhile(array,方法或者条件) 去掉带条件

创建一个切片数组,去除满足方法或者条件的

  • 参数 array:要查询的数组 [condition] : 满足方法或者条件的
  • 返回值 (Array):返回array剩余的切片
  let arr = [1, 2, 3, 4, 5, 6];
  let arr_result = _.dropWhile(arr, function(item) {
      return item < 4;
  });
  console.log(arr_result);
  //[4,5,6]
  //如果都不满足,那么返回一个空数组
  • _.fill(array,value,[start=0],[end=array.length]) 替换

使用value值来替换(array里面的值),从start位置开始到end位置结束

  • 参数 array:要填充改变的数组 value(*): 填充给array的值 start=0 :开始位置(默认0) end=array.length:结束位置(默认array.length)
  • 返回值 (Array):会改变原数组
  let _ = require("lodash");
  let array = [2, 3, 4];
  let result = _.fill(array, "a", 1, 2);
  console.log(result);
  //结果就是[2,"a",4]
  //要是从0开始那么改变的就是第一位
  • _.findIndex(array,condition,[fromIndex=0]) 找到序号

返回第一个通过条件为真值得元素的索引(index)值,而不是元素本身

  • 参数 array:要搜索的数组 condition: 条件 [fromIndex=0]: 从第几个开始找
  • 返回值 (number):返回找到元素的索引值(index),否则返回就是-1
  let user = [
    { user: "哈哈哈", active: true },
    { user: "呵呵呵", active: true },
    { user: "嘿嘿嘿", active: false },
    { user: "哦哦哦", active: false }
  ];
  let result = _.findIndex(user, function(item) {
    return !item.active;
  });
  console.log(result);
  //返回的结果就是2因为从0开始
  • _.head(array) 找到第一个元素 等价于 _.first(array)

获取数组array的第一个元素

  • 参数 array:要搜索的数组
  • 返回值 (*):返回数组的第一个元素
  let user = [
    { user: "哈哈哈", active: true },
    { user: "呵呵呵", active: true },
    { user: "嘿嘿嘿", active: false },
    { user: "哦哦哦", active: false }
  ];
  let result = _.first(user);
  console.log(result);
 // {user:"哈哈哈",active:true}
  • _.flattenDeep(array) 回归一维数组

将array递归为一维数组

  • 参数 array:要搜索的数组
  • 返回值 (*):返回一个新的一维数组
  let user = [1, [2, 3, 4, [6, 8, [9, 10]]]];
  let result = _.flattenDeep(user);
  console.log(result);
  //[1,2,3,4,6,8,9,10];
  • _.flattenDepth(array,[depth=1]) 去除数组指定的层数

依据depth递归减少array的嵌套层数

  • 参数 array:要减少嵌套层级的数组 depth:最多减少的嵌套层级数
  • 返回值 (*):返回减少嵌套层级后的新数组
  let user = [1, [2, 3, 4, [6, 8, [9, 10]]]];
  let result = _.flattenDepth(user, 2);
  console.log(result);
  // [1,2,3,4,6,7,[9,10]]
  • _.intersection([arrays]) 求交集

创建唯一值得数组,这个数组包含所有数组的共同元素

  • 参数 array:待检查的数组
  • 返回值 (*):返回一个包含所有传入数组交集元素的新数组
  let result = _.intersection([1, 2], [2, 3], [4, 2]);
  console.log(result);
  //[2]
  • _.intersectionBy([arrays],condition) 求交集

创建唯一值得数组,这个数组包含所有数组的共同元素

  • 参数 array:待检查的数组 condition:条件
  • 返回值 (*):返回一个包含所有传入数组交集元素的新数组
  let result = _.intersectionBy(
    [1.3, 2.2],
    [2.6, 3.9],
    [4.1, 2.1],
    Math.floor
  );
  console.log(result);
  //[2.2]

  let result = _.intersectionBy([{ x: 1 }], [{ x: 1 }, { name: 3 }], "x");
  console.log(result);
  // [{x:1}]
  • _.join([arrays],分隔符) 把数组变成字符串

将array中的所有元素转换为由分隔符分割的字符串

  • 参数 array:待检查的数组 分隔符:分割元素
  • 返回值 (*):返回连接字符串
  let result = _.join([1, 2, 3, 4], "~");
  console.log(result);
  //结果1~2~3~4
  • _.last(array) 找到最后一个元素

获取array中最后一个元素

  • 参数 array:待检查的数组
  • 返回值 (*):返回array中的最后一个元素
  let result = _.last([1, 2, 3, 4]);
  console.log(result);
  // 4
  • _.nth(array,[n=0])

获取array中第N个元素,如果N为负数,则返回从数组结尾开始的第N个元素

  • 参数 array:待检查的数组 n=0 要返回的元素的索引值
  • 返回值 (*):返回array中的第N个元素
  let array = [1, 3, 3, 4, 5, 6];
  let result = _.nth(array, 0);
  console.log(result);
  //结果就是1
  • _.pull(array,[values]) 删除

移除数组array中所有和给定值相等的元素,这个方法会改变原数组。

  • 参数 array:待检查的数组 [values] 要删除的值
  • 返回值 (*):返回array
   let array = [1, 3, 3, 4, 5, 3, 2, 6, 2];
   _.pull(array, 3, 2);
   console.log(array);
  // [1,4,5,6]
  • _.pullAll(array,values)

移除数组array中所有和给定值相等的元素,这个方法会改变原数组。这个元素必须是数组

  • 参数 array:待检查的数组 [values] 要删除的值,必须是数组
  • 返回值 (*):返回array
 let array = [1, 3, 3, 4, 5, 3, 2, 6, 2];
  _.pullAll(array, [2, 3]);
  console.log(array);
  // [1,4,5,6]

ps.凡是后面有By都会有迭代器

  • _.pullAllBy(array,values,迭代器)

移除数组array中所有和给定值相等的元素,这个方法会改变原数组。迭代器会优先过滤下数组

  • 参数 array:待检查的数组 [values] 要删除的值,必须是数组 迭代器:每一个数组里面的值都需要执行
  • 返回值 (*):返回array
  let array = [1.3, 3.2, 3.4, 4.4, 5.3, 3.2, 2.1, 6.7, 2.8];
  _.pullAllBy(array, [2, 3], Math.floor);
  console.log(array);
 // [1.3, 4.4, 5.3, 6.7]
  • _.pullAt(array,[indexes])

根据索引indexes,移除array中对应的元素,并返回被移除元素的数组,这个方法会改变原数组

  • 参数 array:待检查的数组 [indexes] 要移除元素的索引
  • 返回值 (*):返回array
  let array = [1.3, 3.2, 3.4, 4.4, 5.3, 3.2, 2.1, 6.7, 2.8];
  _.pullAt(array, 1);
  console.log(array);
 // [1.3,3.4, 4.4, 5.3, 3.2, 2.1, 6.7, 2.8];
  • _.remove(array,迭代器)

移除迭代器中返回是真的元素

  • 参数 array:要修改的数组 迭代器:每次迭代调用的函数
  • 返回值 (*):返回array
  let result = _.remove([1, 2, 3, 4, 5, 6], function(item) {
    return item % 2 == 0 ? true : false;
  });
  console.log(result); 
  • _.reverse(array)

反转array使得第一个元素变成最后一个元素,这个方法会改变原数组

  • 参数 array:要修改的数组
  • 返回值 (*):返回array
  let array = [1, 2, 3, 4, 2, 5, 6];
  _.reverse(array);
  console.log(array);
 // [6,5,2,4,3,2,1]
  • _.slice(array,[start=0],[end=array.length])

裁剪数组array,从start位置开始到end结束(包前不包后) 不改变原数组

  • 参数 array:要裁剪的数组 start=0:开始的位置 [end=array.length]:结束的位置
  • 返回值 (*):返回array
  let array = [1, 2, 3, 4, 2, 5, 6];
  let result = _.slice(array, 0, 4); 
  console.log(array);
  console.log(result);
  // [1,2,3,4]
  • _.uniq(array) 去重

创建一个去重后的array的数组副本,只有第一次出现的元素才能被保留,不会改变原数组

  • 参数 array:要裁剪的数组
  • 返回值 (*):返回array
  let array = [1, 2, 3, 4, 2, 5, 6];
  let result = _.uniq(array);
  console.log(array);
  console.log(result);
  // [1,2,3,4,5,6]

评论

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×