js how to sort array by string length

Sorting an Array by String Length in JavaScript

Sorting an array by string length is a common task in JavaScript development. The good news is that it can be accomplished with only a few lines of code.

Method 1: Using the sort() method with a custom comparator function

The easiest way to sort an array of strings by length is to use the built-in sort() method. However, since the default behavior of sort() is to sort the elements as strings, we need to provide our own comparator function to sort the elements by length.

const arr = ['apple', 'banana', 'pear', 'kiwi'];

arr.sort((a, b) => {
  return a.length - b.length;
});

console.log(arr); // ['kiwi', 'pear', 'apple', 'banana']

In this example, we create an array of fruits and use the sort() method with a custom comparator function to sort the elements by length. The comparator function takes two arguments (a and b) and returns a negative number if a should come before b, a positive number if a should come after b, and zero if they are equal.

Method 2: Using the map() method and the sort() method

Another way to sort an array of strings by length is to use the map() method to create an array of objects containing the original string and its length, then use the sort() method to sort the objects by length, and finally use the map() method again to extract the sorted strings.

const arr = ['apple', 'banana', 'pear', 'kiwi'];

const sortedArr = arr
  .map((str) => ({ str, len: str.length }))
  .sort((a, b) => a.len - b.len)
  .map(({ str }) => str);

console.log(sortedArr); // ['kiwi', 'pear', 'apple', 'banana']

In this example, we create an array of fruits and use the map() method to create an array of objects with the original string and its length. We then use the sort() method with a custom comparator function to sort the objects by length. Finally, we use the map() method again to extract the sorted strings from the sorted array of objects.

Method 3: Using the localeCompare() method

The localeCompare() method is another way to sort an array of strings by length. This method compares two strings and returns a negative number if str1 should come before str2, a positive number if str1 should come after str2, and zero if they are equal.

const arr = ['apple', 'banana', 'pear', 'kiwi'];

arr.sort((a, b) => a.localeCompare(b, undefined, { numeric: true }));

console.log(arr); // ['kiwi', 'pear', 'apple', 'banana']

In this example, we create an array of fruits and use the sort() method with the localeCompare() method to sort the elements by length. We pass { numeric: true } as the third argument to the localeCompare() method to ensure that the sorting is done numerically rather than alphabetically.

Conclusion

Sorting an array by string length in JavaScript can be accomplished using several methods, including the sort() method with a custom comparator function, the map() method and the sort() method, and the localeCompare() method. Choose the method that best suits your needs and coding style.