How To Sort An Array Of Strings Ignoring The Case In JavaScript

If you don’t know how to sort an array of strings ignoring the case in JavaScript, don’t worry. We will give you some ways to do it in this article. Read on it.

Sort an array of strings ignoring the case in JavaScript

In this section, we all use the sort() method of the array, but the parameters and the input method are different to achieve the desired result.

Syntax:

Functionless:

array.sort()

Arrow function:

array.sort((firstEl, secondEl) => { ... } )

Compare function:

array.sort(compare)

Inline compare:

function array.sort(function compareFn(firstEl, secondEl) { ... })

Parameters:

• compareFn is an optional parameter. This callback function is used to decide the sort order of the elements in the array. The two parameters, firstEl and second, represent two adjacent elements in the array, and we will use them to decide how to sort.
• If the callback function returns a number greater than 0, then secondEl will precede firstEl.
• If the callback function returns a number less than or equal to 0, the order is preserved, i.e., firstEl will come before secondEl.

Use Intl.Collator().compare method

Because of Intl. Collator allows the comparison of strings with optional language. It has the following syntax:

new Intl.Collator(locales, options)

Parameters:

• locales (Optional): This argument helps JS determine the locale you’re comparing.

• options (Optional):

Undefined: default value.

Locale: A language identifier, e.g., “en-US” – “English (United States)”.

Code:

export default function App() {
  const array = ["bob", "Adam", "Jack"];

  //Sort array by alphabet
  const sortedArray = array.sort(Intl.Collator().compare);

  console.log(sortedArray);
 
  return (
    <div>
      <div>
        <h2>Sort an Array of strings ignoring the Case | LearnShareIT</h2>
        <hr />
        <ul>
          {sortedArray.map((item) => (
            <li key={item}>{item}</li>
          ))}
        </ul>
      </div>
    </div>
  );
}

Output:

So when we pass Intl. Collator().compare to the sort function with Intl.Collator() with no arguments, the program will sort the array alphabetically. So from the array [“bob”, “Adam”, “Jack”] becomes [‘Adam’, ‘bob’, ‘Jack’]. So we can sort an array of strings ignoring the case in JavaScript.

Use the Elvis operator

This way, we will use the Elvis operator to filter out each comparison case of string1 and string2. See the example below to understand more about how to do this.

Code:

export default function App() {
  const array = ["Bob", "Kanye", "Tom", "joker", "barn"];
  const sortedArray = array.sort(function (str1, str2) {

    //Convert string to lowercase
    var string1 = str1.toLowerCase();
    var string2 = str2.toLowerCase();

     //Sort array with Elvis operator
    return string1 === string2 ? 1 : string1 > string2 ? 0: -1;

  });
 
  console.log(sortedArray);
  return (
    <div>
      <div>
        <h2>Sort an Array of strings ignoring the Case | LearnShareIT</h2>
        <hr />
        <ul>
          {sortedArray.map((item) => (
            <li key={item}>{item}</li>
          ))}
        </ul>
      </div>
    </div>
  );
}

Output:

First, we will convert the strings to be compared to lowercase so that we can ignore the case of the string, then use the Elvis operator as shown. When two strings are equal, return 1. When string1 is more extended than string 2, returns 0, and otherwise, returns -1.

Summary

To summarize, there are many ways to sort an array of strings ignoring the case in JavaScript. After reading this article, we know some easy ways belike using Intl.Collator().compare method or using the Elvis operator.

Maybe you are interested:

• How to get the Union of Two Arrays in JavaScript
• Sort an Array of Booleans in JavaScript
• Convert an array of objects to a map in javascript

Nathaniel Kirk

Hi, my name’s Nathaniel Kirk. I’m interested in learning and sharing knowledge about programming languages. My strengths are C, C++, Python, HTML, CSS, Javascript, and Reactjs. If you have difficulty with them, don’t worry. I’m here to support you.

---

Name of the university: PTIT
Major: IT
Programming Languages: C, C++, Python, HTML, CSS, Javascript, Reactjs