Intl.Collator 是 JavaScript 中专为多语言排序设计的国际化 API，能正确处理中文拼音顺序、多音字、声调等细节，配合 sort 可实现符合中文用户直觉的排序，支持中英文数字混合内容的自然排序。
Intl.Collator 是 JavaScript 中专为多语言排序设计的国际化 API，它能正确处理中文字符的拼音顺序、多音字、声调敏感性等语义细节，比简单用 localeCompare 或手动转拼音更可靠。配合 Array.prototype.sort，可实现真正符合中文用户直觉的排序效果。
设置中文 locale 并启用拼音排序
中文排序默认按 Unicode 码点（即字形编码）排，结果不符合拼音习惯。需显式指定 locale 为 'zh' 或 'zh-CN'，并开启 numeric: true（避免数字被当字符串错位），必要时加 sensitivity: 'base' 忽略声调差异：
-
new Intl.Collator('zh-CN', { numeric: true, sensitivity: 'base' })—— 最常用配置，兼容“张三”“张珊”“张山”等同音不同调场景 - 若需区分声调（如“妈 mā”“麻 mᔓ马 mǎ”），去掉
sensitivity: 'base'，用默认'variant' - 避免用
'zh'而非'zh-CN'，部分旧环境对泛 locale 支持不一致
直接传入 sort 方法，无需手动提取拼音
Collator 实例的 compare 方法可直接作为 sort 的比较函数，无需预先调用 pinyin 库或正则转换。它在底层调用系统/引擎的 ICU 排序规则，准确率高且性能好：
const names = ['王五', '李四', '张三', '陈二', '赵一'];
const collator = new Intl.Collator('zh-CN', { numeric: true });
names.sort(collator.compare); // ✅ 正确按拼音首字母 A-Z 排：赵一、陈二、李四、张三、王五
注意：collator.compare 是已绑定上下文的方法，可安全直接传递，不用写 (a, b) => collator.compare(a, b)。
处理混合内容（中英文、数字、符号）
真实数据常含“iPhone15”“测试版v2.1”“北京-朝阳区”等混合字符串。Intl.Collator 默认按“字母→数字→符号”层级排序，且中英文混排时会将中文字符按拼音、英文字母按字典序自然融合：
- 启用
numeric: true后，“item2”会排在“item10”之前（数值序），而非字符串序的 “item10” - “苹果”会在“Apple”之前（因拼音首字母 A 对应英文 A，ICU 按统一权重比较）
- 若需强制中文优先、英文次之，可先分组再合并；但多数业务场景下默认行为已足够自然
兼容性与降级建议
Intl.Collator 在现代浏览器及 Node.js 14+ 中完全支持。若需兼容 IE 或极老环境：
- 检查支持性：
typeof Intl?.Collator === 'function' - 降级方案：用轻量拼音库（如
pinyin-pro）预生成拼音字段，再按拼音字符串排序（牺牲实时性和内存） - 不推荐用
String.prototype.localeCompare替代 —— 它虽也支持 locale，但在数组排序中反复创建比较逻辑，性能差且不易统一配置
不复杂但容易忽略：排序是纯前端行为，服务端返回的数据无需预处理；只要确保 Collator 配置合理，中文用户看到的就是他们预期的“字典序”。
