JS對(duì)象數(shù)組排序方法測(cè)試代碼示例
一.Array.prototype.sort()
1.默認(rèn)排序 sort()
sort() 方法就地對(duì)數(shù)組的元素進(jìn)行排序,并返回對(duì)相同數(shù)組的引用。默認(rèn)排序是將元素轉(zhuǎn)換為字符串,然后按照它們的 UTF-16 碼元值升序排序。
由于它取決于具體實(shí)現(xiàn),因此無法保證排序的時(shí)間和空間復(fù)雜度。
如果想要不改變?cè)瓟?shù)組的排序方法,可以使用 toSorted()。
說明:兩個(gè)重點(diǎn)。1、會(huì)改變?cè)瓟?shù)組。2、默認(rèn)按將元素轉(zhuǎn)換為字符串排序。
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.比較函數(shù) sort(compareFn)
定義排序順序的函數(shù)。返回值應(yīng)該是一個(gè)數(shù)字,其符號(hào)表示兩個(gè)元素的相對(duì)順序:如果 a
小于 b
,返回值為負(fù)數(shù),如果 a
大于 b
,返回值為正數(shù),如果兩個(gè)元素相等,返回值為 0
。NaN
被視為 0
。
說明:自定義比較函數(shù)返回一個(gè)數(shù)值。一般為1,-1,0.
function compareFn(a, b) { if (根據(jù)排序標(biāo)準(zhǔn),a 小于 b) { return -1; } if (根據(jù)排序標(biāo)準(zhǔn),a 大于 b) { return 1; } // a 一定等于 b return 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']
二.對(duì)象數(shù)組
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.指定單一對(duì)象元素屬性
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.指定對(duì)象元素多屬性
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; } // 如果屬性相等,則繼續(xù)比較下一個(gè)屬性 } // 所有屬性都相等 return 0; }); } // 示例對(duì)象數(shù)組 const employees = [ { name: 'Alice', age: 30, salary: 50000 }, { name: 'Bob', age: 25, salary: 60000 }, { name: 'Charlie', age: 35, salary: 55000 }, ]; // 使用剩余參數(shù)傳入多個(gè)屬性進(jìn)行排序 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 } // 年齡最大,薪水也最高(在同齡人中) ]
四. 對(duì)象數(shù)組漢字按拼音排序
1.使用stringObject.localeCompare(target)
const chinesePeople = [ { name: '張三', age: 30 }, { name: '李四', age: 25 }, { name: '王五', age: 35 }, { name: '趙六', age: 40 }, ]; // 使用 localeCompare 對(duì)名字屬性進(jìn)行排序 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.使用第三方庫(kù)
如果你想要根據(jù)漢字拼音對(duì)對(duì)象數(shù)組進(jìn)行排序,你需要先將漢字轉(zhuǎn)換為拼音,然后根據(jù)拼音進(jìn)行排序。這通常需要使用到第三方庫(kù)來實(shí)現(xiàn)漢字到拼音的轉(zhuǎn)換,比如 pinyin
庫(kù)。
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); }); } // 示例對(duì)象數(shù)組 const chineseNames = [ { name: '張三', age: 30 }, { name: '李四', age: 25 }, { name: '王五', age: 35 }, ]; // 使用漢字拼音對(duì)名字進(jìn)行排序 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' ]
強(qiáng)調(diào):如果用VS調(diào)試,別忘記了在luanch.jsion文件中添加 "console": "integratedTerminal",這句話,不然會(huì)報(bào)錯(cuò)。還看不到運(yùn)行結(jié)果。
總結(jié)
到此這篇關(guān)于JS對(duì)象數(shù)組排序方法測(cè)試的文章就介紹到這了,更多相關(guān)JS對(duì)象數(shù)組排序方法內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- JavaScript將對(duì)象數(shù)組按字母順序排序的方法詳解
- JavaScript中好用的數(shù)組對(duì)象排序方法分享
- javascript中的Array對(duì)象(數(shù)組的合并、轉(zhuǎn)換、迭代、排序、堆棧)
- JS sort方法基于數(shù)組對(duì)象屬性值排序
- JS深入學(xué)習(xí)之?dāng)?shù)組對(duì)象排序操作示例
- js 根據(jù)對(duì)象數(shù)組中的屬性進(jìn)行排序?qū)崿F(xiàn)代碼
- JS實(shí)現(xiàn)給數(shù)組對(duì)象排序的方法分析
- JS實(shí)現(xiàn)根據(jù)數(shù)組對(duì)象的某一屬性排序操作示例
- js中的數(shù)組對(duì)象排序分析
- JS實(shí)現(xiàn)json對(duì)象數(shù)組按對(duì)象屬性排序操作示例
- JavaScripts數(shù)組里的對(duì)象排序的24個(gè)方法(最新整理收藏)
相關(guān)文章
js getBoundingClientRect使用方法詳解
這篇文章主要介紹了js getBoundingClientRect使用方法詳解,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-07-07JavaScript實(shí)現(xiàn)的encode64加密算法實(shí)例分析
這篇文章主要介紹了JavaScript實(shí)現(xiàn)的encode64加密算法,實(shí)例分析了javascript處理encode64編碼針對(duì)字符串加密的技巧,非常簡(jiǎn)潔實(shí)用,需要的朋友可以參考下2015-04-04JS實(shí)現(xiàn)兩個(gè)大數(shù)(整數(shù))相乘
大數(shù),即超出語言所能表示的數(shù)字最大范圍的數(shù)字,那么如何實(shí)現(xiàn)兩個(gè)大數(shù)相乘呢?下面有個(gè)不錯(cuò)的方法,大家可以參考下2014-04-04函數(shù)window.open實(shí)現(xiàn)關(guān)閉所有的子窗口
這篇文章主要介紹了函數(shù)window.open實(shí)現(xiàn)關(guān)閉所有的子窗口的相關(guān)資料,需要的朋友可以參考下。2015-08-08