JavaScript Sort Object By Value
Last Updated : Mar 12, 2024
IN - JavaScript | Written & Updated By - Riya
In this article we will show you the solution of JavaScript sort object by value, in the example below we will sort objects by value using the JavaScript built-in function Sort(). Let us know about this sort() function first.
Sort(): this is an array method in JavaScript. It is used to sort an array by modifying the original array. we have to write a compare function into it to sort it in either ascending or descending order.
The syntax for the sort() function is
array.sort([compareFunction]);
Step By Step Guide On JavaScript Sort Object By Value :-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JavaScript sort object by value</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css">
<style>
body{
background-color: aliceblue;
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}
h1{
color : rgb(95, 194, 95) ;
font-size: 25px;
font-weight : bolder ;
}
h3{
color : rgb(95, 194, 95) ;
font-size: 20px;
}
</style>
</head>
<body>
</head>
<body>
<center>
<h1> TALKERSCODE </h1>
<h3> JavaScript sort object by value </h3>
</center>
<script>
const person = [
{name: "peter", city: "paris"},
{name: "thomas", city: "london"},
{name: "steve", city: "mosco"},
{name: "carol", city: "newyork"},
{name: "rose", city: "seoul"},
{name: "lisa", city: "tokyo"},
] ;
person.sort((person1, person2) => {
person1 = person1.name.toLowerCase() ;
person2 = person2.name.toLowerCase() ;
if(person1<person2) {
return -1;
}
if(person1>person2) {
return 1;
}
return 0;
}) ;
console.table(person) ;
</script>
</body>
</html>
- Specifying the HTML version of a file is done by writing <!DOCTYPE html> in the HTML code.
- The <HTML> tag, indicating the root of an HTML document, should be included and closed with the </html> tag at the end.
- Metadata for the HTML file is contained within the <head> tag, which is terminated with the </head> tag.
- The HTML document's title is defined using the <title> tag, followed by the </title> tag.
- Styling for the HTML page will be achieved by utilizing an external CSS file.
- CSS can be added using the <style> tag.
- JavaScript can be written within the <script> tag, and it should be closed with the </script> tag.
- Using const to create an object named person. Add some keys and values into it. We will sort this object by value.
- Now using sort() method.
- Into it write two parameters peron1 and person2.
- Convert both of the parameters ‘name’ property to lowercase using toLowerCase() function
- Now create an if condition for if the person1<person2 then return -1.
- Again an if condition is created for if the person1>person2 then return 1.
- If not then return 0
- Using console.table() for displaying the sorted data as table.
Conclusion :-
Lastly, in conclusion, we can say that with this article’s help, we know to sort objects by value using JavaScript.
I hope this article on JavaScript sort object by value helps you and the steps and method mentioned above are easy to follow and implement.
About Riya
