Lodash常用方法

【數組常用】

chunk，數組分組，變成二維數組

_.chunk(['a', 'b', 'c', 'd'], 2);
// => [['a', 'b'], ['c', 'd']]
 
_.chunk(['a', 'b', 'c', 'd'], 3);
// => [['a', 'b', 'c'], ['d']]

compact，數組過濾，返回全為真值的新數組

_.compact([0, 1, false, 2, '', 3]);
// => [1, 2, 3]

difference，數組過濾，通過一個給定的數組進行過濾

_.difference([3, 2, 1], [4, 2]);
// => [3, 1]

flattenDeep，拍平為一維數組

_.flattenDeep([1, [2, [3, [4]], 5]]);
// => [1, 2, 3, 4, 5]

fromPairs，將二維數組轉化為對象

_.fromPairs([['fred', 30], ['barney', 40]]);
// => { 'fred': 30, 'barney': 40 }

toPairs，將對象轉為二維數組

_.toPairs({ 'fred': 30, 'barney': 40 });
// => [['fred', 30], ['barney', 40]]

head，獲取數組第一項

_.head([1, 2, 3]);
// => 1
 
_.head([]);
// => undefined

last，獲取數組最后一項

_.last([1, 2, 3]);
// => 3

initial，去掉數組中最后一項

_.initial([1, 2, 3]);
// => [1, 2]

tail，去掉數組中的第一項

_.tail([1, 2, 3]);
// => [2, 3]

uniq，數組去重

_.uniq([2, 1, 2]);
// => [2, 1]

intersection，多個數組取交集

_.intersection([2, 1], [4, 2], [1, 2]);
// => [2]

union，多個數組取并集

_.union([2], [1, 2]);
// => [2, 1]

xor，多個數組中去重

_.xor([2, 1], [2, 3]);
// => [1, 3]

pull，通過給定的值過濾，改變原數組

var array = [1, 2, 3, 1, 2, 3];
 
_.pull(array, 2, 3);
console.log(array);
// => [1, 1]

without，通過給定的值過濾，返回新數組

_.without([2, 1, 2, 3], 1, 2);
// => [3]

remove，從數組中移除符合條件的項

var array = [1, 2, 3, 4];
var evens = _.remove(array, function(n) {
  return n % 2 == 0;
});
 
console.log(array);
// => [1, 3]
 
console.log(evens);
// => [2, 4]

zip & unzip，將多個長度相同的一維數組轉為一個二維數組，或者反操作

var zipped = _.zip(['fred', 'barney'], [30, 40], [true, false]);
// => [['fred', 30, true], ['barney', 40, false]]
 
_.unzip(zipped);
// => [['fred', 'barney'], [30, 40], [true, false]]

zipObject，多個長度相同的一維數組轉為一個對象形式

_.zipObject(['a', 'b'], [1, 2]);
// => { 'a': 1, 'b': 2 }

【集合】

countBy，統計數組中項目出現的次數

_.countBy([6.1, 4.2, 6.3], Math.floor);
// => { '4': 1, '6': 2 }
 
// The `_.property` iteratee shorthand.
_.countBy(['one', 'two', 'three'], 'length');
// => { '3': 2, '5': 1 }

groupBy，根據對item的變換對數組進行分組，組成聚合的對象

_.groupBy([6.1, 4.2, 6.3], Math.floor);
// => { '4': [4.2], '6': [6.1, 6.3] }
 
// The `_.property` iteratee shorthand.
_.groupBy(['one', 'two', 'three'], 'length');
// => { '3': ['one', 'two'], '5': ['three'] }

keyBy，根據對item中key的變換作為key，將item作為value，組成聚合的對象

var array = [
  { 'dir': 'left', 'code': 97 },
  { 'dir': 'right', 'code': 100 }];
 
_.keyBy(array, function(o) {
  return String.fromCharCode(o.code);
});
// => { 'a': { 'dir': 'left', 'code': 97 }, 'd': { 'dir': 'right', 'code': 100 } }
 
_.keyBy(array, 'dir');
// => { 'left': { 'dir': 'left', 'code': 97 }, 'right': { 'dir': 'right', 'code': 100 } }

orderBy，根據某個字段排序，后者排序不會影響前者排序

var users = [
  { 'user': 'fred',   'age': 48 },
  { 'user': 'barney', 'age': 34 },
  { 'user': 'fred',   'age': 40 },
  { 'user': 'barney', 'age': 36 }
];
 
// 以 `user` 升序排序 再  `age` 以降序排序。
_.orderBy(users, ['user', 'age'], ['asc', 'desc']);
// => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]

sortBy，根據迭代函數中的返回結果升序排列

var users = [
  { 'user': 'fred',   'age': 48 },
  { 'user': 'barney', 'age': 36 },
  { 'user': 'fred',   'age': 40 },
  { 'user': 'barney', 'age': 34 }
];
 
_.sortBy(users, function(o) { return o.user; });
// => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]
 
_.sortBy(users, ['user', 'age']);
// => objects for [['barney', 34], ['barney', 36], ['fred', 40], ['fred', 48]]
 
_.sortBy(users, 'user', function(o) {
  return Math.floor(o.age / 10);
});
// => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]

