JS 对象数组排序方法测试

输出 

一.Array.prototype.sort()

1.默认排序 sort()

sort() 方法就地对数组的元素进行排序,并返回对相同数组的引用。默认排序是将元素转换为字符串,然后按照它们的 UTF-16 码元值升序排序。

由于它取决于具体实现,因此无法保证排序的时间和空间复杂度。

如果想要不改变原数组的排序方法,可以使用 toSorted()。

说明:两个重点。1、会改变原数组。2、默认按将元素转换为字符串排序。

const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// Expected output: Array ["Dec", "Feb", "Jan", "March"]const array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);
// Expected output: Array [1, 100000, 21, 30, 4]

2.比较函数 sort(compareFn)

定义排序顺序的函数。返回值应该是一个数字,其符号表示两个元素的相对顺序:如果 a 小于 b,返回值为负数,如果 a 大于 b,返回值为正数,如果两个元素相等,返回值为 0NaN 被视为 0

说明:自定义比较函数返回一个数值。一般为1,-1,0.

function compareFn(a, b) {if (根据排序标准,a 小于 b) {return -1;}if (根据排序标准,a 大于 b) {return 1;}// a 一定等于 breturn 0;
}
const stringArray = ["Blue", "Humpback", "Beluga"];
const numberArray = [40, 1, 5, 200];
const numericStringArray = ["80", "9", "700"];
const mixedNumericArray = ["80", "9", "700", 40, 1, 5, 200];function compareNumbers(a, b) {return a - b;
}stringArray.sort(); // ['Beluga', 'Blue', 'Humpback']numberArray.sort(compareNumbers); // [1, 5, 40, 200]numericStringArray.sort(); // ['700', '80', '9']
numericStringArray.sort(compareNumbers); // ['9', '80', '700']mixedNumericArray.sort(compareNumbers); // [1, 5, '9', 40, '80', 200, '700']

二.对象数组

