Languages
[Edit]
EN

JavaScript - compare strings

4 points
Created by:
Root-ssh
177200

In this article, we're going to have a look at how to compare two strings when we want to sort them in JavaScript.

Quick solution:

// ONLINE-RUNNER:browser;

console.log( 'a'.localeCompare('a') );  //  0   // a is equal to a
console.log( 'a'.localeCompare('b') );  // -1   // a is before b
console.log( 'b'.localeCompare('a') );  // +1   // b is after a

 

Introduction

There are two approaches to comparing strings:

  • String localeCompare() method - that returns information which one should be first according to alphabet letters priority.
  • comparators like: <, >== or === - that return only true or false for compared strings,

The second approach requires at least two tests to know about compared string's priority.

In the below examples you can see practical usage.

1. localeCompare() method example

String localeCompare method returns -1, 0 or +1 value to inform which one should be first according to alphabet letters priority.

// ONLINE-RUNNER:browser;

console.log( 'a'.localeCompare('a') );  //  0   // a is equal to a
console.log( 'a'.localeCompare('b') );  // -1   // a is before b
console.log( 'b'.localeCompare('a') );  // +1   // b is after a

console.log( 'aab'.localeCompare('aab') );  //  0   // aab is equal to aab
console.log( 'aac'.localeCompare('aaa') );  // +1   // aac is after aaa
console.log( '123'.localeCompare('321') );  // -1   // 123 is before 321

 

2. Compare with comparators example

With this approach, we need to make a few tests to know which one should be first.

2.1. Simple cases example

// ONLINE-RUNNER:browser;

console.log( 'a' == 'a' );  // true
console.log( 'a' < 'b'  );  // true
console.log( 'b' > 'a'  );  // true

console.log( 'aab' == 'aab' );  // true
console.log( 'aac' > 'aaa'  );  // true
console.log( '123' < '321'  );  // true

console.log( 'a' < 'a' );  // false
console.log( 'a' < 'b' );  // true
console.log( 'b' < 'a' );  // false

console.log( 'aab' > 'aab' );  // false
console.log( 'aac' > 'aaa' );  // true
console.log( '123' > '321' );  // false

2.2. Reusable function example

In this section, we want to show how to write our own comparison method using operators.

Note: with this approach we are able to compare numbers, strings, dates and booleans without writing additional functions - so it can be easly used to sort data by any column, e.g. in last section with sorting array of objects.

// ONLINE-RUNNER:browser;

function compareStrings(a, b) {
    if (a < b) return -1;
    if (a > b) return +1;
    return 0;
}

// Using example:

console.log( compareStrings('a', 'a') );  //  0   // a is equal to a
console.log( compareStrings('a', 'b') );  // -1   // a is before b
console.log( compareStrings('b', 'a') );  // +1   // b is after a

console.log( compareStrings('aab', 'aab') );  //  0   // aab is equal to aab
console.log( compareStrings('aac', 'aaa') );  // +1   // aac is after aaa
console.log( compareStrings('123', '321') );  // -1   // 123 is before 321

 

4. Sorting array of objects example

The approach presented in this section is universal - can be used to sort columns of different types. Check the previous section (3. Custom compare method example) to see the simplest example.

// ONLINE-RUNNER:browser;

function compareValues(a, b) {
    if (a < b) return -1;
    if (a > b) return +1;
    return 0;
}

function sortArray(array, columnName) {
	return array.sort(function(a, b) { 
    	return compareValues(a[columnName], b[columnName]);
	});
}


// Using example:

var array = [
    {name: 'Chris', age: 30, joinedAt: new Date(2019, 1,  1)},
    {name: 'Adel',  age: 26, joinedAt: new Date(2010, 7, 23)},
    {name: 'Kate',  age: 21, joinedAt: new Date(2020, 5, 15)},
];
var columnName = 'joinedAt';

sortArray(array, columnName);

for (var i = 0; i < array.length; ++i) {
    var entry = array[i];
    console.log(entry.name + '\t' + entry.age + '\t' + entry.joinedAt);
}

 

See also

  1. JavaScript - universal way to compare values (boolean, number, string, Date, etc.)

Alternative titles

  1. JavaScript - compare strings (e. g. for sorting / ordering)
Donate to Dirask
Our content is created by volunteers - like Wikipedia. If you think, the things we do are good, donate us. Thanks!
Join to our subscribers to be up to date with content, news and offers.

JavaScript - String (popular problems)

JavaScript - compare strings (e. g. for sorting / ordering)
Native Advertising
🚀
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

❤️💻 🙂

Join