Sorting an Array of Objects by String: 5 Ways for JavaScript

Sorting an Array of Objects by a String Property: Breaking Down a Popular Stack Overflow Question

Imagine: you have a list of users, products, or articles. Each element is an object with a bunch of properties: name, price, date, rating. And you need to sort all of this, say, by last name in alphabetical order. A task that seems simple, but in practice throws up surprises. It's no wonder the question "Sort array of objects by string property value" on Stack Overflow has gathered thousands of views and dozens of answers.

In this article, we won't just give you ready-made code. We'll break down 5 sorting methods, from basic to advanced, identify typical pitfalls and show you how to avoid them. By the end, you'll be able to sort any data with one hand tied behind your back.

What is sorting an array of objects in JavaScript?

JavaScript has a built-in method Array.prototype.sort(). But it works non-obviously with objects. If you call sort() without arguments, it will try to compare elements as strings. For numbers, this gives a surprise: [1, 20, 3].sort() will return [1, 20, 3], not [1, 3, 20]. For objects — complete chaos.

Therefore, we need a comparator function. It takes two elements and returns:

\n
• a negative number if the first element is less than the second;
\n
• 0 if they are equal;
\n
• a positive number if the first is greater.
\n

Here is the basic structure for sorting an array of objects by a string property:

// Initial array\nconst users = [\n    { name: 'Ivan', age: 25 },\n    { name: 'Anna', age: 30 },\n    { name: 'Boris', age: 22 }\n];\n\n// Sorting by the name field\nusers.sort((a, b) => {\n    if (a.name < b.name) return -1;\n    if (a.name > b.name) return 1;\n    return 0;\n});\n\nconsole.log(users);\n// [{ name: 'Anna', age: 30 }, { name: 'Boris', age: 22 }, { name: 'Ivan', age: 25 }]

This code works, but it is cumbersome. Let's see how to make it more elegant.

5 Ways to Sort an Array of Objects by String

Method 1: Classic Comparison Function

The most transparent method. Suitable for any strings, including Cyrillic, provided you use the correct alphabetical order. Comparison via < and > takes into account character codes in Unicode, which for the Russian language gives an unexpected result: "ё" will end up at the end of the alphabet, and "я" will be next to "а".

const products = [\n    { title: 'Apple', price: 50 },\n    { title: 'Fir Tree', price: 200 },\n    { title: 'Pineapple', price: 150 }\n];\n\n// Problem: 'Fir Tree' will be placed after 'Apple'\nproducts.sort((a, b) => {\n    if (a.title < b.title) return -1;\n    if (a.title > b.title) return 1;\n    return 0;\n});

When to use: for English strings where alphabetical order matches Unicode.

Method 2: localeCompare — The Savior of Cyrillic

The String.prototype.localeCompare() method takes into account sorting rules for a specific language. For Russian — pass 'ru'.

users.sort((a, b) => a.name.localeCompare(b.name, 'ru'));\n\nconsole.log(users);\n// [{ name: 'Anna', age: 30 }, { name: 'Boris', age: 22 }, { name: 'Ivan', age: 25 }]

This code is cleaner, shorter, and correctly handles "ё", "й", and other letters. If you need to sort in descending order — just swap a and b:

users.sort((a, b) => b.name.localeCompare(a.name, 'ru'));

When to use: always when working with Cyrillic or multilingual data.

Method 3: Case-Sensitive Sorting

By default, localeCompare is case-sensitive: "apple" will come before "Banana" because a lowercase letter has