JavaScript根據值對對象進行排序的數組（條件排序）

Question

我有一個像這樣的數組：

[{"category_id":101,"category_name":"abc","state":null},
{"category_id":204,"category_name":"test","state":null},
{"category_id":7,"category_name":"pqr","state":"1526985908122"},
{"category_id":103,"category_name":"User","state":null},
{"category_id":2,"category_name":"System","state":null},
{"category_id":205,"category_name":"xyz","state":"1526985908019"},
{"category_id":203,"category_name":"dash","state":null},
{"category_id":4,"category_name":"hello","state":null},
{"category_id":206,"category_name":"demo","state":"1526985908187"},
{"category_id":6,"category_name":"about","state":null},
{"category_id":3,"category_name":"role","state":null}]

我想基於狀態屬性的值對該數組進行排序，就像您可以看到狀態具有null和一些數字值一樣。

如果狀態！= null，則以升序排序；如果狀態== null，則以降序排序（基於類別ID）

所以實際結果應該是這樣的：

[{"category_id":205,"category_name":"xyz","state":"1526985908019"},
{"category_id":7,"category_name":"pqr","state":"1526985908122"},
{"category_id":206,"category_name":"demo","state":"1526985908187"},
{"category_id":204,"category_name":"test","state":null},
{"category_id":203,"category_name":"dash","state":null},
{"category_id":103,"category_name":"User","state":null},
{"category_id":101,"category_name":"abc","state":null},
{"category_id":6,"category_name":"about","state":null},
{"category_id":4,"category_name":"hello","state":null},
{"category_id":3,"category_name":"role","state":null},
{"category_id":2,"category_name":"System","state":null}]

因此，應基於類別ID根據狀態值升序對前3條記錄進行排序，並根據空值對其他3條記錄進行降序排序。

這是我嘗試參考本文的內容： https : //technology.amis.nl/2007/08/24/how-to-fix-your-number-sorting-problems-in-javascript/

var ALMOST_ZERO = -0.00000001;  
records.sort(function(a,b){         
    console.log(`comparing ${a.state},${b.state}`);
    var left = a.state != null ? a.state : ALMOST_ZERO;
    var right = b.state != null ? b.state : ALMOST_ZERO;    
    return right-left;
});

任何幫助，將不勝感激。

謝謝

Answer 1

這是一個簡潔的版本。 通過使用|| ，每當上一個表達式的值為0時，它就會繼續測試下一個下一個表達式：

 const arr=[{"category_id":101,"category_name":"abc","state":null},{"category_id":204,"category_name":"test","state":null},{"category_id":7,"category_name":"pqr","state":"1526985908122"},{"category_id":103,"category_name":"User","state":null},{"category_id":2,"category_name":"System",state:null},{"category_id":205,"category_name":"xyz","state":"1526985908019"},{"category_id":203,"category_name":"dash","state":null},{"category_id":4,"category_name":"hello","state":null},{"category_id":206,"category_name":"demo","state":"1526985908187"},{"category_id":6,"category_name":"about","state":null},{"category_id":3,"category_name":"role","state":null}] arr.sort((a, b) => ( (a.state === null) - (b.state === null) || a.state - b.state || b.category_id - a.category_id )); console.log(arr); 

控制台版本：

ES5版本：

 var arr = [{ "category_id": 101, "category_name": "abc", "state": null }, { "category_id": 204, "category_name": "test", "state": null }, { "category_id": 7, "category_name": "pqr", "state": "1526985908122" }, { "category_id": 103, "category_name": "User", "state": null }, { "category_id": 2, "category_name": "System", state: null }, { "category_id": 205, "category_name": "xyz", "state": "1526985908019" }, { "category_id": 203, "category_name": "dash", "state": null }, { "category_id": 4, "category_name": "hello", "state": null }, { "category_id": 206, "category_name": "demo", "state": "1526985908187" }, { "category_id": 6, "category_name": "about", "state": null }, { "category_id": 3, "category_name": "role", "state": null }]; arr.sort(function (a, b) { return (a.state === null) - (b.state === null) || a.state - b.state || b.category_id - a.category_id; }); console.log(arr); 

