# How to convert a string to an array in JavaScript

By Atta Ur Rehman Shah (https://attacomsian.com/about). Published May 15, 2020, updated Aug 12, 2022. Topics: JavaScript.
Canonical URL: https://attacomsian.com/blog/javascript-convert-string-to-array

> A quick article to learn about 4 different ways to convert a string into an array in vanilla JavaScript.

There are four ways to convert a string to an [array](https://attacomsian.com/blog/javascript-arrays) in JavaScript:

1. The `String.split()` method uses a separator as a delimiter to split the string and returns an array.
2.  The `Array.from()` method accepts a string as input and returns a character array.
3.  Spread operator (`...`) from ES6 converts the string into a characters array.
4.  The `Object.assign()` method also takes the string as input and returns a character array.

> **Note:** If you need to convert an array to a string in JavaScript, read [this article](https://attacomsian.com/blog/javascript-convert-array-to-string).

## `String.split()` Method

The [`String.split()`](https://attacomsian.com/blog/javascript-string-split) method converts a string into an array of substrings using a separator and returns a new array. It splits the string every time it matches against the given separator. 

You can also optionally pass in an integer as a second parameter to specify the number of splits.

For a **comma-separated** string, you can convert it into an array like this:

```javascript
const str = 'Apple,Orange,Mango,Cherry';

const fruits = str.split(',');

console.log(fruits);

// ['Apple', 'Orange', 'Mango', 'Cherry']
```

You can split the string by almost **anything**: dashes, underscores, or even empty spaces:

```javascript
const str = 'Apple Orange Mango Cherry';

const fruits = str.split(' ');
```

If an **empty string** (`""`) is used as a separator, the string is split between each character:

```javascript
const str = 'apple';

const chars = str.split('');

console.log(chars);

// ['a', 'p', 'p', 'l', 'e']
```

To **limit the number of items** in the array, you can pass in a second parameter to specify the number of splits. For example, let us limit our fruits list to only include the first two items:

```javascript
const str = 'Apple,Orange,Mango,Cherry';

const fruits = str.split(',', 2);

console.log(fruits);

// ['Apple', 'Orange']
```

The `String.split()` method works in all modern browsers and back to at least IE 6.

## `Array.from()` Method

The [Array.from()](https://attacomsian.com/blog/javascript-array-from) method creates a new `Array` instance from a given array or iterable object. If you pass in a string to `Array.from()`, it will be converted to a characters array:

```javascript
const str = '?????';

const fruits = Array.from(str);

console.log(fruits);

// ['?', '?', '?', '?', '?']
```

The `Array.from()` is part of ES6 and only works in modern browsers. However, you can use a [polyfill](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from#Polyfill) to push the browser support way back to IE6.

## Spread Operator

A spread operator (`...`) is another modern way to convert a string into an array in ES6:

```javascript
const str = '?????';

const fruits = [...str];

console.log(fruits);

// ['?', '?', '?', '?', '?']
```

## `Object.assign()` Method

You can also use the `Object.assign()` method to convert a string into a characters array, as shown below:

```javascript
const str = 'JavaScript';

const chars = Object.assign([], str);

console.log(chars);

// ['J', 'a', 'v', 'a', 'S', 'c', 'r', 'i', 'p', 't']
```

Be careful while using `Object.assign()` to split a string into an array. This method copies "all enumerable own properties". This method means that it will copy all string properties to the new array.

## Strings with Emojis

If the string you are trying to split contains emojis, then `String.split()` and `Object.assign()` might not be the best choice. Let us look at the following example:

```javascript
const str = 'Pizza 🍕';

const chars = str.split('');

console.log(chars);

// [ 'P', 'i', 'z', 'z', 'a', ' ', '�', '�' ]
```

As you can see above, the `🍕` emoji is converted into two unknown characters. This is because the emojis are unicode characters made up of two characters. The `String.split()` method attempted to split up the emoji into individual characters.

You should always use the `Array.from()` or a spread operator for strings containing emojis:

```javascript
const str = 'Pizza 🍕';

const chars = [...str];

console.log(chars);

// [ 'P', 'i', 'z', 'z', 'a', ' ', '?' ]
```

## Conclusion

In this article, we looked at 4 different ways to convert a string into an array in JavaScript. 

If all you want to do is convert a string into an array of individual characters, you can use any of the above methods. All of them work perfectly fine and produce the same results.

If you want to split a string by a specific character like a comma, dash, empty space, etc., use the `String.split()` method.

For strings containing emojis, always use the `Array.from()` method or the spread operator.

Read [this article](https://attacomsian.com/blog/javascript-arrays) to learn more about JavaScript arrays and how to store multiple values in a single variable.