{

Typescript Array Sort example | javascript


Typescript Array Sort method with example

In this blog post, We are going to learn how to Sort Array in javascript or typescript.

We are going to learn Sort in typescript

  • How to sort an array of strings in typescript?
  • How to sort an array of objects in javascript?

The typescript Array class provides a sort method to sort elements.

typescript Array Sort method

The Array class provides the method sort to the array elements in ascending or descending order.

Elements can be simple strings, Object which contain keys and values, or Typescript classes.

Syntax:

Array.sort(ComparatorFunction)  

Parameters are ComparatorFunction is a callback function that specifies the order of the elements, If not passed, the default sorting is applied.

How to Sort Array of String in typescript Example

Array Declared and initialized with new Array() and initialized with strings separated in a comma. Array.sort() method is used without comparator function.

Here is an example

var arrayStrings = new Array("one", "two", "there", "four");   
var sortedArray = arrayStrings.sort();   
console.log(""+sortedArray );  

Output:

four,one,there,two  

How to sort Array of Interfaces in Typescript

The object can be directly created using data created with array syntax or you can create a use Interface.

This Emp object contains id and names. This example sorts the objects by name property.

First created Emp interface.

 interface Emp {  
     id: number;  
     name: string;  
}

Next, Create an Array of Objects and initialize it with values

var emps: Emp[] = [  
    { id: "5", name: "Kiran" },  
    { id: "1", name: "Frank" },  
    { id: "2", name: "Tom" },  
    { id: "51", name: "Abc" }  
]  

And Write a Compare Function for the Name of the Emp object

var compareName = function (emp1: Emp, emp2: Emp) {  
        if (emp1.name > emp2.name) { return -1; }  
        if (emp1.name < emp2.name) {return 1; }  
        return 0;  
    } 

Finally Call Array.sort() with compare function

var sortedArray = emps.sort(compareName);   
console.log(sortedArray );  

Output is

0: {id: "2", name: "Tom"}  
1: {id: "5", name: "Kiran"}  
2: {id: "1", name: "Frank"}  
3: {id: "51", name: "Abc"}  

How to Sort Array Object Data by Date property Example

The object contains key date property.

We can sort the object data based on date in ascending or descending.

Need to supply comparator custom code which handles Date comparisons.

The first Date string is converted to an Inbuilt Date object.

Date ascending This is an example sort an array of objects date by date ascending.

interface Emp {  
     id: number;  
     name: string;  
     date: Date;  
}  
var emps: Emp[] = [  
    { id: "5", name: "Kiran",date:"2018-05-05" },  
    { id: "1", name: "Frank",date:"2017-05-05"},  
    { id: "2", name: "Tom",date:"2016-05-05" },  
    { id: "51", name: "Abc" ,date:"2018-10-05"}  
]  
  
var compareDate = function (emp1: Emp, emp2: Emp) {  
    var emp1Date = new Date(emp1.date).getTime();  
    var emp2Date = new Date(emp2.date).getTime();  
    return emp1Date > emp2Date ? 1 : -1;    
}  
var sortedArray = emps.sort(compareDate);   
console.log(sortedArray );  

Output:

0: {id: "2", name: "Tom", date: "2016-05-05"}  
1: {id: "1", name: "Frank", date: "2017-05-05"}  
2: {id: "5", name: "Kiran", date: "2018-05-05"}  
3: {id: "51", name: "Abc", date: "2018-10-05"}  

We will see the Sort Date by descending.
Object property date descending

var compareDate = function (emp1: Emp, emp2: Emp) {  
    var emp1Date = new Date(emp1.date).getTime();  
    var emp2Date = new Date(emp2.date).getTime();  
    return emp1Date > emp2Date ? -1 : 1;    
}  

Output:

0: {id: "51", name: "Abc", date: "2018-10-05"}  
1: {id: "5", name: "Kiran", date: "2018-05-05"}  
2: {id: "1", name: "Frank", date: "2017-05-05"}  
3: {id: "2", name: "Tom", date: "2016-05-05"}  

UnderscoreJs Array Sort Example

UnderscoreJS is a javascript library that provides a lot of utility functions.

It provides a sortBy function which accepts an array and a function as an argument. This library can be used in javascript or typescript applications using an npm package manager. This can be installed using the npm command.

Here is an example of array string sorting in descending

var sortedArray=_.sortBy(["four", "one", "zero"], function (value) { return value.toLowerCase(); });  
console.log(sortedArray);  

output:

["four","one","zero"]  

Conclusion

To Sum Up, You learned the array declaration and initialization syntax of the sort method, How to sort an array of strings, objects, and interfaces with date key sorting in ascending or descending order.

THE BEST NEWSLETTER ANYWHERE
Join 6,000 subscribers and get a daily digest of full stack tutorials delivered to your inbox directly.No spam ever. Unsubscribe any time.

Similar Posts
Subscribe
You'll get a notification every time a post gets published here.