都听说过 lodash，但你会用吗？

0. 引言

Lodash 是 JavaScript 社区最出名的一个工具库，提供了许多高效、高兼容性的工具函数。

不过，随着浏览器和 web 技术的发展，一些人开始反对在项目中使用 lodash。主要原因有：

• ES6 之后拓展了 JavaScript 特性，许多功能不再需要额外工具库。
• 现代浏览器对 ES 语法的支持性提升。
• Babel 等编译工具能将 ES6 编译成 ES5，更优雅地解决了 ES6 语法的兼容性问题。
• 为了几个工具函数而引入了整个 lodash，增加了项目的体积。

本文来探讨一下，我们该不该在项目中使用 lodash，以及如何正确使用 lodash。是的，这个看起来有点标题党的标题，有两层含义：

• 你会在项目中使用 lodash 吗？
• 你会正确地使用 lodash 吗？

1. 我们还需要 lodash 吗？

个人认为，应该优先使用 ES 原生语法，同时，在大部分项目中仍然推荐使用 lodash 作为拓展工具库。原因如下：

• Lodash 不止 ES6，有更多 ES6 难以实现的功能，比如常见的深拷贝。
• 提高开发效率、简化代码。lodash 中的函数，都是社区开发者从多年的实践中提炼出来的常用功能，并且经过广泛的考验和优化，使用库函数往往比自己实现有更好的性能和鲁棒性。
• Lodash 支持多种模块化方案，配合 tree shaking 技术或者使用单独的函数模块，几乎不会导致冗余代码。

不管怎么样，lodash 目前仍然保持着 4 千多万的周下载了，就足以见得它的流行程度。

2. 还是不想用 lodash ？

即使你坚持不肯使用 lodash，我认为仍然有必要了解 lodash 提供了哪些功能，这些功能你会经常在开发中遇到。这个时候，你可以从 You Don’t Need Lodash Underscore 中查看如何使用原生语法实现。

3. Lodash 按需引入

最常见的引入 lodash 的方式是：

// 方式1：引入整个lodash对象
import _ from "lodash";

// 方式2：按名称引入特定的函数
import { cloneDeep } from "lodash"; 
1
2
3
4
5

这两种方式都会引入整个 lodash 库。Lodash 含有许多函数，项目里一般只会用到其中的小部分，为了避免引入不必要的代码，lodash 提供了多种支持按需加载的方式。

A）使用打包插件实现按需加载（推荐）

插件 babel-plugin-lodash 和 lodash-webpack-plugin 能够在打包时去掉不必要的 lodash 代码，减小产物体积。

B）指用具体的功能模块

// 只引入 array 模块的功能
import array from "lodash/array";

// 只引入 cloneDeep 函数
import cloneDeep from "lodash/cloneDeep"; 
1
2
3
4
5

这种方式只会引入引用路径对应的模块，无需使用插件，也不会有冗余代码。缺点是每个 import 语句只能引入一个函数，可能导致多个 import 语句。

C）使用单独的函数库

Lodash 为每个方法提供了单独的 npm 包，你可以只下载你想要的函数。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/木道寻08/article/detail/923524