partition，根據item中的多個key對數組分組

var users = [
  { 'user': 'barney',  'age': 36, 'active': false },
  { 'user': 'fred',    'age': 40, 'active': true },
  { 'user': 'pebbles', 'age': 1,  'active': false }
];
 
_.partition(users, function(o) { return o.active; });
// => objects for [['fred'], ['barney', 'pebbles']]
 
// The `_.matches` iteratee shorthand.
_.partition(users, { 'age': 1, 'active': false });
// => objects for [['pebbles'], ['barney', 'fred']]
 
// The `_.matchesProperty` iteratee shorthand.
_.partition(users, ['active', false]);
// => objects for [['barney', 'pebbles'], ['fred']]
 
// The `_.property` iteratee shorthand.
_.partition(users, 'active');
// => objects for [['fred'], ['barney', 'pebbles']]

size，返回長度

_.size([1, 2, 3]);
// => 3
 
_.size({ 'a': 1, 'b': 2 });
// => 2
 
_.size('pebbles');
// => 7

【函數】

debounce，防抖

// 避免窗口在變動時出現昂貴的計算開銷。
jQuery(window).on('resize', _.debounce(calculateLayout, 150));
 
// 當點擊時 `sendMail` 隨后就被調用。
jQuery(element).on('click', _.debounce(sendMail, 300, {
  'leading': true,
  'trailing': false
}));
 
// 確保 `batchLog` 調用1次之后，1秒內會被觸發。
var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
var source = new EventSource('/stream');
jQuery(source).on('message', debounced);
 
// 取消一個 trailing 的防抖動調用
jQuery(window).on('popstate', debounced.cancel);

throttle，節流

// 避免在滾動時過分的更新定位
jQuery(window).on('scroll', _.throttle(updatePosition, 100));
 
// 點擊后就調用 `renewToken`，但5分鐘內超過1次。
var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
jQuery(element).on('click', throttled);
 
// 取消一個 trailing 的節流調用。
jQuery(window).on('popstate', throttled.cancel);

defer，延遲調用

_.defer(function(text) {
  console.log(text);
}, 'deferred');
// => 一毫秒或更久一些輸出 'deferred'。

once，傳入的函數只會被調用一次

var initialize = _.once(createApplication);
initialize();
initialize();
// `initialize` 只能調用 `createApplication` 一次。

【語言】

_.cloneDeep(value)，深拷貝

var objects = [{ 'a': 1 }, { 'b': 2 }];
 
var deep = _.cloneDeep(objects);
console.log(deep[0] === objects[0]);
// => false

eq，比較是否相等，包括引用

var object = { 'a': 1 };
var other = { 'a': 1 };
 
_.eq(object, object);
// => true
 
_.eq(object, other);
// => false
 
_.eq('a', 'a');
// => true
 
_.eq('a', Object('a'));
// => false
 
_.eq(NaN, NaN);
// => true

isEqual，只比較值，不包括引用

var object = { 'a': 1 };
var other = { 'a': 1 };
 
_.isEqual(object, other);
// => true
 
object === other;
// => false

isEmpty，沒有枚舉即為空

_.isEmpty(null);
// => true
 
_.isEmpty(true);
// => true
 
_.isEmpty(1);
// => true
 
_.isEmpty([1, 2, 3]);
// => false
 
_.isEmpty({ 'a': 1 });
// => false

toArray，轉為數組

_.toArray({ 'a': 1, 'b': 2 });
// => [1, 2]
 
_.toArray('abc');
// => ['a', 'b', 'c']
 
_.toArray(1);
// => []
 
_.toArray(null);
// => []

【數學】

mean，取平均值

_.mean([4, 2, 8, 6]);
// => 5

sum，求和

_.sum([4, 2, 8, 6]);
// => 20

【對象】

invert，創建一個object鍵值倒置后的對象

 
_.invert(object);
// => { '1': 'c', '2': 'b' }

omit，去除對象中指定的鍵

var object = { 'a': 1, 'b': '2', 'c': 3 };
 
_.omit(object, ['a', 'c']);
// => { 'b': '2' }

pick，創建一個從 object 中選中的屬性的對象

var object = { 'a': 1, 'b': '2', 'c': 3 };
 
_.pick(object, ['a', 'c']);
// => { 'a': 1, 'c': 3 }
最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Array .compact(array) 創建一個新數組，包含原數組中所有的非假值元素。例如false, nul...
    wyc0859閱讀 1,686評論 0贊 1
  • 1. _.chunk(array, [size=1]) 將數組（array）拆分成多個size長度的區塊，并將這...
    柚子多肉閱讀 737評論 1贊 1
  • 對數據，特別是數組和對象進行各種讀寫等操作：比如去重，拷貝，合并，過濾，求交集，求和等等官網：https://ww...
    肥羊豬閱讀 854評論 0贊 0
  • 找數組中的相同key項的對象() intersectionBy 去重uniqBy 返回符合元素的 index，否則...
    沐深閱讀 220評論 0贊 0
  • 集合 1 _.map(collection, [iteratee=_.identity]) 1.1 定義 創建一個...
    六寸光陰丶閱讀 2,088評論 0贊 0