JavaScript Strings – Methods And Examples

What is a String in JavaScript?

In JavaScript, a string is used to store text. You can create a string by wrapping the text in:

  • Single quotes ' '

  • Double quotes " "

  • Backticks ` `

Examples of String Literals:

"Hello World"
'Hello World'
`Hello World`

You can store a string in a variable using the = sign:

let str1 = "Double quoted string";
let str2 = 'Single quoted string';
let str3 = `Template string`;

Template Strings

Template strings (also called template literals) use backticks (`). They let you:

  • Insert variables and expressions with ${ }

  • Write multi-line strings

Example:

let amount = 1000, rate = 0.05, years = 3;
let result = `Total: ${amount * (1 + rate * years)}`;

Multi-line Template String:

let str = `This
is a
multi-line string`;

Multi-line strings don’t work with ' ' or " ".


Strings Like Arrays

You can treat a string like an array of characters.

Example:

let str = 'Hello';

console.log(str[0]); // H
console.log(str.at(1)); // e

But note: you can’t change characters like this:

str[0] = "Y"; // Error!

Loop Through a String

Use loops to go through each character:

let str = 'Hello';

for (let i = 0; i < str.length; i++) {
  console.log(str[i]);
}

for (let ch of str) {
  console.log(ch);
}

Quotes Inside Strings

You can use single quotes inside double-quoted strings and vice versa:

let str1 = "This is 'easy'";
let str2 = 'This is "simple"';
let str3 = `This has both 'single' and "double" quotes`;

To include the same type of quote, use a backslash \:

let str = "He said, \"Hello!\"";

String Concatenation (Joining Strings)

You can combine strings using + or .concat():

let str1 = "Hello ";
let str2 = "World";

let result1 = str1 + str2;       // "Hello World"
let result2 = str1.concat(str2); // "Hello World"

String Objects vs. String Literals

You can also create strings as objects:

let str1 = new String("Hello");
let str2 = "Hello";

console.log(typeof str1); // object
console.log(typeof str2); // string

Comparing Strings

You can compare strings using:

  • <>=====

  • .localeCompare()

Examples:

"a" < "b"; // true
"Apple" == "Apple"; // true
"Apple" === "apple"; // false
"Apple".localeCompare("apple"); // 1

Note: === checks type and value, so it returns false when comparing a string object to a string literal.


Common String Properties and Methods

Property:

  • length – Returns number of characters

Useful Methods:

MethodDescription
charAt(index)Get character at position
charCodeAt(index)Get Unicode value of character
concat(str)Combine strings
indexOf(str)First position of substring
lastIndexOf(str)Last position of substring
slice(start, end)Get part of string
substring(start, end)Similar to slice
substr(start, length)Get part of string by length
replace(old, new)Replace text
split(separator)Split into array
toUpperCase()All uppercase
toLowerCase()All lowercase
valueOf()Get primitive string value
toString()Converts to string

Examples for each of the above listed JavaScript string methods:
1. charAt(index) – Get character at position
let str = "Hello";
console.log(str.charAt(1)); // "e"

2. charCodeAt(index) – Get Unicode value of character

let str = "A";
console.log(str.charCodeAt(0)); // 65

3. concat(str) – Combine strings

let str1 = "Hello ";
let str2 = "World!";
console.log(str1.concat(str2)); // "Hello World!"

4. indexOf(str) – First position of substring

let str = "I love JavaScript";
console.log(str.indexOf("love")); // 2

5. lastIndexOf(str) – Last position of substring

let str = "abcaabc";
console.log(str.lastIndexOf("a")); // 4

6. slice(start, end) – Get part of string

let str = "JavaScript";
console.log(str.slice(0, 4)); // "Java"

7. substring(start, end) – Similar to slice

let str = "JavaScript";
console.log(str.substring(4, 10)); // "Script"

8. substr(start, length) – Get part of string by length

 Deprecated but still works in most browsers.

let str = "JavaScript";
console.log(str.substr(4, 6)); // "Script"

9. replace(old, new) – Replace text

let str = "I love cats";
console.log(str.replace("cats", "dogs")); // "I love dogs"

10. split(separator) – Split into array

let str = "red,green,blue";
console.log(str.split(",")); // ["red", "green", "blue"]

11. toUpperCase() – All uppercase

let str = "hello";
console.log(str.toUpperCase()); // "HELLO"

12. toLowerCase() – All lowercase

let str = "HELLO";
console.log(str.toLowerCase()); // "hello"

13. valueOf() – Get primitive string value

let strObj = new String("Hello");
console.log(strObj.valueOf()); // "Hello"

14. toString() – Converts to string

let num = 123;
console.log(num.toString()); // "123"


These methods wrap your string in HTML tags:

MethodHTML Tag
bold()<b>
italics()<i>
anchor(name)<a name="">
fontcolor(color)<font color="">
fontsize(size)<font size="">
strike()<strike>
sub()<sub>
sup()<sup>