Answer 2

 var data = [{ "category_id": 101, "category_name": "abc", "state": null }, { "category_id": 204, "category_name": "test", "state": null }, { "category_id": 7, "category_name": "pqr", "state": "1526985908122" }, { "category_id": 103, "category_name": "User", "state": null }, { "category_id": 2, "category_name": "System", "state": null }, { "category_id": 205, "category_name": "xyz", "state": "1526985908019" }, { "category_id": 203, "category_name": "dash", "state": null }, { "category_id": 4, "category_name": "hello", "state": null }, { "category_id": 206, "category_name": "demo", "state": "1526985908187" }, { "category_id": 6, "category_name": "about", "state": null }, { "category_id": 3, "category_name": "role", "state": null } ]; var valueWithoutNull = data.filter(val => val.state != null); var valueWithNull = data.filter(val => val.state == null); valueWithoutNull = valueWithoutNull.sort((a, b) => a.state - b.state); var result = [...valueWithoutNull, ...valueWithNull]; console.log(result); 

 var data = [{ "category_id": 101, "category_name": "abc", "state": null }, { "category_id": 204, "category_name": "test", "state": null }, { "category_id": 7, "category_name": "pqr", "state": "1526985908122" }, { "category_id": 103, "category_name": "User", "state": null }, { "category_id": 2, "category_name": "System", "state": null }, { "category_id": 205, "category_name": "xyz", "state": "1526985908019" }, { "category_id": 203, "category_name": "dash", "state": null }, { "category_id": 4, "category_name": "hello", "state": null }, { "category_id": 206, "category_name": "demo", "state": "1526985908187" }, { "category_id": 6, "category_name": "about", "state": null }, { "category_id": 3, "category_name": "role", "state": null } ]; data = data.sort(function(a, b) { if (a.state == null) return 1; if (b.state == null) return -1; return a.state - b.state; }); console.log(data); 

Answer 3

嘗試跟隨

 var arr = [{"category_id":101,"category_name":"abc","state":null},{"category_id":204,"category_name":"test","state":null},{"category_id":7,"category_name":"pqr","state":"1526985908122"},{"category_id":103,"category_name":"User","state":null},{"category_id":2,"category_name":"System",state:null},{"category_id":205,"category_name":"xyz","state":"1526985908019"},{"category_id":203,"category_name":"dash","state":null},{"category_id":4,"category_name":"hello","state":null},{"category_id":206,"category_name":"demo","state":"1526985908187"},{"category_id":6,"category_name":"about","state":null},{"category_id":3,"category_name":"role","state":null}]; arr.sort((a,b) => { // If both null, sort by category_id descending if(!a.state && !b.state) return b.category_id - a.category_id; // if first value is null, swap else if(!a.state) return 1; // if second value is null, no change else if (!b.state) return -1; // if both have values sort by state ascending. else return a.state - b.state; }) console.log(arr); 

Answer 4

@sky，嘗試以下解決方案

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script>
var test= [{"category_id":101,"category_name":"abc","state":null},
{"category_id":204,"category_name":"test","state":null},
{"category_id":7,"category_name":"pqr","state":"1526985908122"},
{"category_id":103,"category_name":"User","state":null},
{"category_id":2,"category_name":"System","state":null},
{"category_id":205,"category_name":"xyz","state":"1526985908019"},
{"category_id":203,"category_name":"dash","state":null},
{"category_id":4,"category_name":"hello","state":null},
{"category_id":206,"category_name":"demo","state":"1526985908187"},
{"category_id":6,"category_name":"about","state":null},
{"category_id":3,"category_name":"role","state":null}];

 function sortByKeyAsc(array, key) {
        return array.sort(function (a, b) {
            var x = a[key]; var y = b[key];
            return ((x < y) ? -1 : ((x > y) ? 1 : 0));
        });
    }
function sortByKeyDesc(array, key) {
    return array.sort(function (a, b) {
        var x = a[key]; var y = b[key];
        return ((x > y) ? -1 : ((x < y) ? 1 : 0));
    });
}
console.log(sortByKeyDesc(test,"state")  );
</script>
</head>
<body>

</body>
</html>