在 Javascript 中，数字常常用作一种基本的数据类型。在 ES2021 中，引入了一个新的特性-数字分隔符，可以使数字更容易理解并使代码更易读。然而，并不是所有流行的浏览器都支持这一特性，因此使用 babel-plugin-syntax-numeric-separator 这个 NPM 包可以使你的代码更加现代化且更易读。
安装
在安装 babel-plugin-syntax-numeric-separator 前，你首先需要确认以下项目是否已经安装：
- Node.js
- npm 或者 yarn（第三方包管理器）
安装 babel-plugin-syntax-numeric-separator：
使用 npm：
--- ------- ---------- -------------------------------------
使用 yarn：
---- --- ----- -------------------------------------
记得在安装过程中添加 —save-dev 或 --dev。
配置
在你的 Babel 配置文件 .babelrc 中，添加 babel-plugin-syntax-numeric-separator：
- ---------- ---------------------------- -
注意：babel-plugin-syntax-numeric-separator 需要被添加到 plugins 数组的开头，以防止与其他插件发生冲突。
假设现在你有以下代码：
--- --- - ---------
添加该插件后，你可以使用下面的语法重新修改代码：
--- --- - -----------
相比于前者看起来更加美观，不是吗？
示例代码
下面是一个完整的示例代码，在代码中，数值分隔符用以使数字更容易被理解。
--- ------ - ---------------------- --- ---- - - -- - -- ------- - - - - -- - ---------------------- -
在使用 ES2021 之前，上述代码估计看起来像：
--- ------ - ----------------- --- ---- - - -- - -- ------- - - - - -- - ---------------------- -
结论
babel-plugin-syntax-numeric-separator 是一个非常容易使用的 NPM 包，可以使你的代码更加现代化，并更易读。特别是当你需要处理一组更大的整数数据，而又难以看清时，使用数字分隔符特别有用。务必在你的下一个项目中试试这个 NPM 包！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600562f981e8991b448e0c79