lodash用法系列1:數組集合操做

Lodash用來操做對象和集合,比Underscore擁有更多的功能和更好的性能。

官網:https://lodash.com/
引用:<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
安裝:npm install lodash

首先經過npm安裝lodash:
npm i --save lodash

在js文件中引用lodash:
var _ = require('lodash');  html

import * as _ from "lodash";ajax

 

 目錄npm

  1. 從一個數組中的對象屬性獲取值的數組  map
  2. 遍歷  forEach數組

  3. 排序 sortBy函數

  4. 向一個集合中插入某個元素而不改變固有的順序 sortedIndex性能

  5. 經過where方法過濾集合,傳入對象 where大數據

  6. 經過 filter 方法過濾集合ui

  7. 經過 reject 方法過濾到不須要的集合元素,傳入對象spa

  8. 找到特定的元素 find, findLastprototype

  9. 從數組中獲取一些 take takeRight

  10. 把大數據分紅多份分批處理 chunks, isUndefined, last, defer, partial

  11. 去除集合中的重複部分 uniq

  12. 分組 groupBy

  13. 獲取最小/最大 min/max

  14. 獲取集合大小 size

  15. 提取嵌套集合中的有用部分 pluck, flatten

  16. 去除集合中的無效元素,好比null, 0, undefined等。compact

  17. 去除集合中不符合某種規律的元素 【pluck, compact, startsWith】

  18. 全部集合元素知足條件或部分集合元素知足條件 every

  19. 並集、交集、補集 【union, interseciton, xor】

1.  從一個數組中的對象屬性獲取值的數組  map

// v4.x 以後: 
_.map(users, 'id'); // [12, 14, 16, 18] // Array.prototype.map: 
users.map(user => user.id); // [12, 14, 16, 18] // v4.x 以前:
_.pluck(users, 'id'); // [12, 14, 16, 18]

 

2. 遍歷  forEach

_.forEach(collection, function(name){}); _.forEach(collection, function(name, index){})

3. 排序 sortBy

排序,字段字符串
var strSortResult = _.sortBy('cda').join(' '); console.log(strSortResult);

根據數組元素的某個字段排序,在匿名函數中聲明排序字段

var arr = [ {name: 'aa',age:22}, {name: 'bb',age:23} ]; var arrSortResult = _.sortBy(arr, function(item){ return item.name; }) _.forEach(arrSortResult, function(item){ console.log(item.name); });

經過字符串聲明排序字段    _.sortBy(arr, 'name'); 

經過字符串數組聲明排序字段   _.sortBy(arr, ['name','age']); 

4. 向一個集合中插入某個元素而不改變固有的順序 sortedIndex

var collection = ['a', 'b', 'c', 'd', 'f']; console.log('before: ' + collection.join(' ')); //要插入的值
var toBeInserted = 'e'; //要插入值再數組中的索引
var sortedIndex = _.sortedIndex(collection, toBeInserted); //插入 splice中數組的指定索引位置插入元素,0表示有0個元數組元素刪除
collection.splice(sortedIndex, 0, toBeInserted); console.log('after:' + collection.join(' '));

5. 經過where方法過濾集合,傳入對象 where

var collection1 = [ {name: 'aa', age:20, gender: 'm'}, {name: 'bb', age:21, gender: 'f'}, {name: 'cc', age:22, gender: 'm'} ]; var result1 = _.where(collection1, {age:20, gender:'m'}); _.forEach(result1, function(item){ console.log(item.name); });

6. 經過 filter 方法過濾集合

經過filter方法過濾集合,傳入字符串

var collection2=[ {name: 'aa', enabled: false}, {name:'bb', enabled:true} ]; var result2 = _.filter(collection2, 'enabled'); _.forEach(result2, function(item){ console.log(item.name); });

經過 filter 方法過濾集合,傳入匿名函數

var collection3 = [ {name: 'aa', size: 'L'}, {name: 'bb', size: 'M'} ]; var result3 = _.filter(collection3, function(item){ return item.size === 'L'; }); _.forEach(result3, function(item){ console.log(item.name); });

7. 經過 reject 方法過濾到不須要的集合元素,傳入對象

過濾不要的,過濾條件爲對象

var collection4 = [ {name:'soccer', enabled: true}, {name: 'basketball', enabled: false} ]; var result4 = _.reject(collection4,{enabled:false}); _.forEach(result4, function(item){ console.log(item.name); });

8. 找到特定的元素 find, findLast

搜尋,過濾條件爲對象

//只要找打一個就返回結果
_.find(collection, {age:20}); _.findLast(collection,{age:20});

9. 從數組中獲取一些 take takeRight

從前到後 -- 數組,獲取一些  take

var array = []; _.take(array, 2);

從前到後 -- 字符串,獲取一些  take

_.take('hello',2).join(' ');

從後到前 -- 數組,獲取一些  takeRight,從後面開始

var arr = []; _.takeRight(array, 2);

從後到前 -- 字符串,獲取一些  takeRight,從後面開始

_.takeRight('hello', 2).join(' ');

10. 把大數據分紅多份分批處理 chunks, isUndefined, last, defer, partial

