All Basic About Strings in JavaScript
Strings are used to store text. They are used to represent a sequence of characters. Strings are written with quotes. You can use single or double quotes.
let name = "Ajay";
let message = 'Hello, Ajay!';
String Length
The length property returns the length of a string (number of characters).
let name = "Ajay";
console.log(name.length); // 4
Escape Characters
In JavaScript, you can use the backslash \ to escape quotes and other characters.
let message = 'It\'s a beautiful day!';
console.log(message); // It's a beautiful day!
The backslash \ is used to escape quotes and other characters in a string.
| Code | Output | Description |
|---|---|---|
\' | ' | Single quote |
\" | " | Double quote |
\\ | \ | Backslash |
\n | New line | |
\r | Carriage return | |
\t | Tab | |
\b | Backspace | |
\f | Form feed | |
\v | Vertical tab |
String Methods
JavaScript has a number of built-in methods for working with strings.
toUpperCase()
The toUpperCase() method converts a string to uppercase letters.
let name = "Ajay";
console.log(name.toUpperCase()); // AJAY
toLowerCase()
The toLowerCase() method converts a string to lowercase letters.
let name = "AJAY";
console.log(name.toLowerCase()); // ajay
charAt()
The charAt() method returns the character at a specified index (position) in a string.
let name = "Ajay";
console.log(name.charAt(0)); // A
console.log(name.charAt(1)); // j
indexOf()
The indexOf() method returns the position of the first occurrence of a specified value in a string.
let message = 'Hello, Ajay!';
console.log(message.indexOf('Ajay')); // 7
lastIndexOf()
The lastIndexOf() method returns the position of the last occurrence of a specified value in a string.
let message = 'Hello, Ajay!';
console.log(message.lastIndexOf('l')); // 3
includes()
The includes() method returns true if a string contains a specified value, otherwise false.
let message = 'Hello, Ajay!';
console.log(message.includes('Ajay')); // true
console.log(message.includes('Ajayy')); // false
// Case sensitive
console.log(message.includes('ajay')); // false
startsWith()
The startsWith() method returns true if a string starts with a specified value, otherwise false.
let message = 'Hello, Ajay!';
console.log(message.startsWith('Hello')); // true
console.log(message.startsWith('Ajay')); // false
endsWith()
The endsWith() method returns true if a string ends with a specified value, otherwise false.
let message = 'Hello, Ajay!';
console.log(message.endsWith('Ajay!')); // true
console.log(message.endsWith('Hello')); // false
slice()
The slice() method extracts a part of a string and returns the extracted part in a new string.
let message = 'Hello, Ajay!';
console.log(message.slice(7)); // Ajay!
console.log(message.slice(7, 11)); // Ajay
substring()
The substring() method extracts the characters from a string, between two specified indices, and returns the new sub string.
let message = 'Hello, Ajay!';
console.log(message.substring(7)); // Ajay!
console.log(message.substring(7, 11)); // Ajay
substr()
The substr() method extracts the characters from a string, beginning at a specified start position, and through the specified number of character.
let message = 'Hello, Ajay!';
console.log(message.substr(7)); // Ajay!
console.log(message.substr(7, 4)); // Ajay
replace()
The replace() method replaces a specified value with another value in a string.
let message = 'Hello, Ajay!';
console.log(message.replace('Ajay', 'John')); // Hello, John!
split()
The split() method splits a string into an array of substrings, and returns the new array.
let message = 'Hello, Ajay!';
console.log(message.split(' ')); // [ 'Hello,', 'Ajay!' ]
trim()
The trim() method removes whitespace from both ends of a string.
let message = ' Hello, Ajay! ';
console.log(message.trim()); // Hello, Ajay!
concat()
The concat() method joins two or more strings.
let name = "Ajay";
let message = 'Hello, ';
console.log(message.concat(name)); // Hello, Ajay
repeat()
The repeat() method returns a new string with a specified number of copies of the string it was called on.
let name = "Ajay";
console.log(name.repeat(3)); // AjayAjayAjay
padStart()
The padStart() method pads the current string with another string until the resulting string reaches the given length.
let name = "Ajay";
console.log(name.padStart(10, 'Hi ')); // Hi Hi Ajay
padEnd()
The padEnd() method pads the current string with another string until the resulting string reaches the given length.
let name = "Ajay";
console.log(name.padEnd(10, ' Hi')); // Ajay Hi Hi
match()
The match() method searches a string for a match against a regular expression, and returns the matches, as an Array object.
let message = 'Hello, Ajay!';
console.log(message.match('Ajay')); // [ 'Ajay', index: 7, input: 'Hello, Ajay!', groups: undefined ]
search()
The search() method searches a string for a specified value, and returns the position of the match.
let message = 'Hello, Ajay!';
console.log(message.search('Ajay')); // 7
localeCompare()
The localeCompare() method compares two strings in the current locale.
let name1 = "Ajay";
let name2 = "John";
console.log(name1.localeCompare(name2)); // -1
console.log(name2.localeCompare(name1)); // 1
console.log(name1.localeCompare(name1)); // 0
charCodeAt()
The charCodeAt() method returns the Unicode of the character at a specified index in a string.
let name = "Ajay";
console.log(name.charCodeAt(0)); // 65
console.log(name.charCodeAt(1)); // 106
fromCharCode()
The fromCharCode() method converts Unicode values to characters.
console.log(String.fromCharCode(65)); // A
console.log(String.fromCharCode(106)); // j
fromCodePoint()
The fromCodePoint() method returns a string created by using the specified sequence of code points.
console.log(String.fromCodePoint(65)); // A
console.log(String.fromCodePoint(106)); // j
codePointAt()
The codePointAt() method returns a non-negative integer that is the Unicode code point value.
let name = "Ajay";
console.log(name.codePointAt(0)); // 65
console.log(name.codePointAt(1)); // 106
normalize()
The normalize() method returns the Unicode Normalization Form of a given string.
let name = "Ajay";
console.log(name.normalize()); // Ajay
includes()
The includes() method determines whether a string contains the characters of a specified string.
let name = "Ajay";
console.log(name.includes('A')); // true
console.log(name.includes('a')); // false
Template Literals
Template literals are string literals allowing embedded expressions. You can use multi-line strings and string interpolation features with them. They were called "template strings" in prior editions of the ES2015 specification.
let name = "Ajay";
let message = `Hello, ${name}!`;
console.log(message); // Hello, Ajay!
Template literals are enclosed by the back-tick (<) (grave accent) character instead of double or single quotes.
Conclusion
In this tutorial, we learned about strings in JavaScript and various methods to work with strings. We also learned about template literals.