lodash
npm i lodash-es
# npm i lodash # commonjs
npm i @types/lodash-es -D
1. 数组操作
_.chunk(array, size)
:将数组分成多个指定长度的子数组。_.chunk(['a', 'b', 'c', 'd'], 2); // => [['a', 'b'], ['c', 'd']]
_.difference(array, [values])
:创建一个不包含values
中指定值的新数组。_.difference([2, 1], [2, 3]); // => [1]
_.flatten(array)
:将多层嵌套数组展开为一层。_.flatten([1, [2, [3, [4]], 5]]); // => [1, 2, [3, [4]], 5]
_.uniq(array)
:返回去重后的数组。_.uniq([2, 1, 2, 3]); // => [2, 1, 3]
2. 对象操作
_.merge(object, [sources])
:递归合并对象属性。const object = { a: [{ b: 2 }, { d: 4 }] }; const other = { a: [{ c: 3 }, { e: 5 }] }; _.merge(object, other); // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }
_.get(object, path, [defaultValue])
:安全地获取嵌套对象属性值,避免访问不存在的属性时抛出错误。const object = { a: [{ b: { c: 3 } }] }; _.get(object, 'a[0].b.c'); // => 3 _.get(object, 'a[1].b.c', 'default'); // => 'default'
_.set(object, path, value)
:设置对象的嵌套属性值,若路径不存在会自动创建。const object = { a: [{ b: { c: 3 } }] }; _.set(object, 'a[0].b.c', 4); // => { 'a': [{ 'b': { 'c': 4 } }] }
_.omit(object, [paths])
:返回一个新对象,忽略指定的键。const object = { a: 1, b: 2, c: 3 }; _.omit(object, ['a', 'c']); // => { 'b': 2 }
3. 函数操作
_.debounce(func, [wait=0], [options={}])
:创建一个防抖动函数,在连续调用时延迟执行(适合按钮点击、搜索框等)。const handleInput = _.debounce(value => console.log(value), 300);
_.throttle(func, [wait=0], [options={}])
:创建一个节流函数,限制函数在指定时间内的调用次数(适合滚动事件等)。const handleScroll = _.throttle(() => console.log('Scroll event'), 200);
4. 字符串操作
_.camelCase(string)
:将字符串转为驼峰命名。_.camelCase('Foo Bar'); // => 'fooBar'
_.kebabCase(string)
:将字符串转为短横线连接的命名。_.kebabCase('Foo Bar'); // => 'foo-bar'
_.capitalize(string)
:将字符串的首字母大写。_.capitalize('hello'); // => 'Hello'
5. 集合操作
_.map(collection, iteratee)
:遍历集合并对每个元素应用一个函数,返回新数组。_.map([1, 2, 3], n => n * 3); // => [3, 6, 9]
_.filter(collection, predicate)
:筛选出满足条件的元素。const users = [ { name: 'Fred', age: 48 }, { name: 'Barney', age: 36 }, ]; _.filter(users, o => o.age < 40); // => [{ name: 'Barney', age: 36 }]
_.find(collection, predicate, [fromIndex=0])
:返回第一个满足条件的元素。const users = [ { name: 'Fred', age: 48 }, { name: 'Barney', age: 36 }, ]; _.find(users, { age: 36 }); // => { name: 'Barney', age: 36 }
6. 实用工具
_.cloneDeep(value)
:深拷贝对象或数组。const obj = { a: 1, b: { c: 2 } }; const newObj = _.cloneDeep(obj);
_.isEqual(value, other)
:深度比较两个值是否相等。_.isEqual({ a: 1 }, { a: 1 }); // => true
这些是 Lodash
中一些最常用的函数。它的优势在于对对象和数组的处理,提升代码可读性和开发效率。