// 使用range方法生成了一個比較大的集合,再使用chunk方法分隔成多份。使用process無限遞歸處理完全部的份數。
var collection1 = _.range(10000), chunks = _.chunk(collection1,50);//每一份50個,總共分爲20份 //處理chunks,無限遞歸
function process(chunks, index){ //找到須要被處理的chunk
  var chunk = chunks[index]; //判斷chunk是否爲undefined
  if(_.isUndefined(chunk)){ return; } console.log('working ' + _.last(chunk)); //defer讓堆棧上有足夠的時間做清理,defer接受一個回調函數 //partial讓某個函數執行
  _.defer(_.partial(process, chunks, ++index)); } process(chunks,0);

還能夠根據集合長度來進行份數劃分。

var collection _.range(10), size = Math.ceil(0.25 * collection.length); _.chunk(collection, size);

11. 去除集合中的重複部分 uniq

//去除字符串數組中的重複部分
var collection = ['','']; _.uniq(collection); //uniq接受匿名函數
var collection = [ {firstName: '', lastName: ''}, ... ]; _.uniq(collection, function(item){ return item.firstName + item.lastName; })

12.  分組 groupBy

分組,根據字段

var collection = [ {name:'',size:''}, ... ]; _.groupBy(collection, 'size');

分組,根據匿名函數

var collection = [ {name: '', age:20}, ... ]; _.groupBy(collection, function(item){ return item.age > 20 ? 'old' : 'young'; })

13. 獲取最小/最大 min/max

獲取最小,根據字段

_.min(collectin, 'age');

獲取最大,根據匿名函數

_.max(collecion, function(item){ return item.age + item.workinghours; })

14. 獲取集合大小 size

var collection = [ {name: ''}, ... ]; var first = _.first(collection); _.size(collection); _.size(first.name);//獲取字符串的長度

15. 提取嵌套集合中的有用部分 pluck, flatten

如下想獲取全部集合元素中的employees下的全部對象,即[ { name: 'b' }, { name: 'c' }, { name: 'e' }, { name: 'f' } ]。

第一步經過 pluck 方法獲取[ [ { name: 'b' }, { name: 'c' } ],[ { name: 'e' }, { name: 'f' } ] ]。

第二步經過 flatten 方法獲取想要的結果。

var collection = [ {employer: 'a', employees: [{name:'b'},{name:'c'}]}, {employer: 'd', employees: [{name:'e'},{name:'f'}]} ]; //pluck找出符合條件的字段, //[ [ { name: 'b' }, { name: 'c' } ],[ { name: 'e' }, { name: 'f' } ] ]
var tempResult = _.pluck(collection, 'employees'); console.log(tempResult); //[ { name: 'b' }, { name: 'c' }, { name: 'e' }, { name: 'f' } ]
var employees = _.flatten(tempResult); console.log(employees); var result = _.filter(employees, function(item){ return (/^[bx]/i).test(item.name);//找出name值以b或x開頭的
}); console.log(result);

另外,falttenDeep方法能夠使多層嵌套扁平化成一層。

16. 去除集合中的無效元素,好比null, 0, undefined等。compact

var collection = [ {name: 'aa'}, 0, {name: 'bb'}, null, {name:'cc'}, undefined, {name:'dd'} ]; var letters = ['a', 'b'],//過濾條件
  compactResult = _.compact(collection), result = []; //遍歷打印
_.forEach(compactResult, function(item){ console.log(item.name); }); //操做某個元素
_.each(letters, function(letter){ var filterResult = _.filter(compactResult, function(item){ return _.startsWith(item.name.toLowerCase(), letter); }); //合併數組
  result = result.concat(filterResult); }); //[ { name: 'aa' }, { name: 'bb' } ]
console.log(result);

17. 去除集合中不符合某種規律的元素 【pluck, compact, startsWith】

如下,除去不包含name字段的集合元素。

var collection = [ {name: 'a'}, {name: 'b'}, {name: 'c'}, {}, true, 1 ]; //先篩選出包含name字段的值,不包含的顯示undefined
var pluckResult = _.pluck(collection, 'name'); //[ 'a', 'b', 'c', undefined, undefined, undefined ]
console.log(pluckResult); var letters = ['a', 'b'], //再去除undefined
    compactResult = _.compact(pluckResult), result = []; //[ 'a', 'b', 'c' ]
console.log(compactResult); _.each(letters, function(letter){ var filterResult = _.filter(compactResult, function(item){ return _.startsWith(item.toLowerCase(), letter); }); result = result.concat(filterResult); }); console.log(result);

18. 全部集合元素知足條件或部分集合元素知足條件 every

判斷全部集合元素知足某種條件。

var _ = require('lodash'); var collection = [ {name: 'a'}, {name: 'b'}, {name: 'c'} ]; if(!_.every(collection, 'name')){ console.log("有集合元素不包含name字段"); }

判斷部分集合元素知足條件。

_.some(collection, 'name')

19. 並集、交集、補集 【union, interseciton, xor】

var a = []; var b = []; var c = []; _.union(a, b, c); _.intersection(a, b, c); _.xor(a, b);

 

轉:http://www.javashuo.com/article/p-rbprafll-kh.html

相關文章
相關標籤/搜索