let arr = [  { name: 'Zhang', age: 25, score: 85 },  { name: 'Li', age: 20, score: 90 },  { name: 'Wang', age: 22, score: 80 },  { name: 'Zhao', age: 22, score: 92 }  
];  // 按 age 升序排序,如果 age 相同则按 score 降序排序  
arr.sort((a, b) => {  if (a.age !== b.age) {  return a.age - b.age; // 按 age 升序排序  } else {  return b.score - a.score; // 如果 age 相同,按 score 降序排序  }  
});  console.log(arr);
[  { name: 'Li', age: 20, score: 90 },  { name: 'Wang', age: 22, score: 80 },  { name: 'Zhao', age: 22, score: 92 },  { name: 'Zhang', age: 25, score: 85 }  
]

三.通用方法

1.指定单一对象元素属性

function sortObjectsByProperty(array, property) {return array.sort(function(a, b) {if (a[property] < b[property]) {return -1;} else if (a[property] > b[property]) {return 1;} else {return 0;}});
}
var objects = [{ name: 'Apple', price: 15 },{ name: 'Banana', price: 10 },{ name: 'Cherry', price: 20 }
];var sortedObjects = sortObjectsByProperty(objects, 'price');
console.log(sortedObjects);

输出:

[{ name: 'Banana', price: 10 },{ name: 'Apple', price: 15 },{ name: 'Cherry', price: 20 }
]

2.指定对象元素多属性

function sortObjectsByProperties(array, ...properties) {  return array.sort((a, b) => {  for (const property of properties) {  if (a[property] < b[property]) {  return -1;  } else if (a[property] > b[property]) {  return 1;  }  // 如果属性相等,则继续比较下一个属性  }  // 所有属性都相等  return 0;  });  
}  // 示例对象数组  
const employees = [  { name: 'Alice', age: 30, salary: 50000 },  { name: 'Bob', age: 25, salary: 60000 },  { name: 'Charlie', age: 35, salary: 55000 },  
];  // 使用剩余参数传入多个属性进行排序  
const sortedEmployees = sortObjectsByProperties(employees, 'age', 'salary');  console.log(sortedEmployees);

输出:

[  { name: 'Bob', age: 25, salary: 60000 }, // 年龄最小  { name: 'Alice', age: 30, salary: 50000 }, // 年龄次小,但薪水低于Charlie  { name: 'Charlie', age: 35, salary: 55000 } // 年龄最大,薪水也最高(在同龄人中)  
]

四. 对象数组汉字按拼音排序

1.使用stringObject.localeCompare(target)

const chinesePeople = [  { name: '张三', age: 30 },  { name: '李四', age: 25 },  { name: '王五', age: 35 },  { name: '赵六', age: 40 },  
];  // 使用 localeCompare 对名字属性进行排序  
chinesePeople.sort((a, b) => a.name.localeCompare(b.name, 'zh-CN'));  console.log(chinesePeople);

输出:

[{ name: '李四', age: 25 },{ name: '王五', age: 35 },{ name: '张三', age: 30 },{ name: '赵六', age: 40 } 
]

2.使用第三方库

如果你想要根据汉字拼音对对象数组进行排序,你需要先将汉字转换为拼音,然后根据拼音进行排序。这通常需要使用到第三方库来实现汉字到拼音的转换,比如 pinyin 库。

npm install pinyin
const pinyin = require('pinyin');  function sortObjectsByChinesePinyin(array, propertyName) {  return array.sort((a, b) => {  const aPinyin = pinyin(a[propertyName], { style: pinyin.STYLE_NORMAL, heteronym: false }).join('');  const bPinyin = pinyin(b[propertyName], { style: pinyin.STYLE_NORMAL, heteronym: false }).join('');  return aPinyin.localeCompare(bPinyin);  });  
}  // 示例对象数组  
const chineseNames = [  { name: '张三', age: 30 },  { name: '李四', age: 25 },  { name: '王五', age: 35 },  
];  // 使用汉字拼音对名字进行排序  
const sortedChineseNames = sortObjectsByChinesePinyin(chineseNames, 'name');  console.log(sortedChineseNames);

输出:

[  { name: '李四', age: 25 }, // 'lǐ sì'  { name: '王五', age: 35 }, // 'wáng wǔ'  { name: '张三', age: 30 }  // 'zhāng sān'  
]

强调:如果用VS调试,别忘记了在luanch.jsion文件中添加  "console": "integratedTerminal",这句话,不然会报错。还看不到运行结果。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/508417.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Vision Pro开发者学习路线

官方给到的Vision Pro开发者学习路线&#xff1a; 1. 学习基础知识&#xff1a; - 学习 Xcode、Swift 和 SwiftUI 的基础知识&#xff0c;包括语法、UI 设计等。 - 掌握 ARKit 和 SwiftUI 的使用&#xff0c;了解如何创建沉浸式增强现实体验。 2. 学习 3D 建模&#xf…

记录vue3导入并使用echarts自定义主题文件设置统一图表样式

在做数据可视化网站时&#xff0c;有时需要用到多个图表&#xff0c;这时就需要对图表的样式做一个统一的设计使网站外观更整齐。具体步骤如下&#xff1a; 第一步&#xff1a;在echarts官网定制好主题&#xff0c;并下载js文件 第二步&#xff1a;在index.html文件引入该文件…

[AutoSar]BSW_Com08 CAN driver 模块介绍及参数配置说明 (一)

目录 关键词平台说明一、缩写和定义二、CAN driver 所在位置三、CAN 模块的主要功能四、功能规格4.1 Driver State Machine4.2 CAN控制器状态机4.3 CAN控制器状态机转换4.3.1 调用function Can_Init 导致的状态转换4.3.2 调用Can_ChangeBaudrate导致的状态转换4.3.3 调用Can_Se…

浅析虚函数的vptr和虚函数表

浅析虚函数的vptr和虚函数表 文章目录 浅析虚函数的vptr和虚函数表前言1. 基础理论2. 实现与内部结构 前言 ​ 为了实现虚函数&#xff0c;C使用一种称为虚拟表的特殊形式的后期绑定。该虚拟表是用于解决在动态/后期绑定方式的函数调用函数的查找表。虚拟表有时会使用其他名称…

图像处理ASIC设计方法 笔记6 数据拼接和帧格式校正

第四章大模板卷积ASIC设计方案 P80 实时图SPRM 数据位宽64bit&#xff0c;4个SPRAM&#xff0c;同时得到4行数据 绘制卷积芯片数据路径图&#xff0c;卷积芯片内部模块图 根据这个图&#xff0c;本书后续对各个模块都进行介绍。 P81 第一个模块 图像输入前端FIFO 学习图像处…

关于脉冲负载应用中电阻器,您需要了解的 11 件事?

不幸的是&#xff0c;电阻器在脉冲负载下可能会失效。当脉冲功率耗散到器件的电阻元件时&#xff0c;它会产生热量并增加电阻器的温度。过热会损坏电阻元件&#xff0c;导致电阻变化甚至设备开路。为了避免在设计中出现这种情况&#xff0c;以下是您在选择元件时应了解的有关电…

RocketMQ - 深入研究一下Broker是如何持久化存储消息的

1. CommitLog消息顺序写入机制 首先思考一下,当生产者的消息发送到一个Broker上的时候,他接收到了一条消息,接着他会对这个消息做什么事情? 首先第一步,他会把整个消息直接写入磁盘上的一个日志文件,叫做CommitLog,直接顺序写入这个文件,如下图: 这个CommitLog是很…

redis运维

1.备份redis配置文件 cp /etc/redis.conf /etc/redis.conf.bak 2.将redis中不要的注释和空行删除 sed -i /^#/d; /^$/d /etc/redis.conf 3.redis配置文件 bing 0.0.0.0 &#xff1a;绑定本机所有网卡 daemonize yes&#xff1a;设置后台运行 requirepass redispwd…

二维码门楼牌管理系统技术服务:构建智慧城市新标准

文章目录 前言一、二维码门楼牌管理系统的诞生背景二、标准地址编码的定义与作用三、二维码门楼牌管理系统的核心技术四、二维码门楼牌管理系统的应用优势五、二维码门楼牌管理系统在智慧城市建设中的作用六、结论与展望 前言 随着城市化的快速发展&#xff0c;传统的门楼牌管…

linux安装matlab获取许可证

1.点击许可证 2. 3. 4. 4.主机ID 打开linux输入 /sbin/ifconfigether后边的就是 6.计算机登录名 打开linux输入 whoami7. 8. 9.

第十六天-爬虫selenium库

目录 1.介绍 2.使用 selenium 1.安装 2.使用 1.测试打开网页&#xff0c;抓取雷速体育日职乙信息 2.通过xpath查找 3.输入文本框内容 send_keys 4.点击事件 click 5.获取网页源码&#xff1a; 6.获取cookies 7.seleniumt提供元素定位方式&#xff1a;8种 8.控制浏览…

Linux/Docker 修改系统时区

目录 1. Linux 系统1.1 通过 timedatectl 命令操作1.2 直接修改 /etc/localtime 文件 2. Docker 容器中的 Linux 操作环境&#xff1a; CentOS / AlmaOSMySQL Docker 镜像 1. Linux 系统 1.1 通过 timedatectl 命令操作 使用 timedatectl list-timezones 命令列出可用的时区…