6 Ways To Convert JavaScript String To Array

In this article, you will learn how to convert Javascript string to array in 6 different ways. We will see various examples of different cases of converting string to array.

Table Of Contents

1. Quick Solution
2. Using split() Method
3. Using Spread Operator
4. Using Array.from() Method
5. Using match() Method
6. Using Object.assign() Method
7. Using Object.keys() Method
8. Conclusion

Quick solution

For your quick answer, you can use the split() method in Javascript. The following example will show you how to use the split() method to convert string to array.

var str = "To be or not to be";

// split() method
var arr = str.split(" ");
console.log(arr);

Output

["To", "be", "or", "not", "to", "be"]

This will split your string into an array of words by splitting the string at the space. We will learn about this in detail later in this article.

You will occasionaly need to convert javascript string to array while programming. So it's better to know a few ways to convert string to array in Javascript.

1. Using split() Method

The split() method is the most commonly used method to convert string to array. It is a powerful method for converting a string to an array.

It splits the string into an array of substrings. The split is made at a character or a set of characters specified in the parameter.

For example, if you want to split a string at the space then pass " " as the parameter.

var str = "To be or not to be";

// split at space
var arr = str.split(" ");
console.log(arr);

Output

["To", "be", "or", "not", "to", "be"]

You can see that the string is split at every space and the result is an array of words.

The string can also be split at each character if you pass an empty string ("") as the parameter.

var str = "To be or not to be";

// split at each character
var arr = str.split("");
console.log(arr);

Output

["T","o"," ","b","e"," ","o","r"," ","n","o","t"," ","t","o"," ","b","e"]

2. Using Spread Operator

The spread operator is a JavaScript feature that allows an iterable to be expanded in places where zero or more arguments (for function calls) are expected.

The spread operator is written as a ... before the iterable.

To convert string to array spread the string using the spread operator in a square bracket. This way the string will be converted to an array of characters.

var str = "Hello World";

// spread operator
var arr = [...str];
console.log(arr);

Output

["H", "e", "l", "l", "o", " ", "W", "o", "r", "l", "d"]

This will convert string to array by spreading the string.

3. Using Array.from()

The Array.from() method is used to convert an array-like object into an array. Array like objects are objects that have a length property and support indexed access to their elements.

A string is an array-like object. It has a length property and supports indexed access to its characters. So you can use Array.from() method to convert string to array.

var str = "Hello World";

// Array.from() method
var arr = Array.from(str);
console.log(arr);

Output

["H", "e", "l", "l", "o", " ", "W", "o", "r", "l", "d"]

This will break the string into array of characters.

4. Using match()

Another method that can be used to convert string to array is the match() method. It is used to find a match between a regular expression and a string.

The match() method returns an array of strings that match the regular expression.

We can use it and select all the words from the string by passing /\w+/g as the parameter.

var str = "To be or not to be";

// using match method
var arr = str.match(/\w+/g);
console.log(arr);

Output

["To", "be", "or", "not", "to", "be"]

This will select all the words from the string and return them as an array.

We also select each and every character from the string by passing /\w/g as the parameter. Earlier we used /\w+/g (extra plus symbol).

var str = "To be or not to be";

// select all characters
// not spaces
var arr = str.match(/\w/g);
console.log(arr);

Output

["T", "o", "b", "e", "o", "r", "n", "t", "o", "b", "e"]

This will select all the characters from the string and return it as an array.

One last thing you can try is selecting each and every part of the string by passing /./g as the parameter.

var str = "To be or not to be";

// select all parts
var arr = str.match(/./g);
console.log(arr);

Output

["T", "o", " ", "b", "e", " ", "o", "r", " ", "n", "o", "t", " ", "t", "o", " ", "b", "e"]

This will select all the parts of the string including spaces and return it as an array.

5. Using Object.assign()

The Object.assign() method is used to copy the values of all enumerable own properties from one or more source objects to a target object.

var str = "Hello World";

// use Object.assign() to 
// copy string properties to []
var arr = Object.assign([], str);
console.log(arr);

Output

["H", "e", "l", "l", "o", " ", "W", "o", "r", "l", "d"]

6. Using map and Object.keys()

Using the Object.keys() method we can get the keys of an object. In terms of strings, the keys are the index of the characters.

We can use the map() method to get the values of the keys which are the characters of the string.

var str = "Hello World";

// use Object.keys() to
// get the keys of the string
var keys = Object.keys(str);

// use map() to get the values of the keys
var arr = keys.map((key) => str[key]);
console.log(arr);

Output

["H", "e", "l", "l", "o", " ", "W", "o", "r", "l", "d"]

Conclusion

We have seen 6 ways to convert Javascript string to array. The most robust way is using the split() method.

The other methods are for our knowledge and understanding purpose. We can use other methods depending on different use cases.