JavaScript strings are used for storing and manipulating a sequence of characters.
You can convert a string into a character array in JavaScript using the string.split() method.
Basic Example
const str = “owl”;
const strArray = str.split('');
console.log(strArray);Output
['o', 'w', 'l']This tutorial teaches you the different methods to get a character array from a String in JavaScript using different methods and when it is appropriate to use them.
Table of Contents
Convert a String into a Character Array Using String Split
The string split() method splits the String and returns the character array.
It divides the String into an ordered list of substrings, puts them into an array and returns the array.
The split() method also accesses the regex pattern to split the String based on the pattern.
Use this when you want to split a string based on a separator or based on a regular expression.
Code
The following code demonstrates how the String is split and converted into a character array using the split() method.
Regex or a separator is not passed to the separator. Hence, each character in the String is split into a character array.
const str = “owl”;
const strArray = str.split('');
console.log(strArray);Output
['o', 'w', 'l']Split String into a Character Array Using Split and Separator
This section demonstrates how to use a separator to split a String into a character array.
The separator is passed as a parameter to the split() method.
Code
const str = "js-owl";
const strArray = str.split("-");
console.log(strArray);Output
The String is split based on the separator, and an array is formed with each word.
[‘js’, ‘owl’]Convert a String into a Character Array Using Spread Operator
The Spread operator [...] unpacks the String into a character array.
Use this method when you want to convert a String to an array without using the split() method or a specific separator.
Code
The following code demonstrates how to use the spread operator to split the String into a character array.
const str = "owl";
const strArray = [...str];
console.log(strArray);Output
The String is split into a character array using the spread operator.
['o', 'w', 'l']Convert a String into a Character Array Using Array From() method
The Array.from() is a static method used to create a new, shallow copied array from an array or any other iterable like a String.
Parameters
arrayLike– An array-like object to convert into an array.mapFn– Optional – Map function to call on every element of the arraythisarg– Optional – value to use asthiswhen executing the mapFn
Return Value
An array – Created from the passed String.
Use this method when you want to convert a String into an array and apply a function to each element of the array. For example, convert each element of the array into an upper case.
Code
The following code demonstrates how to use the Array.from() static method to convert a String into a character array and apply a map() function to each element in the array.
const str = "owl";
const strArray = Array.from(str, (element) => element.toUpperCase());
console.log(strArray);Output
['O', 'W', 'L']Convert a String into a Character ArrayUsing Object Assign() method
The object.assign() method copies all the enumerable items from one object from the source to a target object.
Properties in the target are replaced if the source Strings have the same keys.
For example, the first character in the first source string is replaced by the first character in the second source string.
Parameters
Target Object– An array-like object to which the string must be copied..sources– Source strings that need to be converted into an array
Return Value
- An array that contains objects from the String
Use this method when you want to convert one or more String objects into a single character array.
Code
The following code converts the Strings str1 and str2 into a single character array.
The str2 contains two spaces initially. Because, during the copy of the str1, those spaces can be replaced using the characters j and s.
const str1 = "js";
const str2 = " owl";
const strArray = Object.assign([], str2, str1);
console.log(strArray);Output
['j', 's', 'o', 'w', 'l']