乐闻世界logo
6月1日 02:04

Lodash 和原生 JavaScript 有什么区别？什么时候该用 Lodash？

Lodash和原生JavaScript有什么区别？什么时候该用Lodash？

Lodash是JavaScript工具库，原生JS是语言内置API。两者功能大量重叠，但Lodash在深拷贝、深合并、对象数组去重、嵌套属性安全访问、防抖节流等场景仍有不可替代的便利性。原生JS的优势在于零体积、性能略优、API更现代。实际项目中优先用原生ES6+特性（?.、??、structuredClone、Set去重等），只在原生写法繁琐或需兼容旧浏览器时按需引入Lodash方法（cloneDeep、merge、groupBy、debounce等），避免全量引入增加约70KB（gzipped）包体积。

追问

数组去重原生和Lodash各怎么写？

javascript
// 原生：Set去重
const unique = [...new Set([1, 2, 2, 3])];

// Lodash：对象数组按属性去重
const uniqueUsers = _.uniqBy(users, 'id');

原生Set处理基本类型够用，对象数组按属性去重则需手写reduce，Lodash的_.uniqBy一行搞定。

深拷贝有哪些方案？

javascript
// 原生JSON方法——丢失函数、undefined、循环引用
JSON.parse(JSON.stringify(obj));

// 原生structuredClone——现代浏览器支持，无法拷贝函数
structuredClone(obj);

// Lodash——覆盖类型最全，循环引用安全
_.cloneDeep(obj);

JSON.parse(JSON.stringify())是最常见的坑：函数、undefined、Date、RegExp、循环引用都会出问题。structuredClone解决了部分问题但仍不支持函数。_.cloneDeep是最可靠的通用方案。

安全访问嵌套属性怎么选？

javascript
const name = user?.profile?.name ?? 'default';  // 原生ES2020
const name = _.get(user, 'profile.name', 'default');  // Lodash

可选链?.加空值合并??已能满足大多数场景。_.get的优势在于属性路径是字符串，可动态拼接，且兼容IE等旧浏览器。

性能和包体积怎么权衡？

原生方法在数组map/filter/reduce等基本操作上性能略优，差距不大。深拷贝场景_.cloneDeep反而比JSON方案更快且更正确。包体积是关键考量：全量引入Lodash约70KB（gzipped），按需引入每个方法仅1-2KB，推荐用lodash-es配合Tree-shaking：

javascript
import cloneDeep from 'lodash/cloneDeep';
import debounce from 'lodash/debounce';

什么场景必须用Lodash？

  • 深合并对象（_.merge）：原生没有等价方法，手写递归容易出错
  • 防抖节流（_.debounce/_.throttle）：原生无内置实现
  • 复杂数据分组（_.groupBy）：原生需reduce手写
  • 链式数据转换（_.chain）：多步操作比原生连续调用更可读
  • 兼容IE等不支持?.、??、structuredClone的环境
标签：Lodash