IT SPRING EDUTECH

A complete web solution

Introduction to the JavaScript strings

JavaScript strings are primitive values. JavaScript strings are also

immutable. It means that if you process a string, you will always get a
new string. The original string doesn’t change.

To create literal strings in JavaScript, you use either single quotes or

double quotes like this:

let str = 'Hi';

let greeting = "Hello";
Code language: JavaScript (javascript)

ES6 introduced template literals that allow you to define a string

backtick (`) characters:

let name = 'John';

let message = `Hello ${name}`;

console.log(message);
Code language: JavaScript (javascript)

Output:

Hello John
Code language: JavaScript (javascript)

The string message evaluates the name variable and returns the result
string.
Escaping special characters

To escape special characters, you use the backslash \ character. For

example:

 Windows line break: '\r\n'

 Unix line break: '\n'
 Tab: '\t'
 Backslash '\'

The following example uses the backslash character to escape the

single quote character in a string:

let str = 'I\'m a string!';

Code language: JavaScript (javascript)

Getting the length of the string

The length property returns the length of a string:

let str = "Good Morning!";

console.log(str.length); // 13
Code language: JavaScript (javascript)

Char[]={1 2 3 5 3 6 5 4 6 4 5 };

Accessing characters

To access the characters in a string, you use the array-like [] notation

with the zero-based index.

The following example returns the first character of a string with the
index zero:

let str = "Hello";

console.log(str[0]); // "H"
Code language: JavaScript (javascript)

To access the last character of the string, you use the length - 1 index:
let str = "Hello";
console.log(str[str.length -1]); // "o"
Code language: JavaScript (javascript)

Concatenating strings via + operator

To concatenate two or more strings, you use the + operator:

let name = 'John';

let str = 'Hello ' + name;

console.log(str); // "Hello John"

Code language: JavaScript (javascript)

If you want to assemble a string piece by piece, you can use

the += operator:

let className = 'btn';

className += ' btn-primary'
className += ' none';

console.log(className);
Code language: JavaScript (javascript)

Output:

btn btn-primary none

Code language: JavaScript (javascript)

Converting values to string

To convert a non-string value to a string, you use one of the following:

 String(n);
 ”+n
 n.toString()

Note that the toString() method doesn’t work for undefined and null.

When you convert a string to a boolean, you cannot convert it back via
the Boolean():
let status = false;
let str = status.toString(); // "false"
let back = Boolean(str); // true
Code language: JavaScript (javascript)

In this example:

 First, the status is a boolean variable.

 Then, the toString() returns the string version of the status variable, which
is false.
 Finally, the Boolean() converts the "false" string back to the Boolean that
results in true because "false" is a non-empty string.

Note that only string for which the Boolean() returns false, is the empty
string (”);

Comparing strings

To compare two strings, you use the operator >, >=, <, <=,
and == operators.

These operators compare strings based on the numeric values of

JavaScript characters. In other words, it may return the string order
that is different from the one used in dictionaries.

let result = 'a' < 'b';

console.log(result); // true
Code language: JavaScript (javascript)

However:

let result = 'a' < 'B';

console.log(result); // false
Code language: JavaScript (javascript)

Summary

 JavaScript strings are primitive values and immutable.

 Literal strings are delimited by single quotes ('), double quotes ("), or
backticks (`)
  The length property returns the length of the string.
 Use the >, >=, <, <=, == operators to compare two strings.

Introduction to JavaScript String type

The String type is object wrapper of the string primitive type and can be
created by using the String constructor as follows:

let str = new String('JavaScript String Type');

Code language: JavaScript (javascript)

The String type has a property named length that specifies the number of
characters in the string.

console.log(str.length); // 22
Code language: JavaScript (javascript)

In this example, the value of the length property is 22 that also is the
number of characters in the string 'JavaScript String Type'.

To get the primitive string value, you use one of the following
methods of the string object: valueOf(), toString(), and toLocaleString().

console.log(str.valueOf());
console.log(str.toString());
console.log(str.toLocaleString());
Code language: CSS (css)

To access an individual character in a string, you use square bracket

notation [] with a numeric index. The index of the first character is zero
as shown in this example:

console.log(str[0]); // J
Code language: JavaScript (javascript)

The square bracket notation was introduced since ES5. Prior to ES5,
you use the charAt() method, which is more verbose:

console.log(str.charAt(0)); // J
Code language: JavaScript (javascript)
When you call a method on a primitive string variable or a literal
string, it is converted to an instance of the String type. For example:

'literal string'.toUpperCase();
Code language: JavaScript (javascript)

This feature is known as primitive wrapper types in JavaScript.

String manipulation

The String type provides many useful methods for manipulating strings
effectively. We will examine each of them in the following section.

1) Concatenating strings

To concatenate two or more strings you use the concat() method as

follows:

let firstName = 'John';

let fullName = firstName.concat(' ','Doe');
console.log(fullName); // "John Doe"
console.log(firstName); // "John"
Code language: JavaScript (javascript)

The concat() method concatenates one or more strings to another and

returns the result string. Note that the concat() method does not modify
the original string.

Besides the concat() method, JavaScript also uses the addition operator
(+) for concatenating strings. In practice, the addition operator is used
more often than the concat() method.

let firstName = 'John';

let fullName = firstName + ' ' + 'Doe';
console.log(fullName); // "John Doe"
Code language: JavaScript (javascript)

2) Extracting substrings

To extract a substring from a string, you use the substr() method:

substr(startIndex,[length]);
Code language: CSS (css)

The substr() method accepts two arguments.

The first argument startIndex is the location at which the characters are
being extracted, while the second argument length specifies the number
of characters to extract.

let str = "JavaScript String";

console.log(str.substr(0, 10)); // "JavaScript"

console.log(str.substr(11,6)); // "String"
Code language: JavaScript (javascript)

If you omit the length argument, the substr() method extracts the
characters to the end of the string.

Sometimes, you want to extract a substring from a string using

starting and ending indexes. In this case, you use
the substring() method:

substring(startIndex,endIndex)

See the following example:

let str = "JavaScript String";

console.log(str.substring(4, 10)); // "Script"
Code language: JavaScript (javascript)

3) Locating substrings

To locate a substring in a string, you use the indexOf() method:

string.indexOf(substring,[fromIndex]);
Code language: CSS (css)

The indexOf() method accepts two arguments: a substring to locate and

the fromIndex at which the method starts searching forward in the string.
The indexOf() returns the index of the first occurrence of the substring in
the string. If the substring is not found, the indexOf() method returns -1.

let str = "This is a string";

console.log(str.indexOf("is")); // 2
Code language: JavaScript (javascript)

The following example uses the fromIndex argument:

console.log(str.indexOf('is', 3)); //5

Code language: JavaScript (javascript)

To find the location of the last occurrence of a substring in a string,

you use the lastIndexOf() method.

string.lastIndexOf(substring,[fromIndex])
Code language: CSS (css)

Unlike the indexOf() method, the lastindexOf() method searches backward

from the fromIndex argument.

console.log(str.lastIndexOf('is')); // 5
Code language: JavaScript (javascript)

The lastIndexOf() method also returns -1 if the substring not found in the
string as shown in this example:

console.log(str.lastIndexOf('are')); // -1
Code language: JavaScript (javascript)