Web前端之汉字排序、sort与localeCompare的介绍、编码顺序与字典顺序的区别
使用字典顺序对汉字进行排序(不支持多音字)
不使用拼音库，利用JavaScript的localeCompare方法直接按汉字的字典序排序。localeCompare可以在比较字符串时指定语言及排序规则，它对中文字符排序时，会默认按拼音顺序排列。
const arr = ['南宁', '河池', '柳州', '桂林', '贺州', '梧州']; const list = [ { id: 1, title: '南宁' }, { id: 2, title: '河池' }, { id: 3, title: '柳州' }, { id: 4, title: '桂林' }, { id: 5, title: '贺州' }, { id: 6, title: '梧州' } ]; let newArr = arr.sort((a, b) => a.localeCompare(b, 'zh-Hans-CN')); let newList = list.sort((a, b) => a.title.localeCompare(b.title, 'zh-Hans-CN')); console.log(newArr); // ["桂林", "河池", "贺州", "柳州", "南宁", "梧州"] console.log(newList); // [ // { // "id": 4, // "title": "桂林" // }, // { // "id": 2, // "title": "河池" // }, // { // "id": 5, // "title": "贺州" // }, // { // "id": 3, // "title": "柳州" // }, // { // "id": 1, // "title": "南宁" // }, // { // "id": 6, // "title": "梧州" // } // ]在示例中，使用localeCompare的第二个参数’zh-Hans-CN’，指定简体中文和中国的排序规则。localeCompare会根据拼音顺序排序汉字，而不需要任何额外的拼音库。
sort方法接受一个比较函数，localeCompare用于比较两个字符串的字典顺序。
'zh-Hans-CN’指定简体中文的语言和地区代码，以确保对汉字进行拼音顺序排序。
这种方法在大多数现代浏览器和Node.js环境中都支持。
编码顺序和字典顺序的区别
编码顺序和字典顺序是两种不同的排序方式，特别是在处理中文字符时，这两种顺序差异显著。
1、编码顺序
编码顺序基于字符在计算机字符集(如Unicode)中的编码值来排序。在编码顺序中，字符的位置和大小顺序完全由它的编码值决定，而不考虑字符的语言或意义。
原理
计算机将每个字符映射为一个二进制数值，称为编码。对于中文字符来说，Unicode会为每个汉字分配一个独特的编码。因此，当按编码顺序排列汉字时，实际上是按照它们的编码值大小从小到大排列。
特点
编码顺序是纯粹的二进制排序，不涉及语言的语义。
对于同一字符集(如Unicode)中的字符，这种排序方式非常快，但对中文用户来说没有任何实际的语义或拼音顺序可言。
假设有汉字列表["张", "王", "李", "赵"]，编码顺序可能会排列成["李", "王", "张", "赵"]，因为它们在Unicode表中的顺序就是这样，但这并不符合字典或拼音顺序。
适用场景
这种排序方式在需要统一编码的场景中有用，例如存储或快速查找数据。但它不适合用户展示，因为不符合直观的语言排序。
2、字典顺序
字典顺序是基于自然语言的排序方式。在中文中，字典顺序可以基于拼音顺序或部首笔画顺序，这两种方法可以在实际使用中帮助人们更容易地找到和整理文字。
2.1、拼音顺序
这是现代电子设备和软件最常用的字典顺序，基于汉字的拼音字母排序。
原理
每个汉字可以被转换成拼音，按拼音的字母顺序排列汉字列表。拼音字母较小的字在前，较大的字在后。
例子
对于同一列表["张", "王", "李", "赵"]，按拼音排序会得到["李", "王", "张", "赵"]，符合中文字典的拼音查找顺序。
2.2、部首笔画顺序
这是传统字典中常用的另一种顺序，基于汉字的部首和笔画数。
原理
首先按部首排列，然后按剩余笔画数从少到多排序。需要根据每个汉字的部首和笔画数进行对比。
例子
如果用部首笔画法排序同样的列表["张", "王", "李", "赵"]，结果可能会是["李", "王", "赵", "张"]，取决于部首的顺序以及剩余笔画数。
3、编码顺序与字典顺序的对比
特点 编码顺序 字典顺序 排序依据 字符编码的数值 自然语言的拼音或部首笔画 是否符合直觉 否，不考虑语言语义 是，更符合人类阅读和查找习惯 计算速度 快，按二进制数值排序 较慢，需要语言规则和转换 适用场景 原始数据处理、索引等 用户展示、文字查找等
4、JavaScript示例
在JavaScript中，可以利用localeCompare来实现字典顺序的拼音排序，而编码顺序可以直接使用sort方法按Unicode编码排序。
编码顺序
const words = ["张", "王", "李", "赵"]; words.sort(); console.log(words); // ["李", "王", "张", "赵"]
字典顺序(拼音)
const words = ["张", "王", "李", "赵"]; words.sort((a, b) => a.localeCompare(b, 'zh-Hans-CN')); console.log(words); // ["李", "王", "张", "赵"]
localeCompare指定简体中文的排序规则，可以按照拼音顺序对汉字排序。
5、总结
编码顺序基于字符的二进制编码值，快速但不符合直观语言规则。
字典顺序基于拼音或部首笔画，符合人类查阅习惯，但需要更多计算和语言支持。
在实际应用中，字典顺序更符合用户的需求，编码顺序更适合数据的内部存储。
sort与localeCompare的介绍
sort和localeCompare是JavaScript中两个与排序相关的功能，但它们的工作方式和适用场景有所不同。
1、sort方法
Array.prototype.sort() 是 JavaScript 用来对数组进行排序的方法，它可以直接对数组中的元素按编码顺序进行排序，也可以通过传递比较函数自定义排序规则。
工作原理
默认排序：如果sort不传入任何参数，则按编码顺序(即字符串的Unicode编码)进行排序，这对数字或字符串的基本排序是有效的，但对中文和其他语言符号排序可能会显得混乱。
自定义排序：可以向sort传递一个比较函数自定义排序规则。比较函数应返回一个负数、零或正数，分别表示较小、相等或较大，用于确定元素的排序。
示例// 编码顺序(默认排序) const words = ["张", "王", "李", "赵"]; words.sort(); console.log(words); // ["李", "王", "张", "赵"] // 自定义排序(如按长度排序) const numbers = [1, 5, 2, 10]; numbers.sort((a, b) => a - b); console.log(numbers); // 1, 2, 5, 10]特点
默认编码顺序：sort默认使用编码顺序排序，可能不符合特定语言的字典排序规则。
需要提供比较函数：为了实现更复杂的排序逻辑，通常会结合localeCompare等方法来提供比较函数。
2、localeCompare方法
String.prototype.localeCompare()是JavaScript中用于比较两个字符串的方法，支持指定语言及排序规则。localeCompare会根据区域语言的特定排序规则来确定字符串的顺序，因此适合处理自然语言中的排序问题。
工作原理
localeCompare方法会比较两个字符串，并返回负数、0或正数。
负数：表示当前字符串在排序中应排在参数字符串之前。
0：表示两个字符串在排序中位置相同。
正数：表示当前字符串在排序中应排在参数字符串之后。
可以为localeCompare指定语言和地区(如zh-Hans-CN)，从而按照拼音顺序对中文字符进行排序。
示例// 使用localeCompare比较字符串的字典顺序 const words = ["张", "王", "李", "赵"]; words.sort((a, b) => a.localeCompare(b, 'zh-Hans-CN')); console.log(words); // ["李", "王", "张", "赵"]特点
按语言排序规则：localeCompare能够根据指定的语言进行排序，适用于需要特定语言字典顺序的场景。
自定义灵活性：通过在localeCompare中指定不同的区域代码，可以对多语言内容进行排序。
3、sort和localeCompare的组合使用
在实际应用中，sort常常和localeCompare结合使用，以实现多语言环境中的自然排序。sort负责排序的整体流程，而localeCompare提供特定的语言比较规则。const words = ["苹果", "香蕉", "橙子", "菠萝", "西瓜"]; words.sort((a, b) => a.localeCompare(b, 'zh-Hans-CN')); console.log(words); // ["菠萝", "橙子", "苹果", "西瓜", "香蕉"]
4、总结对比
特性 sort localeCompare 主要用途 对数组进行排序 比较两个字符串的顺序 默认行为 按编码顺序(Unicode)排序 按指定语言的字典序进行比较 适合语言 对多语言支持较弱 支持多语言排序 是否传入参数 可选传入比较函数 可指定语言和比较选项 常见组合 与localeCompare结合使用以实现自然语言排序 用作sort的比较函数
5、使用场景建议
如果只是简单的编码排序，可以直接使用sort()。
如果需要按语言规则排序(如拼音)，使用sort((a, b) => a.localeCompare(b, ‘语言’))。
原文地址：https://blog.csdn.net/weixin_51157081/article/details/122136207
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！