JavaScript Strings

A string is a sequence of letters, numbers, special characters and arithmetic values or combination of all. Strings can be created by enclosing the string literal (i.e. string characters) either within single quotes (') or double quotes ("), as shown in the example below:

Example of Code

<script>
    // Creating variables
    var myString = 'Hello World!'; // Single quoted string
    var myString = "Hello World!"; // Double quoted string
    // Printing variable values
    document.write(myString + "<br>");
    document.write(myString);
</script>

Output

JavaScript Escape Sequences

Escape sequences are also useful for situations where you want to use characters that can't be typed using a keyboard. Here are some other most commonly used escape sequences.

\n is replaced by the newline character
\t is replaced by the tab character
\r is replaced by the carriage-return character
\b is replaced by the backspace character
\\ is replaced by a single backslash (\)

Getting the Length of a String

The length property returns the length of the string, which is the number of characters contained in the string. This includes the number of special characters as well, such as \t or \n.

Example of Code

<script>
    var str1 = "This is a paragraph of text.";
    document.write(str1.length + "<br>"); // Prints 28   
    var str2 = "This is a \n paragraph of text.";
    document.write(str2.length); // Prints 30, because \n is only one character
</script>

Output

Finding a String Inside Another String

You can use the indexOf() method to find a substring or string within another string. This method returns the index or position of the first occurrence of a specified string within a string.

Example of Code

<script>
    var str = "If the facts don't fit the theory, change the facts.";
    var pos = str.indexOf("facts");
    document.write(pos); // 0utputs: 7
</script>

Output

Searching for a Pattern Inside a String

You can use the search() method to search a particular piece of text or pattern inside a string.

Like indexOf() method the search() method also returns the index of the first match, and returns -1 if no matches were found, but unlike indexOf() method this method can also take a regular expression as its argument to provide advanced search capabilities.

Example of Code

<script>
    var str = "Color red looks brighter than color blue.";
    // Case sensitive search
    var pos1 = str.search("color");
    document.write(pos1 + "<br>"); // 0utputs: 30
    // Case insensitive search using regexp
    var pos2 = str.search(/color/i);
    document.write(pos2); // 0utputs: 0
</script>

Output

Replacing the Contents of a String

You can use the replace() method to replace part of a string with another string. This method takes two parameters a regular expression to match or substring to be replaced and a replacement string, like str.replace(regexp|substr, newSubstr).

This replace() method returns a new string, it doesn't affect the original string that will remain unchanged. The following example will show you how it works:

Example of Code

<script>
    var str = "Color red looks brighter than color blue.";
    var result = str.replace("color", "paint");
    document.write(result); // 0utputs: Color red looks brighter than paint blue.
</script>

Output

Converting a String to Uppercase or Lowercase

You can use the toUpperCase() method to convert a string to uppercase, like this:

Example of Code

<script>
    var str = "Hello World!";
    var result = str.toUpperCase();
    document.write(result); // Prints: HELLO WORLD!
</script>

Output

Concatenating Two or More Strings

You can concatenate or combine two or more strings using the + and += assignment operators.

Example of Code

<script>
    var hello = "Hello";
    var world = "World";
    var greet = hello + " " + world;
    document.write(greet + "<br>"); // Prints: Hello World
    var wish  = "Happy";
        wish += " New Year";
    document.write(wish); // Prints: Happy New Year
</script>

Output

Accessing Individual Characters from a String

You can use the charAt() method to access individual character from a string, like str.charAt(index). The index specified should be an integer between 0 and str.length - 1. If no index is provided the first character in the string is returned, since the default is 0.

Example of Code

<script>
    var str = "Hello World!";
    document.write(str.charAt() + "<br>");  // Prints: H
    document.write(str.charAt(6) + "<br>"); // Prints: W
    document.write(str.charAt(30) + "<br>"); // Prints nothing
    document.write(str.charAt(str.length - 1)); // Prints: !
</script>

Output

Splitting a String into an Array

The split() method can be used to splits a string into an array of strings, using the syntax str.split(separator, limit). The seperator argument specifies the string at which each split should occur, whereas the limit arguments specifies the maximum length of the array.

If separator argument is omitted or not found in the specified string, the entire string is assigned to the first element of the array. The following example shows how it works:

Example of Code

<script>
    var fruitsStr = "Apple, Banana, Mango, Orange, Papaya";
    var fruitsArr = fruitsStr.split(", ");
    document.write(fruitsArr[0] + "<br>"); // Prints: Apple
    document.write(fruitsArr[2] + "<br>"); // Prints: Mango
    document.write(fruitsArr[fruitsArr.length - 1]); // Prints: Papaya
    document.write("<hr>"); 
    // Loop through all the elements of the fruits array 
    for(var i in fruitsArr) {  
        document.write("<p>" + fruitsArr[i] + "</p>");
    }
</script>

Output