按特定字符串順序對對象的Javascript數組進行排序？

Question

我有以下數據：

，我想知道我怎麼能在一個特定的順序排序這些。

訂單需要爲：黃色，藍色，白色，綠色，紅色然後在這些顏色中，它會顯示最小的數字。

因此，在這種情況下，正確的排序應該是： Y2，Y3，B0，B2，B6，W2，G7，R4

有沒有人對如何實現這一目標的任何想法？如果這使得它更容易，我使用underscore.js。

Answer 1

這天真地假定所有元素都有一個有效的顏色（或者至少是第一排序與一個無效的色彩元素）：

arr.sort((a, b) => { 
    const colorOrder = ['yellow', 'blue', 'white', 'green', 'red']; 

    const aColorIndex = colorOrder.indexOf(a.color); 
    const bColorIndex = colorOrder.indexOf(b.color); 

    if (aColorIndex === bColorIndex) 
     return a.card - b.card; 

    return aColorIndex - bColorIndex; 
}); 

例子：

const sorted = [ 
    { color: 'yellow', card: '3' }, 
    { color: 'red', card: '4' }, 
    { color: 'blue', card: '6' }, 
    { color: 'white', card: '2' }, 
    { color: 'blue', card: '2' }, 
    { color: 'yellow', card: '2' }, 
    { color: 'blue', card: '0' }, 
    { color: 'green', card: '7' }, 
].sort((a, b) => { 
    const colorOrder = ['yellow', 'blue', 'white', 'green', 'red']; 

    const aColorIndex = colorOrder.indexOf(a.color); 
    const bColorIndex = colorOrder.indexOf(b.color); 

    if (aColorIndex === bColorIndex) 
     return a.card - b.card; 

    return aColorIndex - bColorIndex; 
}); 

// Result: 
[ 
    { "color": "yellow", "card": "2" }, 
    { "color": "yellow", "card": "3" }, 
    { "color": "blue", "card": "0" }, 
    { "color": "blue", "card": "2" }, 
    { "color": "blue", "card": "6" }, 
    { "color": "white", "card": "2" }, 
    { "color": "green", "card": "7" }, 
    { "color": "red", "card": "4" } 
] 

Answer 2

您可以簡單地使用Array.prototype.sort與您的自定義排序邏輯：

var arr = [ 
 
    { color: "yellow", card: "3" }, 
 
    { color: "red", card: "4" }, 
 
    { color: "blue", card: "6" }, 
 
    { color: "white", card: "2" }, 
 
    { color: "blue", card: "2" }, 
 
    { color: "yellow", card: "2" }, 
 
    { color: "blue", card: "0" }, 
 
    { color: "green", card: "7" } 
 
]; 
 

 
var arrSorted = arr.sort(function(a, b) { 
 
    var colorsOrder = ["yellow", "blue", "white", "green", "red"]; 
 
    function getColorIndex(x) { 
 
    return colorsOrder.indexOf(x.color); 
 
    } 
 
    
 
    return (getColorIndex(a) - getColorIndex(b)) || (a.card - b.card); 
 
}); 
 

 
console.log(arrSorted);