In the world of JavaScript programming, there often comes a time when we need to convert string to array. Whether it’s breaking down a sentence into individual words or splitting a string of characters, you need to know how this as a developer. In this article, we will discuss various techniques on how to convert a string to an array in JavaScript.
What are Arrays in JavaScript?
Arrays are linear data structures that store homogenous data, i.e. same type of data. An array can contain all integers, all characters, or all strings as the elements. An array can not be a combination of integers and characters, or integers or strings.
Let us look at how to declare and use arrays in Javascript:
//declaring an integers array
let marks = [98, 75, 62, 82, 97, 53];
//declaring a characters array
let grades=['A', 'B', 'A', '0'];
//declaring a strings array
let favtutors=["John", "Joshua", "Alex", "Kate"];
//declaring a boolean array
let present=[true, false, false, true];
In the code above, we have made integers array marks containing all integers, a characters array grade consisting of all elements as characters, a strings array ‘favtutors’ consisting of all strings, and a boolean present array consisting of all boolean values.
What are Strings in JavaScript?
Strings in JavaScript represent a sequence of multiple characters. ‘C’ represents a single character and “Cat” represents a string. In JavaScript, we can declare a string in two ways. Let us look into each method.
We can declare a string in JavaScript by making a string literal using double quotes. The syntax and example for the same is given below.
//declaring a string literal let a="FavTutor" //printing the string console.log(a);
Output:
FavTutor
We can declare a string in JavaScript by creating a String object. An example of the same is given below.
//declaring a string using String Object let str=new String("FavTutor") //printing the string console.log(str);
Output:
[ String: ‘FavTutor’ ]
4 Methods to Convert String to Array
In this section, we will discuss various techniques on how to convert a string to an array in JavaScript.
1) Using the split() Method
It is the most commonly used approach to convert string to array in JavaScript. The split() method allows you to split a string into an array of substrings based on a specified delimiter. A delimiter is a character (or more than one character) such as a comma, a space, etc that separates two text strings.
The split() method is invoked on a string and takes a delimiter as an argument. It splits the string into an array of substrings at each occurrence of the delimiter. Let us take a look at the example below.
//declaring a string literal let str = "Hello FavTutor"; //using the split function let arr = str.split(","); //Printing the Array console.log(arr);
In the above example, we split the string str at every occurrence of the comma (“,”) and store the resulting substrings in the arr array.
Output:
[ ‘Hello’, ‘FavTutor’ ]
Let us take a look at another example.
//declaring a string literal let str = "Hello FavTutor"; //using the split function let arr = str.split(","); //Printing the Array console.log(arr);
Output:
[ ‘Hello FavTutor’ ]
As the output shows, the array contains only one element as there is no comma delimiter, hence the string components are not separated.
2) Using the Array.from() Method
One of the easiest methods to convert a string to an array in JavaScript is by using the Array.from() method. This method converts an iterable object or a string into an array. When applied to a string, it creates an array of individual characters.
Let us look at an example:
//declaring a string literal let str = "FavTutor"; //using the Array.from() function let arr = Array.from(str); //Printing the Array console.log(arr);
Output:
[ ‘F’, ‘a’, ‘v’. ‘T’, ‘u’, ‘t’, ‘o’, ‘r’ ]
In this example, we convert the string to an array using the Array.from() method. We have obtained the desired output.
3) Using the Spread Operator
Another method to convert string to array is by using the spread operator (…) in JavaScript. It expands the elements of an iterable object or a string into individual values. When applied to a string, it creates an array of individual characters.
Here is example to understand:
//declaring a string literal let str = "FavTutor"; //using the spread operator let arr = [...str]; //Printing the Array console.log(arr);
Output:
[ ‘F’, ‘a’, ‘v’, ‘T’, ‘u’, ‘t’, ‘o’, ‘r’ ]
In this example, we convert the string to an array using the spread operator (…). We have obtained the desired output.
4) Using the Object.assign() Operator
The Object.assign() method can also be utilized to convert a string to an array in JavaScript. This method copies the properties of one or more objects to a target object. When used with an empty array as the target object, it converts the string into an array of individual characters.
Let us take an example:
//declaring a string literal let str = "FavTutor"; //using the spread operator let arr = Object.assign([],str) //Printing the Array console.log(arr);
Output:
[ ‘F’, ‘a’, ‘v’, ‘T’, ‘u’, ‘t’, ‘o’, ‘r’ ]
In this example, we pass an empty array as the target object to the Object.assign() method along with the string str. We have obtained the desired output.
Conclusion
In this blog, we discussed how to convert string to array in JavaScript using the split(), the Array.from() function, the spread operator, and the Object.assign() method. You can check out this article to learn how to convert set to array in javascript.