按照名字(按字母顺序)在Javascript中对数组进行sorting

我有一个数组(见下面的数组中的一个对象),我需要使用JavaScript的名字进行sorting。 我该怎么做?

var user = { bio: null, email: "user@domain.com", firstname: "Anna", id: 318, lastAvatar: null, lastMessage: null, lastname: "Nickson", nickname: "anny" }; 

假设你有一个数组users 。 你可以使用users.sort并传递一个带有两个参数的函数并比较它们(比较器)

它应该返回

  • 如果第一个参数小于第二个参数,则返回负数(应放在结果数组中的第二个参数之前)
  • 如果第一个参数较大,则为正数(应该放在第二个之后)
  • 0如果这两个元素是相等的。

在我们的例子中,如果两个元素是ab我们要比较a.firstnameb.firstname

例:

 users.sort(function(a, b){ if(a.firstname < b.firstname) return -1; if(a.firstname > b.firstname) return 1; return 0; }) 

此代码将与任何types的工作。

请注意,在“现实生活”中,当你比较string时,你经常想要忽略大小写,正确地分类变音符号,奇怪的符号,所以你可能想使用localeCompare 。 请参阅其他答案的清晰。

像这样的东西:

 array.sort(function(a, b){ var nameA=a.name.toLowerCase(), nameB=b.name.toLowerCase(); if (nameA < nameB) //sort string ascending return -1; if (nameA > nameB) return 1; return 0; //default return value (no sorting) }); 

如果比较string包含unicode字符,则可以使用String类的localeCompare函数 ,如下所示:

 users.sort(function(a,b){ return a.firstname.localeCompare(b.firstname); }) 

最短的代码与ES6!

 users.sort((a, b) => a.firstname.localeCompare(b.firstname)) 

String.prototype.localeCompare()基本支持是通用的!

漂亮的小ES6单线:

 users.sort((a, b) => a.firstname !== b.firstname ? a.firstname < b.firstname ? -1 : 1 : 0); 

underscorejs提供了非常好的_.sortBy函数:

 _.sortBy([{a:1},{a:3},{a:2}], "a") 

或者你可以使用自定义的sortingfunction:

 _.sortBy([{a:"b"},{a:"c"},{a:"a"}], function(i) {return iatoLowerCase()}) 

基本上你可以用方法sorting来sorting数组,但是如果你想sorting对象,那么你必须传递函数来sorting数组的方法,所以我会给你一个使用你的数组的例子

 user = [{ bio: "<null>", email: "user@domain.com", firstname: 'Anna', id: 318, "last_avatar": "<null>", "last_message": "<null>", lastname: 'Nickson', nickname: 'anny' }, { bio: "<null>", email: "user@domain.com", firstname: 'Senad', id: 318, "last_avatar": "<null>", "last_message": "<null>", lastname: 'Nickson', nickname: 'anny' }, { bio: "<null>", email: "user@domain.com", firstname: 'Muhamed', id: 318, "last_avatar": "<null>", "last_message": "<null>", lastname: 'Nickson', nickname: 'anny' }]; var ar = user.sort(function(a, b) { var nA = a.firstname.toLowerCase(); var nB = b.firstname.toLowerCase(); if(nA < nB) return -1; else if(nA > nB) return 1; return 0; }); 

更简洁的表示法:

 user.sort(function(a, b){ return a.firstname == b.firstname ? 0 : a.firstname < b.firstname ? -1 : 1; }) 

您可以使用内置的数组方法 – sort 。 该方法将callback方法作为参数

// custom sort function to be passed as param/callback to the Array's sort method function myCustomSort(a, b) { return (a.toLowerCase() > b.toLowerCase()) ? 1 : -1; } // Actual method to be called by entity that needs sorting feature function sortStrings() { var op = Array.prototype.sort.call(arguments, myCustomSort); } // Testing the implementation var sortedArray = sortStrings("Burger", "Mayo1", "Pizza", "boxes", "Apples", "Mayo"); console.log(sortedArray); //["Apples", "boxes", "Burger", "Mayo", "Mayo1", "Pizza"]
// custom sort function to be passed as param/callback to the Array's sort method function myCustomSort(a, b) { return (a.toLowerCase() > b.toLowerCase()) ? 1 : -1; } // Actual method to be called by entity that needs sorting feature function sortStrings() { var op = Array.prototype.sort.call(arguments, myCustomSort); } // Testing the implementation var sortedArray = sortStrings("Burger", "Mayo1", "Pizza", "boxes", "Apples", "Mayo"); console.log(sortedArray); //["Apples", "boxes", "Burger", "Mayo", "Mayo1", "Pizza"] 

要理解这个代码要注意的要点。

  1. 自定义方法(在本例中为myCustomSort )应该为每个元素对(来自input数组)的比较返回+1或-1。
  2. 在自定义sortingcallback方法中使用toLowerCase() / toUpperCase() ,以便区分大小写不影响sorting过程的正确性。

我希望这是足够明确的解释。 随意评论,如果你认为,更多的信息是必要的。

干杯!

你可以使用类似的东西来摆脱大小写

 users.sort(function(a, b){ //compare two values if(a.firstname.toLowerCase() < b.firstname.toLowerCase()) return -1; if(a.firstname.toLowerCase() > b.firstname.toLowerCase()) return 1; return 0; }) 

把最好的答案推入原型,按键sorting。

 Array.prototype.alphaSortByKey= function (key) { this.sort(function (a, b) { if (a[key] < b[key]) return -1; if (a[key] > b[key]) return 1; return 0; }); return this; }; 
  function alphabetSortingAscending() { var alphabetValue = document.myForm.alphabets.value; var alphabtArray = []; sAlphabet = alphabetValue.toString(); for (i = 0; i < sAlphabet.length; i += 1) { alphabtArray.push(sAlphabet.charAt(i)); } alphabetArray.sort(); document.getElementById("alphabetOutput").value = alphabetArray; } function alphabetSortingDecending() { debugger; var alphabetValue = document.myForm.alphabets.value; var alphabetArray = []; sAlphabet = alphabetValue.toString(); for (var i = 0, len = sAlphabet.length; i < len; i += 1) { alphabetArray.push(sAlphabet.charAt(i)); } alphabetArray.sort(); alphabetArray.reverse(); document.getElementById("alphabetOutput").value = alphabetArray; } function numberSortingAscending() { debugger; var numberValue = document.myForm.number.value; var numberArray = []; sNumber = numberValue.toString(); for (var i = 0, len = sNumber.length; i < len; i += 1) { numberArray.push(+sNumber.charAt(i)); } numberArray.sort(function (a, b) { return a - b }); document.getElementById("numberOutput").value = numberArray; } function numberSortingDecending() { debugger; var numberValue = document.myForm.number.value; var numberArray = []; sNumber = numberValue.toString(); for (var i = 0, len = sNumber.length; i < len; i += 1) { numberArray.push(+sNumber.charAt(i)); } numberArray.sort(function (a, b) { return b - a }); document.getElementById("numberOutput").value = numberArray; } function restrictCharacters(evt) { evt = (evt) ? evt : window.event; var charCode = (evt.which) ? evt.which : evt.keyCode; if (((charCode >= '65') && (charCode <= '90')) || ((charCode >= '97') && (charCode <= '122'))) { return true; } else { return false; } } <div> <form name="myForm"> <table> <tr> <td>Insert Alphabets</td> <td><input type="text" name="alphabets" onkeypress="return restrictCharacters(event);"/></td> <td><input type="button" value="Ascending" onclick="alphabetSortingAscending();"/></td> <td><input type="button" value="Decending" onclick="alphabetSortingDecending();"/></td> <td><input type="text" id="alphabetOutput" name="alphabetOutput" /></td> </tr> <tr> <td><span id="span1"></span></td> </tr> <tr> <td>Insert Number</td> <td><input type="text" name="number" onkeypress="return event.charCode === 0 || /\d/.test(String.fromCharCode(event.charCode));" /></td> <td><input type="button" value="Ascending" onclick="numberSortingAscending();" /></td> <td><input type="button" value="Decending" onclick="numberSortingDecending();"/></td> <td><input type="text" id="numberOutput" name="numberOutput" /></td> </tr> <tr> <td><span id="span2"></span></td> </tr> </table> </form> </div>