Lodash 是一个非常流行的 JavaScript 实用工具库,它提供了一系列优化后可重复使用的函数,简化了 JS 开发中各种常见任务的编写。

以下是 Lodash 常用功能及用法的详细介绍:

一、数组操作

1.复制数组:clone(array)

用法举例:

const arr1 = [1, 2, 3];const arr2 = _.clone(arr1);console.log(arr2); // [1, 2, 3]

2.合并多个数组:concat(...arrays)

用法举例:

const arr1 = [1, 2];const arr2 = [3, 4];const arr3 = _.concat(arr1, arr2);console.log(arr3); // [1, 2, 3, 4]

3.删除数组中所有符合条件的元素:remove(array, [predicate=_.identity])

用法举例:

const arr = [1, 2, 3, 4, 5];_.remove(arr, n => n % 2 === 0); // 删除所有偶数console.log(arr); // [1, 3, 5]

4.打乱数组顺序:shuffle(array)

用法举例:

const arr = [1, 2, 3, 4, 5];_.shuffle(arr);console.log(arr); // [3, 1, 5, 4, 2](随机顺序)

5.数组去重:uniq(array)

用法举例:

const arr = [1, 1, 2, 3, 3, 4, 5];_.uniq(arr);console.log(arr); // [1, 2, 3, 4, 5]

二、对象操作

1.复制对象:clone(value)

用法举例:

const obj1 = { foo: 'bar' };const obj2 = _.clone(obj1);console.log(obj2); // {foo: "bar"}

2.深度合并多个对象:merge(object, [sources])

用法举例:

const object = {a: [{ b: { c: 3 } }],d: { e: 2 },};const other = {a: [{ b: { d: 4 } }],f: { g: 5 },};_.merge(object, other);console.log(object); // {a: [{b: {c: 3, d: 4}}], d: {e: 2}, f: {g: 5}}

3.从对象中获取指定属性的值:get(object, path, [defaultValue])

用法举例:

const obj = { user: { name: 'John' } };const name = _.get(obj, 'user.name', 'unknown');console.log(name); // John

4.判断变量是否为对象类型:isObject(value)

用法举例:

console.log(_.isObject({})); // trueconsole.log(_.isObject(null)); // falseconsole.log(_.isObject(1)); // false

5.对象深度比较:isEqual(value, other)

用法举例:

const obj1 = { foo: 'bar' };const obj2 = { foo: 'bar' };const isEqual = _.isEqual(obj1, obj2);console.log(isEqual); // true

三、字符串操作

1.首字母大写:capitalize([string=''])

用法举例:

console.log(_.capitalize('hello world')); // 'Hello world'

2.转义 HTML 字符:escape([string=''])

用法举例:

console.log(_.escape('Hello')); // '<div>Hello</div>'

3.将字符串转换为驼峰式:camelCase([string=''])

用法举例:

console.log(_.camelCase('foo_bar_baz')); // 'fooBarBaz'

4.将字符串转换为下划线式:snakeCase([string=''])

用法举例:

console.log(_.snakeCase('fooBarBaz')); // 'foo_bar_baz'

5.去除字符串两端的空格:trim([string=''], [chars=whiteSpace])

用法举例:

console.log(_.trim(' hello world ')); // 'hello world'

四、函数操作

1.延迟执行函数:debounce(func, [wait=0], [options={}])

用法举例:

function foo() {console.log('bar');}const debouncedFoo = _.debounce(foo, 1000);debouncedFoo(); // 等待1秒后才会输出'bar'

2.在函数被调用 n 秒后执行:delay(func, wait, args)

用法举例:

function foo() {console.log('bar');}_.delay(foo, 1000); // 等待1秒后输出'bar'

3.绑定函数的 this 对象:bind(func, thisArg, [partials])

用法举例:

const obj = { x: 42 };function foo() {return this.x;}const boundFoo = _.bind(foo, obj);console.log(boundFoo()); // 42

4.只允许函数执行一次:once(func)

用法举例:

function foo() {console.log('bar');}const onceFoo = _.once(foo);onceFoo(); // 只输出一次'bar'onceFoo();onceFoo();

5.函数节流:throttle(func, [wait=0], [options={}])

用法举例:

function foo() {console.log('bar');}const throttledFoo = _.throttle(foo, 1000);throttledFoo(); // 立即输出'bar'setTimeout(() => {throttledFoo(); // 1秒后再次输出'bar'}, 1500);

以上只是 Lodash 提供的一些常用功能及用法。实际上 Lodash 中提供的函数非常丰富,涵盖了开发中常见的各种场景。如果你需要日常开发中的某种功能,可以先查看 Lodash 是否提供相应的函数,避免重复造轮子。