JavaScript Strings

The JavaScript String is a primitive data type used to represent text values.

  • A string is a sequence of letters, numbers, special characters, or a combination of all.
  • The string value is enclosed within single quotes, double quotes, or backticks.
  • There is no difference between single and double quotes usage.
  • The backticks are used if the string value contains variables that need to be replaced with their values.

Creating Strings

The below example shows the usage of single quotes, double quotes, and backticks.

var str1 = 'Hello World!';   // String value with single quotes
var str2 = "Hello User!";    // String value with double quotes

var name = "Arun";
var str3 = `Hello ${name}!`;  // String value with backticks

document.write(str1);    // Prints: Hello World!
document.write(str2);    // Prints: Hello User!
document.write(str3);    // Prints: Hello Arun!

Strings Containing Quotes

The below example shows the strings with quotes within quotes.

var str1 = "It's okay";                          // Single quotes within double quotes
var str2 = 'He said "Goodbye"';                  // Double quotes within single quotes
var str3 = "She replied 'Calm down, please'";    // Single quotes within double quotes
var str4 = 'Hi, there!";                         // Syntax error - quotes must match

document.write(str1);    // Prints: It's okay
document.write(str2);    // Prints: He said "Goodbye"
document.write(str3);    // Prints: She replied 'Calm down, please'

Using Escape Sequences

Escape sequences are useful in situations where we need to include characters that cannot be typed using a keyboard.

Here is the list of commonly used escape sequences.

Escape Character Description
\n Replaced by a newline character.
\t Replaced by a tab character.
\r Replaced by a carriage-return character.
\b Replaced by a backspace character.
\\ Replaced by a single backslash \ symbol.

The below example shows how the escape characters work.

var str1 = "This text has a line break that moves \n this content to next line.";
document.write("<pre>" + str1 + "</pre>");    // Creates a line break
 
var str2 = "C:\Users\Downloads";
document.write(str2);    // Prints: C:UsersDownloads
 
var str3 = "C:\\Users\\Downloads";
document.write(str3);    // Prints: C:\Users\Downloads

Accessing String Characters

We can access the characters of a string in two ways.

One way is to treat the string as an array of characters and access the characters using their index as shown below.

const a = 'Hello';
console.log(a[1]);    // "e"

Another way is to use the method charAt() that accepts the index of the characters as shown below.

const a = 'Hello';
console.log(a.charAt(1));    // "e"

Strings are Immutable

In JavaScript, the strings are immutable, which means the individual characters of a string cannot be changed.

let a = 'hello';
a[0] = 'H';
console.log(a);    // "hello"

However, we can assign a new value to a string variable.

let a = 'hello';
a = 'Hello';
console.log(a);    // "Hello"

Multiline Strings

We can use the operators + or \ to represent strings that span across multiple lines as shown below.

  • This helps in better visibility of a long text within the code.
// Multi-line string using the + operator
const str1= 'This is a long text ' +
    'that spans across multiple lines' + 
    'in the code.'

// Multi-line string using the \ operator
const str2 = 'This is a long text \
that spans across multiple lines \
in the code.'

String Object

We can also create a string using the new keyword.

However, it is recommended to avoid using the object, as it slows down the program execution.

const a = 'hello';
const b = new String('Hello');

console.log(a);    // Prints: "hello"
console.log(b);    // Prints: "Hello"

console.log(typeof a);    // "string"
console.log(typeof b);    // "object"

For more details about the object properties and methods, check JavaScript String Object.

String Function

We can use the String function to convert various data types to strings as shown below.

const a = 123;    // Number value
const b = true;    // Boolean value

// Converting to string values
const str1 = String(a);
const str2 = String(b);

console.log(str1);    // Prints: "123"
console.log(str2);    // Prints: "true"

console.log(typeof a);       // Prints: number
console.log(typeof b);       // Prints: boolean
console.log(typeof str1);    // Prints: string
console.log(typeof str2);    // Prints: string

Overall

The JavaScript String is a primitive data type used to represent text values.

Related Links