Working with String objects in JavaScript is essential to understand how this programming language works. More relevant is understanding how to work with strings, loop through them, and, even more importantly, split them.

In this tutorial, we'll pay attention to JavaScript's split() method, the name of which essentially speaks for itself. This method is used to split strings into a few substrings, making it easier to manipulate characters.

Syntax, parameters, return values

You should use this statement to split a single string into a few substrings. Let's start learning this method by getting acquainted with its syntax:

string.split(separator, limit)

While the method is easy to learn, you should dive deeper and understand how the mentioned two parameters work. Both separator and limit are optional parameters for the string split method.

The former represents a character, which will be used for splitting, while the latter represents an integer that sets a limit for several splits. Speaking of the return value, one should remember that this method returns an array, which, in turn, contains the split values.

Note that the split() method also implies various functionality. In particular, this method cannot change the characters within the original string, alongside returning a new array as an output.

Splitting the strings into words

Let's start with the basics of the split() method. Just insert the following lines of code into your compiler:

let str = 'These three words';
let substrings = str.split(' ');
 
console.log(substrings);

Alright, we assign that a string has a property of words, which are These three words. Then, we set the substrings, followed by using an str.split() method. In the console, your output will look like this:

[ 'These', 'three', 'words' ]

Please note that this example works with three words. Accordingly, they are split into substrings, each consisting of a single word, such as 'these,' 'three,' and 'words.'

Regular expression

What about a complete sentence? The example we provide illustrates how the split() method can split sentences in a paragraph to separate sentences. We'll also complicate this task to show you that you can manipulate more than just words within a string. Take a look:

let paragraph = 'Alright! One-word sentences are still sentences. Right?';
let sentences = paragraph.split(/[!,?,.]/);
console.log(sentences);

We'd split sentences in a paragraph into separate sentences as we've agreed. However, the return will surely amaze you because we specify the split with punctuation signs. If you run this code example through a compiler, you'll see that the output will be:

[
  'Alright',
  '!',
  ' One-word sentences are still sentences',
  '.',
  ' Right',
  '?',
  ''
]

We essentially did a split with this example, which placed all punctuation marks in the paragraph into curved brackets. Because the split() method considers everything placed into these brackets, we differentiated all punctuation marks, such as ! and ?.

While the result might seem a bit wanky, this is what we requested in the initial code, serving as an example of what the split() method considers when breaking a string.

String limited number return

It might also happen that you assign parameters to a string in the form of words or sentences. In this case, you always have a chance to break a string and get an output of a particular number of substrings. In other words, it's possible to get a return of just a few words of a sentence. Take a look:

let str = 'We just write seven words here, alright?';
let substrings = str.split(' ',5);
 
console.log(substrings);

We assign that a string equals a sentence: "We just write seven words here, alright?". What will we do next? We include the split() method, simultaneously indicating the number of substrings to 5. As you've probably understood, the output will be limited just to five words, which are essentially five substrings:

[ 'We', 'just', 'write', 'seven', 'words' ]

We separate a sentence consisting of seven words, set a hard limit of showing just five substrings and separate each of these five elements in a sequence. The great news is that this example is representative and can be used to work with more significant bulks of data within strings.

Replacing characters in a string

If you're curious enough, you can also expand how you usually use the split() method. In this case, our tutorial will show you how to replace characters within one string. Before dwelling upon all the technical nuances, review this code first:

let code = 'Java Script';
let subs = code.split(' ');
console.log(subs);
 
let joined = subs.join('-');
console.log(joined);

In this case, we consider the code has two words: Java and Script, which are separate using a space. We split the code using the splitter, returning the good-old array, which looks like this:

[ 'Java', 'Script' ]

However, we further introduce the array method called join(). It allows returning a string using the predefined character, which is -. Then, the elements are joined using a character, which is passed as a parameter. As a result, the output of a second case looks like this:

Java-Script