I have an array of objects with several key value pairs, and I need to sort them based on 'updated_at':
[
{
"updated_at" : "2012-01-01T06:25:24Z",
"foo" : "bar"
},
{
"updated_at" : "2012-01-09T11:25:13Z",
"foo" : "bar"
},
{
"updated_at" : "2012-01-05T04:13:24Z",
"foo" : "bar"
}
]
What's the most efficient way to do so?
This question is related to
javascript
arrays
object
You could use the Lodash utility library to solve this problem (it's quite an efficient library):
const data = [{_x000D_
"updated_at": "2012-01-01T06:25:24Z",_x000D_
"foo": "bar"_x000D_
},_x000D_
{_x000D_
"updated_at": "2012-01-09T11:25:13Z",_x000D_
"foo": "bar"_x000D_
},_x000D_
{_x000D_
"updated_at": "2012-01-05T04:13:24Z",_x000D_
"foo": "bar"_x000D_
}_x000D_
]_x000D_
_x000D_
const ordered = _.orderBy(_x000D_
data,_x000D_
function(item) {_x000D_
return item.updated_at;_x000D_
}_x000D_
);_x000D_
_x000D_
console.log(ordered)
_x000D_
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>
_x000D_
You can find documentation here: https://lodash.com/docs/4.17.15#orderBy
Data Imported
[
{
"gameStatus": "1",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-20 11:32:04"
},
{
"gameStatus": "0",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 18:08:24"
},
{
"gameStatus": "2",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 18:35:40"
},
{
"gameStatus": "0",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 10:42:53"
},
{
"gameStatus": "2",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-20 10:54:09"
},
{
"gameStatus": "0",
"userId": "1a2fefb0-5ae2-47eb-82ff-d1b2cc27875a",
"created_at": "2018-12-19 18:46:22"
},
{
"gameStatus": "1",
"userId": "7118ed61-d8d9-4098-a81b-484158806d21",
"created_at": "2018-12-20 10:50:48"
}
]
FOR Ascending order
arr.sort(function(a, b){
var keyA = new Date(a.updated_at),
keyB = new Date(b.updated_at);
// Compare the 2 dates
if(keyA < keyB) return -1;
if(keyA > keyB) return 1;
return 0;
});
Example for Asc Order
[
{
"gameStatus": "0",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 10:42:53"
},
{
"gameStatus": "0",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 18:08:24"
},
{
"gameStatus": "2",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 18:35:40"
},
{
"gameStatus": "0",
"userId": "1a2fefb0-5ae2-47eb-82ff-d1b2cc27875a",
"created_at": "2018-12-19 18:46:22"
},
{
"gameStatus": "1",
"userId": "7118ed61-d8d9-4098-a81b-484158806d21",
"created_at": "2018-12-20 10:50:48"
},
{
"gameStatus": "2",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-20 10:54:09"
},
{
"gameStatus": "1",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-20 11:32:04"
}
]
FOR Descending order
arr.sort(function(a, b){
var keyA = new Date(a.updated_at),
keyB = new Date(b.updated_at);
// Compare the 2 dates
if(keyA > keyB) return -1;
if(keyA < keyB) return 1;
return 0;
});
Example for Desc Order
[
{
"gameStatus": "1",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-20 11:32:04"
},
{
"gameStatus": "2",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-20 10:54:09"
},
{
"gameStatus": "1",
"userId": "7118ed61-d8d9-4098-a81b-484158806d21",
"created_at": "2018-12-20 10:50:48"
},
{
"gameStatus": "0",
"userId": "1a2fefb0-5ae2-47eb-82ff-d1b2cc27875a",
"created_at": "2018-12-19 18:46:22"
},
{
"gameStatus": "2",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 18:35:40"
},
{
"gameStatus": "0",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 18:08:24"
},
{
"gameStatus": "0",
"userId": "c02cfb18-ae66-430b-9524-67d9dd8f6a50",
"created_at": "2018-12-19 10:42:53"
}
]
With ES2015 support it can be done by:
foo.sort((a, b) => a.updated_at < b.updated_at ? -1 : 1)
var months = [
{
"updated_at" : "2012-01-01T06:25:24Z",
"foo" : "bar"
},
{
"updated_at" : "2012-01-09T11:25:13Z",
"foo" : "bar"
},
{
"updated_at" : "2012-01-05T04:13:24Z",
"foo" : "bar"
}];
months.sort((a, b)=>{
var keyA = new Date(a.updated_at),
keyB = new Date(b.updated_at);
// Compare the 2 dates
if(keyA < keyB) return -1;
if(keyA > keyB) return 1;
return 0;
});
console.log(months);
Here's a slightly modified version of @David Brainer-Bankers answer that sorts alphabetically by string, or numerically by number, and ensures that words beginning with Capital letters don't sort above words starting with a lower case letter (e.g "apple,Early" would be displayed in that order).
function sortByKey(array, key) {
return array.sort(function(a, b) {
var x = a[key];
var y = b[key];
if (typeof x == "string")
{
x = (""+x).toLowerCase();
}
if (typeof y == "string")
{
y = (""+y).toLowerCase();
}
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
});
}
As for today, answers of @knowbody (https://stackoverflow.com/a/42418963/6778546) and @Rocket Hazmat (https://stackoverflow.com/a/8837511/6778546) can be combined to provide for ES2015 support and correct date handling:
arr.sort((a, b) => {
const dateA = new Date(a.updated_at);
const dateB = new Date(b.updated_at);
return dateA - dateB;
});
Array.sort()
to sort an array…
) to make the function pureupdated_at
)Array.sort()
works by subtracting two properties from current and next item if it is a number / object on which you can perform arrhythmic operationsconst input = [
{
updated_at: '2012-01-01T06:25:24Z',
foo: 'bar',
},
{
updated_at: '2012-01-09T11:25:13Z',
foo: 'bar',
},
{
updated_at: '2012-01-05T04:13:24Z',
foo: 'bar',
}
];
const sortByUpdatedAt = (items) => [...items].sort((itemA, itemB) => new Date(itemA.updated_at) - new Date(itemB.updated_at));
const output = sortByUpdatedAt(input);
console.log(input);
/*
[ { updated_at: '2012-01-01T06:25:24Z', foo: 'bar' },
{ updated_at: '2012-01-09T11:25:13Z', foo: 'bar' },
{ updated_at: '2012-01-05T04:13:24Z', foo: 'bar' } ]
*/
console.log(output)
/*
[ { updated_at: '2012-01-01T06:25:24Z', foo: 'bar' },
{ updated_at: '2012-01-05T04:13:24Z', foo: 'bar' },
{ updated_at: '2012-01-09T11:25:13Z', foo: 'bar' } ]
*/
Use underscore js or lodash,
var arrObj = [
{
"updated_at" : "2012-01-01T06:25:24Z",
"foo" : "bar"
},
{
"updated_at" : "2012-01-09T11:25:13Z",
"foo" : "bar"
},
{
"updated_at" : "2012-01-05T04:13:24Z",
"foo" : "bar"
}
];
arrObj = _.sortBy(arrObj,"updated_at");
_.sortBy()
returns a new array
refer http://underscorejs.org/#sortBy and lodash docs https://lodash.com/docs#sortBy
You can create a closure and pass it that way here is my example working
$.get('https://data.seattle.gov/resource/3k2p-39jp.json?$limit=10&$where=within_circle(incident_location, 47.594972, -122.331518, 1609.34)',
function(responce) {
var filter = 'event_clearance_group', //sort by key group name
data = responce;
var compare = function (filter) {
return function (a,b) {
var a = a[filter],
b = b[filter];
if (a < b) {
return -1;
} else if (a > b) {
return 1;
} else {
return 0;
}
};
};
filter = compare(filter); //set filter
console.log(data.sort(filter));
});
With this we can pass a key function to use for the sorting
Array.prototype.sortBy = function(key_func, reverse=false){
return this.sort( (a, b) => {
var keyA = key_func(a),
keyB = key_func(b);
if(keyA < keyB) return reverse? 1: -1;
if(keyA > keyB) return reverse? -1: 1;
return 0;
});
}
Then for example if we have
var arr = [ {date: "01/12/00", balls: {red: "a8", blue: 10}},
{date: "12/13/05", balls: {red: "d6" , blue: 11}},
{date: "03/02/04", balls: {red: "c4" , blue: 15}} ]
We can do
arr.sortBy(el => el.balls.red)
/* would result in
[ {date: "01/12/00", balls: {red: "a8", blue: 10}},
{date: "03/02/04", balls: {red: "c4", blue: 15}},
{date: "12/13/05", balls: {red: "d6", blue: 11}} ]
*/
or
arr.sortBy(el => new Date(el.date), true) // second argument to reverse it
/* would result in
[ {date: "12/13/05", balls: {red: "d6", blue:11}},
{date: "03/02/04", balls: {red: "c4", blue:15}},
{date: "01/12/00", balls: {red: "a8", blue:10}} ]
*/
or
arr.sortBy(el => el.balls.blue + parseInt(el.balls.red[1]))
/* would result in
[ {date: "12/13/05", balls: {red: "d6", blue:11}}, // red + blue= 17
{date: "01/12/00", balls: {red: "a8", blue:10}}, // red + blue= 18
{date: "03/02/04", balls: {red: "c4", blue:15}} ] // red + blue= 19
*/
I already answered a really similar question here: Simple function to sort an array of objects
For that question I created this little function that might do what you want:
function sortByKey(array, key) {
return array.sort(function(a, b) {
var x = a[key]; var y = b[key];
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
});
}
As This answer's states, you can use Array.sort
.
arr.sort(function(a,b){return new Date(a.updated_at) - new Date(b.updated_at)})
arr = [_x000D_
{_x000D_
"updated_at" : "2012-01-01T06:25:24Z",_x000D_
"foo" : "bar"_x000D_
},_x000D_
{_x000D_
"updated_at" : "2012-01-09T11:25:13Z",_x000D_
"foo" : "bar"_x000D_
},_x000D_
{_x000D_
"updated_at" : "2012-01-05T04:13:24Z",_x000D_
"foo" : "bar"_x000D_
}_x000D_
];_x000D_
arr.sort(function(a,b){return new Date(a.updated_at) - new Date(b.updated_at)});_x000D_
console.log(arr);
_x000D_
I have created a sorting function in Typescript which we can use to search strings, dates and numbers in array of objects. It can also sort on multiple fields.
export type SortType = 'string' | 'number' | 'date';
export type SortingOrder = 'asc' | 'desc';
export interface SortOptions {
sortByKey: string;
sortType?: SortType;
sortingOrder?: SortingOrder;
}
class CustomSorting {
static sortArrayOfObjects(fields: SortOptions[] = [{sortByKey: 'value', sortType: 'string', sortingOrder: 'desc'}]) {
return (a, b) => fields
.map((field) => {
if (!a[field.sortByKey] || !b[field.sortByKey]) {
return 0;
}
const direction = field.sortingOrder === 'asc' ? 1 : -1;
let firstValue;
let secondValue;
if (field.sortType === 'string') {
firstValue = a[field.sortByKey].toUpperCase();
secondValue = b[field.sortByKey].toUpperCase();
} else if (field.sortType === 'number') {
firstValue = parseInt(a[field.sortByKey], 10);
secondValue = parseInt(b[field.sortByKey], 10);
} else if (field.sortType === 'date') {
firstValue = new Date(a[field.sortByKey]);
secondValue = new Date(b[field.sortByKey]);
}
return firstValue > secondValue ? direction : firstValue < secondValue ? -(direction) : 0;
})
.reduce((pos, neg) => pos ? pos : neg, 0);
}
}
}
Usage:
const sortOptions = [{
sortByKey: 'anyKey',
sortType: 'string',
sortingOrder: 'asc',
}];
arrayOfObjects.sort(CustomSorting.sortArrayOfObjects(sortOptions));
Just another, more mathematical, way of doing the same thing but shorter:
arr.sort(function(a, b){
var diff = new Date(a.updated_at) - new Date(b.updated_at);
return diff/(Math.abs(diff)||1);
});
or in the slick lambda arrow style:
arr.sort((a, b) => {
var diff = new Date(a.updated_at) - new Date(b.updated_at);
return diff/(Math.abs(diff)||1);
});
This method can be done with any numeric input
The Array.sort() method sorts the elements of an array in place and returns the array. Be careful with Array.sort() as it's not Immutable. For immutable sort use immutable-sort.
This method is to sort the array using your current updated_at
in ISO format. We use new Data(iso_string).getTime()
to convert ISO time to Unix timestamp. A Unix timestamp is a number that we can do simple math on. We subtract the first and second timestamp the result is; if the first timestamp is bigger than the second the return number will be positive. If the second number is bigger than the first the return value will be negative. If the two are the same the return will be zero. This alines perfectly with the required return values for the inline function.
For ES6:
arr.sort((a,b) => new Date(a.updated_at).getTime() - new Date(b.updated_at).getTime());
For ES5:
arr.sort(function(a,b){
return new Date(a.updated_at).getTime() - new Date(b.updated_at).getTime();
});
If you change your updated_at
to be unix timestamps you can do this:
For ES6:
arr.sort((a,b) => a.updated_at - b.updated_at);
For ES5:
arr.sort(function(a,b){
return a.updated_at - b.updated_at;
});
At the time of this post, modern browsers do not support ES6. To use ES6 in modern browsers use babel to transpile the code to ES5. Expect browser support for ES6 in the near future.
Array.sort() should receave a return value of one of 3 possible outcomes:
Note that the return value on the inline function can be any positive or negative number. Array.Sort() does not care what the return number is. It only cares if the return value is positive, negative or zero.
For Immutable sort: (example in ES6)
const sort = require('immutable-sort');
const array = [1, 5, 2, 4, 3];
const sortedArray = sort(array);
You can also write it this way:
import sort from 'immutable-sort';
const array = [1, 5, 2, 4, 3];
const sortedArray = sort(array);
The import-from you see is a new way to include javascript in ES6 and makes your code look very clean. My personal favorite.
Immutable sort doesn't mutate the source array rather it returns a new array. Using const
is recommended on immutable data.
For completeness here is a possible short generic implementation of sortBy:
function sortBy(list, keyFunc) {
return list.sort((a,b) => keyFunc(a) - keyFunc(b));
}
sortBy([{"key": 2}, {"key": 1}], o => o["key"])
Note that this uses the arrays sort method that sorts in place. for a copy you can use arr.concat() or arr.slice(0) or similar method to create a copy.
I face with same thing, so i handle this with a generic why and i build a function for this:
//example: //array: [{name: 'idan', workerType: '3'}, {name: 'stas', workerType: '5'}, {name: 'kirill', workerType: '2'}] //keyField: 'workerType' // keysArray: ['4', '3', '2', '5', '6']
sortByArrayOfKeys = (array, keyField, keysArray) => {
array.sort((a, b) => {
const aIndex = keysArray.indexOf(a[keyField])
const bIndex = keysArray.indexOf(b[keyField])
if (aIndex < bIndex) return -1;
if (aIndex > bIndex) return 1;
return 0;
})
}
Sorting by an ISO formatted date can be expensive, unless you limit the clients to the latest and best browsers, which can create the correct timestamp by Date-parsing the string.
If you are sure of your input, and you know it will always be yyyy-mm-ddThh:mm:ss and GMT (Z) you can extract the digits from each member and compare them like integers
array.sort(function(a,b){
return a.updated_at.replace(/\D+/g,'')-b.updated_at.replace(/\D+/g,'');
});
If the date could be formatted differently, you may need to add something for iso challenged folks:
Date.fromISO: function(s){
var day, tz,
rx=/^(\d{4}\-\d\d\-\d\d([tT ][\d:\.]*)?)([zZ]|([+\-])(\d\d):(\d\d))?$/,
p= rx.exec(s) || [];
if(p[1]){
day= p[1].split(/\D/).map(function(itm){
return parseInt(itm, 10) || 0;
});
day[1]-= 1;
day= new Date(Date.UTC.apply(Date, day));
if(!day.getDate()) return NaN;
if(p[5]){
tz= (parseInt(p[5], 10)*60);
if(p[6]) tz+= parseInt(p[6], 10);
if(p[4]== '+') tz*= -1;
if(tz) day.setUTCMinutes(day.getUTCMinutes()+ tz);
}
return day;
}
return NaN;
}
if(!Array.prototype.map){
Array.prototype.map= function(fun, scope){
var T= this, L= T.length, A= Array(L), i= 0;
if(typeof fun== 'function'){
while(i< L){
if(i in T){
A[i]= fun.call(scope, T[i], i, T);
}
++i;
}
return A;
}
}
}
}
Source: Stackoverflow.com