JavaScript 2023 - New Features - Part 1

toSorted() function

It does not sort the existing array but returns new array after sorting.

Characteristics of toSorted() function

• It is used on primarily used on array object but can also be used on non array objects.

• The elements of array are converted to string before sorting.

• Predicate(a function) can be passed as argument to toSorted() function for custom sorting.

Can also be used with sparse arrays (array with empty blocks).

Using toSorted() function

Using with string array

// with string 
let arr = ["ram","hari","Gopi","ganesh","Rakesh"];
let arr2 = arr.toSorted(); 
console.log("string sorting ", arr2); // ascending order
// output : string sorting  (5) ['Gopi', 'Rakesh', 'ganesh', 'hari', 'ram']

The toSorted() function returns a new sorted array. The existing array is not sorted.The sorting is based on ASCII values.

Using with number array

 arr = [100,21,13,42,15,6,90];
 arr2 = arr.toSorted(); // converts to string
console.log("integer sorting", arr2); 
// output : integer sorting (7) [100, 13, 15, 21, 42, 6, 90]

The elements of number array are converted to string then the sorting occurs.

Using predicate

The function passed as argument to toSorted() function is called predicate.

// toSorted with - predicate - function argument
arr2 = arr.toSorted((a,b)=> a-b);
console.log("integer sorting", arr2); // ascending
arr2 = arr.toSorted((a,b)=> b-a);
console.log("integer sorting", arr2); // descending

Working with sparse array

An array which contains empty values is called sparse array. Empty values are converted to undefined when toSorted() is used.

// sparse array - with undefined
arr = ["ram",,"hari",,"gopi"]; 
arr2 = arr.toSorted(); // undefined at end
console.log("sparse array", arr2);

arr = [30,2,,46,,81,2.3,.9,1];
arr2 = arr.toSorted((a,b) => a-b); // undefined at end
console.log("sparse array", arr2);

In the above code the empty values are converted to undefined and put at the end of the new array.

Working with non-array object

An object can also be sorted provided it meets 2 requirements

• Object should have length property

• The keys should be numbers

    // Non array objects -length property + keys are integer 
    let obj = {    
        0: "Ram",
        1: "Manyakheta",
        2: "gopi",
        length:3
    };
  
    arr2 = Array.prototype.toSorted.call(obj);
    console.log("array", arr2);
    // array (3) ['Manyakheta', 'Ram', 'gopi']
  

  In the above code the object obj has length property and all the keys are numbers. The toSorted() function does not exist for object hence it is called on Array directly.

Complete Code Listing

//toSorted method - returns an new array with elements 
// sorted in ascending order

// with string 
let arr = ["ram","hari","Gopi","ganesh","Rakesh"];
let arr2 = arr.toSorted(); // converts to string (unicode)
console.log("string sorting ", arr2); // ascending order
// output : string sorting  (5) ['Gopi', 'Rakesh', 'ganesh', 'hari', 'ram']

// with integer array 
arr = [100,21,13,42,15,6,90];
arr2 = arr.toSorted(); // converts to string
console.log("integer sorting", arr2); 
// output : integer sorting (7) [100, 13, 15, 21, 42, 6, 90]

// toSorted with - predicate - function argument
arr2 = arr.toSorted((a,b)=> a-b);
console.log("integer sorting", arr2); // ascending
arr2 = arr.toSorted((a,b)=> b-a);
console.log("integer sorting", arr2); // descending 

// sparse array - with undefined
arr = ["ram",,"hari",,"gopi"]; 
arr2 = arr.toSorted(); // undefined at end
console.log("sparse array", arr2);

arr = [30,2,,46,,81,2.3,.9,1];
arr2 = arr.toSorted((a,b) => a-b); // undefined at end
console.log("sparse array", arr2);

// Non array objects -length property + keys are integer 
let obj = {

    0: "Ram",
    1: "Manyakheta",
    2: "gopi",
    length:3
};

arr2 = Array.prototype.toSorted.call(obj);
console.log("array", arr2);
// array (3) ['Manyakheta', 'Ram', 'gopi']

/