JS String

In this tutorial we will learn about JavaScript string.

What is a string?

A string is a sequence of characters enclosed in single or double quotes.

Example: "Apple" and 'Orange' are string.

String are case sensitive. So, "Hello" and "hello" are different.

console.log("Hello" === "hello");	//this will print false

How to create string?

There are two way to create a string in JavaScript. We can create string using String object and string literal.

Creating string using String object

In this case we instantiate the String object to create a string.

In the following example we are creating a string "Hello World".

var str = new String("Hello World");

console.log(typeof str);	//this will print object

Creating string using String literal

In this case we assign a string value to a variable.

In the following example we are creating a string using string literal.

var str = "Hello World";

console.log(typeof str);	//this will print string

Difference between String object and String literal

A string created using string literal (a regular text) hold the value of the string itself.

A string created by instantiating the String object is holding the value in an object.

So, we can easily compare string literal. But we can't compare value of String object using == and === comparison operator.

var str1 = "Apple";
var str2 = "Apple";

console.log("str1 == str2 : " + (str1 == str2));
console.log("str1 === str2 : " + (str1 === str2));

Output

str1 == str2 : true
str1 === str2 : true

So, in the above code we can see that we can easily compare the value of the string variables using == and === comparison operators.

var str1 = new String("Apple");
var str2 = new String("Apple");

console.log("str1 == str2 : " + (str1 == str2));
console.log("str1 === str2 : " + (str1 === str2));

Output

str1 == str2 : false
str1 === str2 : false

So, in the above code we can see that even though str1 and str2 are both having the same value but we can't compare them directly using == and === comparison operators.

A string literal is able to use methods of a String object. This is possible because JavaScript converts a string literal to a String object when using the methods. Once the execution of the method is over it is converted back to a string literal.

How to find the number of characters in a string?

We use the length property to find the number of characters in a string.

In the following example we are printing the number of characters in a string.

var str1 = "Hello World";
var str2 = new String("Hello World");

console.log(str1.length);	//this will print 11
console.log(str2.length);	//this will print 11

String methods

charAt( )

We use the charAt( ) method to get character at a given position in a string.

Characters of a string starts from index 0. So, the first character is at index 0, the second character is at index 1 and the last character of the string is at index (length - 1) where, length is the number of characters in the string.

In the following example we are printing out characters of a string.

var str = "ABC";

var len = str.length;

for (var i = 0; i < len; i++) {
	console.log(str.charAt(i));
}

The above code will print all the characters in the string.

charCodeAt( )

We use the charCodeAt( ) method to get character code of a character at a given position in a string.

Character code is a numeric code that can be substituted for characters in HTML.
Click here for HTML entities.

var str = "ABC";

var len = str.length;

for (var i = 0; i < len; i++) {
	console.log(str.charCodeAt(i));
}

Output

65
66
67

The above code is printing character code of all the characters in the string.

concat( )

We use the concat( ) method to concatenate strings together to get a new string.

var str1 = "Hello";
var str2 = " ";
var str3 = "World";

var final_str = str1.concat(str2, str3);

console.log(final_str);

Output

Hello World

fromCharCode( )

We use the fromCharCode( ) method to create string from character code.

var charCode = 65;
console.log(String.fromCharCode(charCode));

Output

A

indexOf( )

We use the indexOf( ) method to get index of the first occurrence of a character or string. If not found this method will return -1.

var str = "Hello World";

var search = "lo";

console.log("IndexOf " + search + " in " + str + " = " + str.indexOf(search));

Output

IndexOf lo in Hello World = 3

lastIndexOf( )

We use the lastIndexOf( ) method to get greatest index of the occurrence of a character or string. If not found this method will return -1.

var str = "Hello World";

var search = "o";

console.log("LastIndexOf " + search + " in " + str + " = " + str.lastIndexOf(search));

Output

LastIndexOf o in Hello World = 7

slice( )

We use the slice( ) method to get a portion from a string.

Syntax

str.slice(start, stop);

str is the string on which slice is performed. start is the starting index from where we will start the slicing. stop is one index greater than the index till we want to slice.

var str = "apple";

console.log("Before slice");
console.log(str);

var sliced_str = str.slice(2, 4);

console.log("After slice");
console.log(str);

console.log("Sliced string");
console.log(sliced_str);

Output

Before slice
apple
After slice
apple
Sliced string
pl

In the above code we have a string str. We are pulling out a portion of the string using slice method. The start index is set to 2. The end index is 4. So, character at index 2 and (4-1) i.e., 3 are pulled out.

split( )

We use the split( ) method to convert a string into an array. We use a separator characters to split the string.

In the following example we have a string and we are splitting it into an array of words using space as the separator character.

var str = "This is a sample string";
var strArr = str.split(" ");

console.log("String");
console.log(str);

console.log("Array");
console.log(arr);

Output

String
This is a sample string
Array
["This", "is", "a", "sample", "string"]

substring( )

We use the substring( ) method to get a portion of a string.

Syntax

str.substring(start, stop);

str is the string we want to work on. start is the starting index. stop is one index greater than the position where we will stop.

var str = "This is a sample string";
var substring_str = str.substring(10, 16);

console.log("String");
console.log(str);

console.log("Substring");
console.log(substring_str);

Output

String
This is a sample string
Substring
sample

In the above code we have a string str. We are taking a substring from start index 10 and till (16-1) i.e., index 15.

toString( )

We use the toString( ) method to get the string literal value for a String object.

var strObj = new String("This is a sample string");
var str = strObj.toString();
console.log(str);

Output

This is a sample string

toLowerCase( )

We use the toLowerCase( ) method to get lowercase value of a string.

var str = "HELLO WORLD";
var str_lower = str.toLowerCase();
console.log(str);
console.log(str_lower);

Output

HELLO WORLD
hello world

toUpperCase( )

We use the toUpperCase( ) method to get uppercase value of a string.

var str = "hello world";
var str_upper = str.toUpperCase();
console.log(str);
console.log(str_upper);

Output

hello world
HELLO WORLD