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