13 Most Common JavaScript String Methods You Should Know About

Dimple Kumari
4 min readMar 16, 2024

--

In JavaScript, strings are sequences of characters. JavaScript provides a rich set of methods to manipulate and work with strings. In this post, I’ll introduce you to the 13 most commonly used JavaScript string methods and their functionalities.

String length

If you want to find the number of characters in a string, then you can use the length property.

const str = "This is a string.";
const lengthOfStr = str.length;
console.log(lengthOfStr); // Output: 17

This also counts white spaces.

String toUpperCase()

If you want to convert a string to uppercase, then you can use the toUpperCase() method.

const str = "This is a string.";
const uppercaseStr = str.toUpperCase();
console.log(uppercaseStr); // Output: THIS IS A STRING.

String toLowerCase()

If you want to convert a string to lowercase, then you can use the toLowerCase() method.

const str = "This Is a String.";
const lowercaseStr = str.toLowerCase();
console.log(lowercaseStr); // Output: this is a string.

String indexOf()

If you want to find the first occurrence of a substring in a string then you can use the indexOf() method.

const str = "This is a js string and js string is nice.";
const indexOfJs = str.indexOf("js");
console.log(indexOfJs); // Output: 10

String lastIndexOf()

If you want to find the last occurrence of a substring in a string then you can use the lastIndexOf() method.

const str = "This is a js string and js string is nice.";
const lastIndexOfJs = str.lastIndexOf("js");
console.log(lastIndexOfJs); // Output: 24

String slice()

If you want to extract a part of a string, then you can use the slice() method. This will return the extracted part in a new string.

Syntax:

string.slice(start position, end position);

The end position will not be included.

//Example:1
const str1 = "This is a string.";
const slicedStr1 = str1.slice(0, 7);
console.log(slicedStr1); // Output: This is
//Example:2
const str2 = "This is a string.";
const slicedStr2 = str2.slice(3, 9);
console.log(slicedStr2); // Output: s is a

If you don’t specify the end position then this will slice out the rest of the string.
For example:

const str = "This is a string.";
const slicedStr = str.slice(5);
console.log(slicedStr); // Output: is a string.

You can also give it negative parameters.

For example:

const str = "This is a string.";
const slicedStr = str.slice(-3, -1);
console.log(slicedStr); // Output: ng

To put it simply, you can understand this as:

str.slice(-3, -1);
str.slice(str.length-3, str.length-1);
str.slice(17-3, 17-1);
str.slice(14, 16);

String substring()

The substring() method is similar to the slice() method, but the difference is that if you give it negative parameters (less than 0) then they will be treated as 0.

const str = "This is a string.";
const slicedStr = str.substring(-3, 5);
console.log(slicedStr); // Output: This

String substr()

The substr() method is similar to the slice() method, but the difference is that the end parameter is the length of the characters to be extracted.

const str = "This is a string.";
//This will extract the characters staring from index 11
//and will extract 4 characters.
const slicedStr = str.substr(11, 4);
console.log(slicedStr); // Output: trin

String charAt()

If you want to get a character at a specified index in a string, then you can use the charAt() method.

const str = "This is a string.";
const character = str.charAt(13);
console.log(character); // Output: i

String concat()

If you want to concatenate two or more strings, then you can use the concat() method.

const firstName = "John";
const lastName = "Doe";
const fullName = firstName.concat(" ", lastName);
console.log(fullName); // Output: John Doe

String trim()

You can remove whitespace from both ends of a string using the trim() method.

const str = "    This is a string.    ";
const trimmedStr = str.trim();
console.log(trimmedStr); // Output: This is a string.

String replace()

If you want to replace a specified substring with another string, then you can use the replace() method.

const str = "JavaScript is amazing!";
const replacedStr = str.replace("amazing", "awesome");
console.log(replacedStr); // Output: JavaScript is awesome!

String split()

You can convert a string into an array using the split() method.

const str1 = "JavaScript is amazing!";
const arr1 = str1.split();
console.log(arr1); // Output: ['JavaScript is amazing!']
//Example:2
const str2 = "JavaScript is amazing!";
const arr2 = str2.split(" ");
console.log(arr2); // Output: ['JavaScript', 'is', 'amazing!']

Thank You for Reading!

If you found this post informative and valuable, I’d love for you to connect with me. Follow me here on Medium, Codepen, and connect with me on LinkedIn to stay updated on the latest in web development, design, interviews, and more.

Let’s connect!

💼 𝐋𝐢𝐧𝐤𝐞𝐝𝐈𝐧 — https://www.linkedin.com/in/dimple-kumari/
🔗 𝐌𝐞𝐝𝐢𝐮𝐦 — https://medium.com/@dimplekumari0228
✍️ 𝐂𝐨𝐝𝐞𝐩𝐞𝐧 — https://codepen.io/DIMPLE2802

--

--

Dimple Kumari

Passionate front-end developer creating pixel-perfect web experiences. HTML, CSS, and JS enthusiast. Making the web beautiful and user-friendly. 🌐