在现代 Web 开发中，文本输入是极为常见的操作，然而，不同用户和环境的文本输入方式和输入内容却千差万别，特别是对于跨越多个国家和语言的 Web 应用，无论是字符编码、文本格式还是文本校验的问题都需要解决。ES12 中的文本标准化 API 可以帮助我们解决这些问题，让我们来看一看这些功能。
文本标准化
在 Web 应用中，文本的输入方式和内容可能会来源于多个地方。例如，用户输入、从服务器获取的数据、从缓存中读取的数据等。而不同来源的文本在字符编码和格式化等方面可能存在差异，这就需要对文本进行标准化处理。
ES12 中的文本标准化 API 包括了多种方法来标准化不同来源的文本，应用这些方法可以确保我们获取到的文本在编码和格式化方面是正确的。
1. String.prototype.normalize()
normalize() 方法可以将字符串标准化为指定的 Unicode 标准格式，包括 NFC、NFD、NFKC 和 NFKD 四种格式。其中，NFC 和 NFD 是对整个文本进行标准化，NFKC 和 NFKD 是在标准化的同时将一些特殊字符转换为其标准形式。
例如，我们使用 normalize() 方法将字符串标准化为 NFC 格式，代码如下：
const str = "\u1E9B\u0323"; // "ẛ̣"
console.log(str.normalize("NFC")); // "ẛ̣"在 normalize() 方法中，我们可以通过传入参数来指定文本标准化的格式，这里我们传入了 NFC，表示标准化为 NFC 格式。
2. Intl 对象
ES12 中的 Intl 对象提供了多种用于处理文本的 API，包括字符编码和日期时间格式化等。在字符编码方面，Intl 对象提供了 Intl.CharsetDetector 和 Intl.Encoding 两个 API，应用这些 API 可以自动识别文本的字符编码，并将其转换为指定格式的文本。
例如，我们使用 Intl.CharsetDetector API 来自动识别文本的字符编码：
// 假设 data 为从服务器端获取到的文本 const data = "\x3C\x68\x74\x6D\x6C\x3E\u003C\x2F\x68\x74\x6D\x6C\x3E"; // "<html></html>" const detector = new Intl.CharsetDetector(); detector.feed(data); detector.done().then(result => console.log(result.encoding)); // "windows-1252"
在上面的代码中，我们传入了一个文本 data，其中包含了多个字符编码格式的文本。通过 new Intl.CharsetDetector() 创建一个字符编码检测器，然后通过 feed() 方法将文本输入到检测器中，最后通过 done().then() 方法获取检测器的输出结果，并输出文本的字符编码。
文本校验
除了字符编码和格式化的问题外，Web 应用中还需要对文本进行校验，以确保输入的文本符合预期的格式和内容。ES12 中的文本标准化 API 提供了多种用于文本校验的方法，包括 RegExp、String.prototype.matchAll() 和 String.prototype.replaceAll() 等。
1. RegExp
RegExp 是 ES12 中最基础的文本校验 API，通过正则表达式可以方便地对文本进行格式化和校验。例如，我们可以使用正则表达式来验证电话号码格式是否正确，代码如下：
const pattern = /^\+?[1-9]\d{1,14}$/; // 电话号码格式正则表达式
const phone = "+8613800138000"; // 假设 phone 是用户输入的电话号码
console.log(pattern.test(phone)); // 输出 true在上面的代码中，我们定义了一个电话号码格式的正则表达式 pattern，然后通过 test() 方法验证用户输入的电话号码。
2. String.prototype.matchAll()
matchAll() 方法是 ES12 中新增的一个方法，可以返回一个迭代器，用于匹配所有符合正则表达式的字符串。例如，我们可以使用 matchAll() 方法来查找所有等式中的未知量，代码如下：
const equation = "2x + 3y = 5z";
const pattern = /[a-z]/g; // 匹配所有小写字母
for (const match of equation.matchAll(pattern)) {
console.log(match[0]); // 输出 x y z
}在上面的代码中，我们通过正则表达式 [a-z] 匹配了所有小写字母，并使用 matchAll() 方法迭代查找等式中的未知量。
3. String.prototype.replaceAll()
replaceAll() 方法可以替换所有符合正则表达式的字符串，并返回替换后的字符串。例如，我们可以使用 replaceAll() 方法将文本中所有空格替换为短横线 -，代码如下：
const str = "hello world"; console.log(str.replaceAll(/\s/g, "-")); // 输出 "hello-world"
在上面的代码中，我们使用正则表达式 \s 匹配所有空格，并将其替换为短横线 -。
总结
在本文中，我们介绍了 ES12 中的文本标准化 API，并详细说明了如何使用这些 API 处理输入。特别是在 Web 应用开发中，文本处理是非常重要的一环，使用 ES12 中的文本标准化 API 可以帮助我们解决字符编码、格式化和校验等问题，提高 Web 应用的健壮性和可靠性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6547332a7d4982a6eb191851