FreeCodeCamp and JavaScript: The split() Method Part 2

So last time we covered what the split() method is, its parameters, and some basic examples.  Today, we’re going to look at some more complicated examples.

In the next example from MDN, we’re going to use a Regular Expression to do our splitting.  First we set up a string called “names” and then we print that string to the console.  Then we assign the Regular Expression to a string called “re”.  See what they did there?  Anyway, the expression does this:

\s – looks for a space
* – as many spaces as necessary
; – looks for a semicolon following the space(s)
\s – there may be spaces after the semicolon, too.

The forward slashes at the beginning and the end tell JavaScript that this is a Regular Exapression.  That semicolon at the end is NOT part of the expression, it just indicates the end of the statement.

Then we split the expression and print it to the console.

var names = ‘Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand ‘;
console.log(names);
var re = /\s*;\s*/;
var nameList = names.split(re);
console.log(nameList);

The output:

Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand
Harry Trump,Fred Barney,Helen Rigby,Bill Abel,Chris Hand

Note that all the spaces and semicolons are gone.

In the next example, we are not going to split the entire string.  We’re going to ask for the first three splits only, using the space character as the separator.

var myString = ‘Hello World. How are you doing?’;var splits = myString.split(‘ ‘, 3);
console.log(splits);

What we get back is:

Hello,World.,How

Note that the substring “World.” (element[1]) comes back with the period since that is NOT specified as a separator.

In our next example we’re going to use another Regular Expression:

\d – looks for a digit from 0 to 9

The paratheses on either side of the \d are called a “capturing group”.  This will return what you used as a separator

var myString = ‘Hello 1 word. Sentence number 2.’;var splits = myString.split(/(\d)/);
console.log(splits);

So, for our results we get back:

Hello ,1, word. Sentence number ,2,.

We get the split string, but we also get the separators – the digits we looked for with the Regular Expression – note that element[1] is 1, and element[4] is 2.  Note also that since we didn’t use the space character as the separator, element[3] is two words with a space between them.

In the final example, MDN gets really fancy and chains a bunch of methods together.  This was actually one of the FreeCodeCamp exercises from early on where we want to reverse a string.

var str = ‘asdfghjkl’;
var strReverse = str.split(”).reverse().join(”);
// ‘lkjhgfdsa’
// split() returns an array on which reverse() and join() can be applied

So, what happens is,we use the split() method first with an empty string – that’s why we have (”) up there.  Our result from just the split operation will be [a,s,d,f,g,h,j,k,l].  Then we reverse it and get [l,k,j,h,g,f,d,s,a].  Finally, we join the array and end up with ‘lkjhgfdsa’.

MDN helpfully notes that you can compare the initial string to the final string with the “===” operator to see if it was a palindrome, another FreeCodeCamp exercise.

And that’s it for the split() method!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s