JavaScript 中的 Intl.Collator 与语言敏感排序

在 JavaScript 中，对字符串数组进行排序是一个常见的操作，但直接使用 Array.prototype.sort() 进行字符串排序存在一个关键问题：它默认使用字符串的 Unicode 码点顺序进行排序。这对于简单的英文字符串可能没问题，但对于包含重音符号、特殊字符或不同语言（如德语、瑞典语、中文等）的字符串，排序结果往往不符合该语言或地区的文化习惯和字母表顺序。为了解决这个问题，ECMAScript Internationalization API (ECMA-402) 引入了 Intl.Collator 对象，它提供了一种语言敏感的字符串比较功能。

知识点描述
Intl.Collator 是一个构造函数，它创建了一个“排序器”（Collator）对象。这个对象可以根据指定的语言（区域）设置和可选的配置选项，来比较两个字符串的顺序。它可以正确地排序像 “ä” 在德语中应该排在 “a” 之后、“z” 之前，而在瑞典语中应该排在 “z” 之后这样的语言特定规则。

解题/讲解过程

1. 问题引入：默认排序的局限性
   首先，让我们看一个简单的例子，说明 Array.prototype.sort() 默认行为的问题：

   const words = ['apple', 'Äpfel', 'zoo', 'über'];
   words.sort();
   console.log(words);
   // 输出: [ 'Äpfel', 'apple', 'über', 'zoo' ]
   

   在德语中，我们通常希望 “ä” 被当作 “a” 的变体来处理，所以 “Äpfel” 应该排在 “apple” 之前。但默认的 Unicode 排序将大写字母和带变音符号的字母都排在了小写字母前面，导致 “Äpfel” 排在了 “apple” 之前。这并不符合德语的字母表顺序。

2. 解决方案：使用 Intl.Collator
   Intl.Collator 允许我们创建一个“排序器”，它理解特定语言的排序规则。
   基本语法：

   new Intl.Collator([locales[, options]])
   

   • locales（可选）：一个字符串或字符串数组，表示语言代码（如 'de' 表示德语，'en-US' 表示美式英语，'zh-CN' 表示简体中文）。如果忽略，则使用运行环境的默认区域设置。
   • options（可选）：一个配置对象，可以精细控制排序行为。

3. 步骤一：创建基本排序器
   我们创建一个针对德语（德国）的排序器：

   const germanCollator = new Intl.Collator('de-DE');
   

   这个排序器对象内部已经包含了德语的排序规则。

4. 步骤二：使用排序器的 compare 方法
   排序器对象的主要方法是 compare。它接受两个字符串参数 a 和 b，并返回一个数字：

   • 如果 a 在排序顺序中位于 b 之前，则返回一个负数（例如 -1）。
   • 如果 a 在排序顺序中与 b 相同，则返回 0。
   • 如果 a 在排序顺序中位于 b 之后，则返回一个正数（例如 1）。
     我们可以直接将它作为回调函数传递给 Array.prototype.sort()：

   const words = ['apple', 'Äpfel', 'zoo', 'über'];
   words.sort(germanCollator.compare);
   console.log(words);
   // 输出: [ 'apple', 'Äpfel', 'über', 'zoo' ]
   

   现在，顺序变成了 ['apple', 'Äpfel', 'über', 'zoo']。在德语中，“ä” 通常被视为 “a” 的变体，所以 “Äpfel” 排在 “apple” 后面是符合字典顺序的（先按基础字母“a”排，再考虑变音符号）。而 “ü” 被视为 “u” 的变体，所以 “über” 排在 “zoo” 之前。这更符合德语的字母表顺序。

5. 步骤三：探索配置选项
   Intl.Collator 的 options 参数提供了强大的控制能力。主要选项包括：

   • sensitivity：比较的敏感度。它决定了比较时考虑哪些差异。
     • 'base'：只比较基础字母，忽略重音、大小写等差异。例如 'a' 和 'ä' 视为相同。
     • 'accent'：考虑重音差异，但忽略大小写。例如 'a' 和 'ä' 不同，但 'a' 和 'A' 相同。（这是很多语言的默认值，如德语、法语）。
     • 'case'：考虑大小写差异，但忽略重音。例如 'a' 和 'A' 不同，但 'a' 和 'ä' 相同。
     • 'variant'：考虑所有差异：重音、大小写等。这是最严格的比较。
   • ignorePunctuation：布尔值。如果为 true，则在比较时忽略标点符号（如空格、连字符、引号）。
   • numeric：布尔值。如果为 true，会将字符串中的数字序列（如 "10"）作为数值进行比较，而不是作为字符序列。这对于排序文件名（如 "file2", "file10", "file20"）非常有用。
   • caseFirst：指定大写字母和小写字母的排序优先级。'upper' 表示大写字母排在小写字母之前，'lower' 则相反。

6. 步骤四：应用复杂选项示例
   a. 数字排序：

   const items = ['file1', 'file10', 'file2', 'file20'];
   items.sort(new Intl.Collator(undefined, { numeric: true }).compare);
   console.log(items);
   // 输出: [ 'file1', 'file2', 'file10', 'file20' ] (正确的数值顺序)
   // 如果没有 { numeric: true }，默认排序会是: [ 'file1', 'file10', 'file2', 'file20' ] (字符串顺序)
   

   b. 忽略大小写和标点：

   const words2 = ['café', 'Cafe', 'cafe', 'café'];
   const collatorCaseInsensitive = new Intl.Collator('fr', { sensitivity: 'base', ignorePunctuation: true });
   // sensitivity: 'base' 会忽略大小写和重音差异
   const uniqueWords = [...new Set(words2.sort(collatorCaseInsensitive.compare))];
   console.log(uniqueWords);
   // 输出: [ 'café' ] （因为所有变体在 'base' 敏感度下被视为相同）
   

7. 步骤五：性能考虑与最佳实践
   由于创建 Intl.Collator 实例会有一些开销，最佳实践是：对于需要多次排序操作的场景，应该创建一次排序器实例并复用，而不是在每次排序时都新建一个。

   // 好：复用排序器
   const collator = new Intl.Collator('de-DE');
   array1.sort(collator.compare);
   array2.sort(collator.compare);
   
   // 不好：每次都新建
   array1.sort(new Intl.Collator('de-DE').compare);
   array2.sort(new Intl.Collator('de-DE').compare);
   

总结
Intl.Collator 是处理国际化字符串排序的强大工具。它通过以下步骤解决问题：

1. 识别需求：当排序需要遵循特定语言或文化的字母顺序时。
2. 创建排序器：使用 new Intl.Collator(locale, options) 实例化，指定语言和比较规则。
3. 应用排序：将排序器实例的 compare 方法作为回调函数传递给数组的 sort 方法。
4. 精细控制：利用 sensitivity、numeric、ignorePunctuation 等选项调整比较行为，以满足特定场景（如数字排序、不区分大小写排序等）。

通过使用 Intl.Collator，开发者可以确保其应用程序在全球范围内提供符合用户语言习惯的正确排序体验。