Concatenating and Splitting Strings in ECMAScript 2015
The ECMAScript String Object – Part 3
ECMAScript 6
Foreword: In this part of the series I explain how to concatenate and split strings in ECMAScript.
By: Chrysanthus Date Published: 14 Jul 2016
Introduction
Concatenating Strings
Concatenating means joining. You can concatenate strings in two ways: if all the strings are literals, then use the + operator to join the strings; if the strings consist of only string objects or string objects and literals, then use the Strong Object Prototype cancat() method. The syntax to use the + operator is:
str = "text" + "text"+ - - -
Read and try the following code:
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<script type="text/ECMAScript">
str = "We are the world." + " We are the children." + " We are the ones.";
document.write(str);
</script>
</body>
</html>
The extra HTML code is to produce a web page. The output is:
We are the world. We are the children. We are the ones.
When concatenating strings, always remember that a space is a character and always make provision for the space where necessary.
You use the concat method when you are dealing with only string objects or a mixture of strings objects and literals. The syntax is:
stringObject.concat ( [ string1 [ , string2 [ , … ] ] ] )
<script type="text/ECMAScript">
strObj = new String();
str1 = "We are the world.";
str2 = new String(" We are the children.");
str3 = " We are the ones.";
str = strObj.concat(str1, str2, str3);
document.write(str);
</script>
The literal of the original string object here, is an empty string. However, concatenation has still taken place to return a string literal. The output is:
We are the world. We are the children. We are the ones.
If the literal of the original string object were not empty, its value would have preceded in the concatenation string.
You can still use a literal in place of the main string object. Read and try the following code:
<script type="text/ECMAScript">
str1 = new String(" We are the children.");
str2 = " We are the ones.";
str = "We are the world.".concat(str1, str2);
document.write(str);
</script>
If you have a string, which is a sentence, you might want to retrieve the individual words; in this situation, you would use the space as the separator, to separate the words. You can have a list of phrases. The phrases might be separated by a comma and a space, or a hyphen, or some other separator.
You split a string into substrings based on the separator. You use the split() function. The return value is an array, where each element is the different substring without the separator. The syntax is:
ident = stringObject.split(separator, limit)
ident is the identifier of the array returned. limit is optional. Assume that the split results in 10 substrings, and you wanted the first seven, then the limit value will be 7. The limit is a number for the first number of substrings you want. With the limit, the rest of the substrings are not sent to the array.
If separator is absent, the whole string is sent to the array as one element to have a one-element array. The separator is a string literal. The separator is not part of any array element value. Read and try the following code, where the separator is a comma followed by a space:
<script type="text/ECMAScript">
strObj = new String("John, Mary, Peter, Augustine, Angela, Susan, Martin, Grace, Paul, Simon");
arrNames = strObj.split(", ", 7);
for (i=0; i<arrNames.length; ++i)
{
document.write(arrNames[i]); document.write('<br>');
}
</script>
The output is:
John
Mary
Peter
Augustine
Angela
Susan
Martin
<script type="text/ECMAScript">
str = "John, Mary, Peter, Augustine, Angela, Susan, Martin, Grace, Paul, Simon";
arrNames = str.split(", ", 7);
for (i=0; i<arrNames.length; ++i)
{
document.write(arrNames[i]); document.write('<br>');
}
</script>
The output is the same as before.
That is it for this part of the series. We stop here and continue in the next part:
Chrys
Related Links
ECMAScript BasicsECMAScript Operators
Expressions in ECMAScript
Statements in ECMAScript
Custom Objects in ECMAScript
Functions in ECMAScript
ECMAScript Date Object
The ECMAScript String Object
ECMAScript String Regular Expressions
ECMAScript Template Literal
The ECMAScript Array
ECMAScript Sets and Maps
ECMAScript Number
Scopes in ECMAScript
Mastering the ECMAScript (JavaScript) eval Function
Sending Email with ECMAScript
ECMAScript Insecurities and Prevention
Advanced Course
Advanced ECMAScript Regular Expressions
Promise in ECMAScript 2015
Generator in ECMAScript 2015
ECMAScript Module
More Related Links
Node Mailsend
EMySQL API
Node.js Web Development Course
Major in Website Design
Low Level Programming - Writing ECMAScript Module
ECMAScript Course
BACK NEXT