JavaScript String Methods

In the previous chapter, we learned the basics of strings, let's take another step forward and start considering some useful operations that can be performed on strings with built-in methods and properties.

Primitive values (such as 'New Delhi') cannot have properties or methods (because they are not objects).

However, in JavaScript, methods and properties can also be used for primitive values because JavaScript treats primitive values as objects when executing methods and properties.

Find the length of the string

lengthThe property returns the length of the string. For an empty string, the length is 0.

var str = 'Java Script';
str.length;//　return　11

Note:Spaces are also considered characters:

concat() method

concat()The method is used to concatenate two or more strings.

var a = 'w3codebox';
var b = 'COM';
var c = a.concat(b);

Note:All string methods return a new value. They do not change the original variable.

Convert to uppercase or lowercase

toUpperCase()The method returns the value of the call string converted to uppercase.

var　str1　= "oldtoolbag.com";
var　str2　=　str1.toUpperCase();

toLowerCase()The method returns the value of the call string converted to lowercase.

var　str1　= "oldtoolbag.com";
var　str2　=　str1.toLowerCase();

Find a substring in the string

indexOf()The method returns the position (index) of the first occurrence of the specified value in the string.

var str = 'Air Pollution is the introduction of chemicals to the atmosphere';
str.indexOf('Pollution');//　4

Note:The index of the first character is 0, the index of the second character is1, and so on.

lastIndexOf()The method returns the position (index) of the last occurrence of the specified value in the string.

var str = 'Hello world, I repeat Hello world';
str.lastIndexOf('Hello');//　22

indexOf()islastIndexOf()Return-1If the value is not found:

var str = "oldtoolbag.com";
str.indexOf("fish");
str.lastIndexOf("beer");

indexOf()islastIndexOf()both accept the second parameter as the starting position for the search:

var str = 'HELLO WORLD HELLO';
str.indexOf('L',　6);

Search for a substring in the string

search()The method performs a search to find a match between the regular expression and the string.

If a match is found, it will return the position of the first match, and if no match is found, it will return-1:

var str = 'The question is to be, or not to be, that is to be.';
var pos = str.search('to be');

The following example demonstrates the use of a regular expression with the i flag (case-insensitive):

var str = 'The question is TO BE, or not to be, that is to be.';
var pos = str.search(/to be/i);

In the later part of this tutorial, you will learn more about regular expressions.

Convert a string to an array

split()The method splits the string into an array of substrings and then returns the new array.

We will usesplit()The method splits the array by the space character represented by the array " ".

var str = 'can you help me?';
var arr = str.split("　");

Now we arearrA new array has been added to the variable, and we can access each element using an index number:

arr[0];　　　//　Air
arr[2　　　//　is

In the following example, we will use "i" as a delimiter:

var str = 'can you help me?';
var arr = str.split("i");

If an empty string ("") is used as a delimiter, the string will be converted to a character array:

var str = 'can you help me?';
var arr = str.split("");

By splitting the string, you can determine how many words are in a sentence.

Remove whitespace from both ends of the string

trim()The method removes spaces from both ends of the string but cannot remove spaces between strings, which can be tab characters or spaces.

var greeting = "         Hello world!         ";
greeting.trim();

This method is to execute the deletion of extra spaces, a common simple method.

Replace string value

replace()The method returns a new string that has part or all of the pattern matches and is replaced by the replacement.

The first parameter will be the value to be found, and the second parameter will be the value to replace it with.

var　str1　= 'The question is to be, or not to be, that is to be.';
var　str2　=　str1.replace('to be', 'ZZZ');

By default, the replace() method only replaces the first match.

To replace all occurrences, use a regular expression with the g flag (global search):

var　str1　= 'The question is to be, or not to be, that is to be.';
var　str2　=　str1.replace(/to be/g, 'ZZZ');

To replace case-insensitive code, use a regular expression with the i flag (ignore case):

var　str1　= 'The question is TO BE, or not to be, that is to be.';
var　str2　=　str1.replace(/to be/gi, 'ZZZ');

In the later part of this tutorial, you will learn more about regular expressions.

Extract part of the string

There are three methods to extract a part of the string:

• slice(start, end)

• substring(start, end)

• substr(start, length)

slice() method

slice()method extracts a part of the string and returns it as a new string without modifying the original string.

This method has two parameters:start index (start)andend index (end)excludingEnd).

This example starts from index3to index9(10-1)Extract a part of the string:

var　str　=　'Hello　Javascript　oldtoolbag.com';
var ext = str.slice(3,　10);

Note:The index of the first character is 0, the index of the second character is1, and so on.

Select from the end of the string using negative index:

var　str　=　'Hello　Javascript　oldtoolbag.com';
var ext = str.slice(-8,　-3);

If the second parameter is omitted, this method will cut out the rest of the string:

var　str　=　'Hello　Javascript　oldtoolbag.com';
var ext = str.slice(3);

The following example uses slice() to extract only the last character:

var　str　=　'Hello　Javascript　oldtoolbag.com';
var ext = str.slice(-1);

substring() method

substring()method is similar toslice()method.

The difference is thatsubstring()does not accept negative index values.

var　str1　can you help me?;
var　str2　=　str1.substring(4,　10);

If the second parameter is omitted, thensubstring()method will extract the rest of the string:

var　str1　can you help me?;
var　str2　=　str1.substring(7);

substr() method

substr()method is similar toslice()method.

The difference is that the second parameter specifies the part to be extracted by the method.length.

The following examples are used forsubstr()from index4extract characters, length of18:

var　str1　can you help me?;
var　str2　=　str1.substr(4,　18);

If the second parameter is omitted, thensubstr()The method will extract the rest of the string:

var　str1　can you help me?;
var　str2　=　str1.substr(7);

To extract characters from the end of a string, use negative index values:

var　str1　Hello JavaScript3codebox.com';
var　str2　=　str1.substr(-6,　3);　　　//　tor

Access String Characters

There are three methods to access string characters:

• charAt(index)

• charCodeAt(index)

• Bracket Notation[]

charAt() Method

charAt()method returns the character at the specified index in the string.

var　str　=　'Hello　Javascript　oldtoolbag.com';
str.charAt(1);//　Return　a

The following example returns the last character of the string:

var　str　=　'Hello　Javascript　oldtoolbag.com';
str.charAt(str.length-1);

charCodeAt() Method

charCodeAt()method returns an integer between 0 and65535The integer between the UTF-16Code unit.

var　str　=　'Hello　Javascript　oldtoolbag.com';
str.charCodeAt(1);//　Return　97

Bracket Notation[]

You can use bracket notation to return any character in the string[].

In the brackets, include the index number of the character to be returned.

var　str　=　'Hello　Javascript　oldtoolbag.com';
str[0];//　Return　P
1//　Return　a

Complete String Reference

For a complete reference to properties and methods, please visit ourJavaScript String Reference.

The reference section includes descriptions and examples of all string properties and methods.