Sort Object in Ascending Order by Key Value in JavaScript

Sorting an object in ascending order by the value of a key is a common task in JavaScript. Objects are data structures, which are a collection of key-value pairs. Since objects in JavaScript are unordered collections, sorting them directly is not possible. This article will guide you on how to sort an object in ascending order by the value of a key in JavaScript.

Understanding the Concept

Suppose we have the following object:

const obj = {
   "sub1": 56,
   "sub2": 67,
   "sub3": 98,
   "sub4": 54,
   "sub5": 87
};

We are required to write a JavaScript function that takes in one such object. Then our function should sort the object in ascending order of the values present in the object. And then at last, we should return the object thus formed.

Algorithm For Sorting Object Keys

Here is the algorithm to sort an object by the value of a specific key:

• Create an object with subjects and scores.
• Define a function to sort the subjects based on scores.
• Get the keys of the object and sort them.
• Create a new object with the sorted keys and their scores.
• Return and display the sorted object.

Code Implementation

The following is a simple code implementation for sorting an object in ascending order by the value of a key in JavaScript.

const obj = {
"sub1": 56,
"sub2": 67,
"sub3": 98,
"sub4": 54,
"sub5": 87
};
const sortObject = obj => {
const sorter = (a, b) => {
    return obj[a] - obj[b];
};
const keys = Object.keys(obj);
keys.sort(sorter);
const res = {};
keys.forEach(key => {
    res[key] = obj[key];
});
return res;
};
console.log(sortObject(obj));

Output

{ sub4: 54, sub1: 56, sub2: 67, sub5: 87, sub3: 98 }

Code Explanation

Here is the code explanation for the above code:

• In the above code, we start by creating an object called obj that contains five subjects (sub1 to sub5) with their corresponding scores.
• Then, defined a function named sortObject. This function will sort the subjects based on their scores.
• Inside the function, there is a helper function called sorter. This function takes two keys (subject names) and compares their scores in the obj object. It returns the difference between the two scores, which helps in sorting them.
• The function then gets all the keys (subject names) from the obj object using Object.keys(obj). This creates an array of the subject names.
• The keys (subject names) are sorted using the sorter function. After this step, the keys are arranged in order based on their scores from lowest to highest.
• A new empty object called res is created. The function then goes through each sorted key and adds the corresponding score from the original obj to the new res object.
• Finally, the function returns the new object res, which contains the subjects sorted by their scores.
• The last line of the code calls the sortObject function with obj as the argument and prints the sorted result to the console.

Conclusion

In this article, we have created a simple function that efficiently sorts an object in ascending order by the value of a key. This method is simple and follows the basic approach. This technique is essential when dealing with structured data in applications.