lodash的Array使用(一)

Lodash 是一个具有一致接口、模块化、高性能等特性的 JavaScript 工具库，通过降低 array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单。

安装：

npm i --save lodash

在组件内部引入

import * as _ from 'lodash'

array数组的一些方法

• _.chunk(array, size):
  根据size参数将数组分组，size是每一组的长度。如果数组不能均分，最后一组就会包含剩下的元素

arr:Array<number> = [1,2,3,4,5];

console.log(_.chunk(this.arr, 4)); // [ [1,2,3,4],[5]]

• _.compact(Array):
  创建一个数组，其中删除所有的无效的值（包括：false, null, 0, ' ' , undefined, NaN）

arr:Array<any> = [1,2,3,false,0,'',undefined];

console.log(_.compact(this.arr)); // [1,2,3]

• _.concat(Array, Values):
  创建的数组与任何其他数组或值连接成为一个新数组

arr:Array<any> = [1,2,3];

console.log(_.concat(this.arr, 4, [5])); // [1,2,3,4,5]

• _.difference(Array,values)：
  创建未包含在其他给定数组中的值的数组，最后的值由第一个数组决定

arr1 = [1,2,3];
arr2 = [2,3,4];

console.log(_.difference(this.arr1,this.arr2)); // [1]

• _.differenceBy(array, values, iteratee=_.identity)：
  接受迭代传过来的数组的每个元素，并且让两个数组的值进行比较。结果的值和顺序由第一个数组决定

arr1 = [{ name:'zhangsan', age:20}, { name:'lisi', age:23}];

arr2 = [{name:'zhangsan', age:20}, {name:'wangwu', age: 30}];

console.log(_.differenceBy(this.arr1, this.arr2, 'name')); // [{ name:'lisi', age:23}]

• _.differenceWith(array, values, comparator)：
  接受comparator被调用来比较array跟values，结果值的顺序和引用由第一个数组确定，比较器因此调用两个参数。

arr1 = [{ 'x': 1, 'y': 2}, { 'x': 2, 'y': 3}, { 'x': 3, 'y': 4}];

arr2 = [{ 'x': 2, 'y': 3}];

console.log(_.differenceWith(this.arr1, this.arr2, _.isEqual));  // [{ 'x': 1, 'y': 2}, { 'x': 3, 'y': 4}]

• _.drop(array,n)：
  创建一个切片数组，去除array前面的n个元素，默认值为1。

arr = [1,2,3,4,5];

console.log(_.drop(this.arr, 3)); // [4,5]

• _.dropRight(array,n)：
  创建一个切片数组，去除array后面的n个元素，默认值为1。

arr = [1,2,3,4,5];

console.log(_.drop(this.arr, 3)); // [1, 2]

• _.dropRightWhile(array,predicate = _.identity)：
  创建一个array从结尾删除的排除元素的片段，元素被丢弃

  arr1:Array<any> = [
    { name:'test01',isSelect:true},
    { name:'test02',isSelect:false},
    { name:'test03',isSelect:false}
  ];

    console.log(_.dropRightWhile(this.arr1, ['isSelect', false]));

• _.fill(array, value, start=0, end=array.length)：
  填充的元素array与value来自start为止，但不包括end。

arr = [1,2,3,4];

console.log(_.fill(this.arr, 'a', 1,3));  //  [1,'a','a',4];

• _.findIndex(array, predicate=_.identity, fromIndex=0)：
  检索，返回第一个元素的索引，predicate返回的true而不是元素本身

  arr1:Array<any> = [
    { name:'test01',isSelect:true},
    { name:'test02',isSelect:false},
    { name:'test03',isSelect:false}
  ];

  console.log(_.findIndex(this.arr1, ['isSelect', false])); // 1