Mastering Strings in JavaScript

A comprehensive guide to master Strings in JS

Photo by Mohammad Rahmani on Unsplash

like any other programming language, Strings are integral part of JavaScript. Strings are used to represent and manipulate text. Mastering string operations can significantly enhance your coding efficiency and effectiveness. This article will guide you through essential string methods and properties in JavaScript.

Let’s start creating string in JavaScript :

Strings in JavaScript can be created using single quotes, double quotes, or backticks (for template literals):

let name = "Iron Man";
console.log(name); //Outputs : Iron Man

let place = 'Wakanda';
console.log(place); //Outputs : Wakanda

let saying = `And I… am… {name}`;
console.log(saying); //Outputs : And I... am... Iron Man

Functions :

1. String Length

The length property returns the number of characters in a string:

let text = "Captain America";
console.log(text.length); // Outputs: 15

2. Accessing Characters

You can access characters in a string using the charAt() method or by treating the string like an array:

let text = "Thor";
console.log(text.charAt(0)); // Outputs: T
console.log(text[1]); // Outputs: h

3. Extracting Parts of a String

substring():

let text = "WakandaForever!";
console.log(text.substring(5, 9)); // Outputs: aFor
console.log(text.substring(9, 5)); // Outputs: aFor

Think of this as a tool that extracts a part of a string based on the positions you give it. If you tell it to start at position 5 and end at position 10, it will give you the characters from position 5 to 9. If you accidentally mix up the start and end positions, it will swap them for you and still give you the correct part of the string.

slice():

let text = "WakandaForever!";
console.log(text.slice(0, 7)); // Outputs: Wakanda
console.log(text.slice(7, 0)); // Outputs: ""

This also extracts a part of a string based on the positions you give it. However, if you mix up the start and end positions, it won’t swap them; instead, it will return an empty string. Additionally, slice() can handle negative positions, which means you can count from the end of the string.

Get Hirdesh Baghel’s stories in your inbox

Join Medium for free to get updates from this writer.

Remember me for faster sign in

4. Changing Case

• toUpperCase(): Converts all characters in a string to uppercase.

let text = "Hawkeye";
console.log(text.toUpperCase()); // Outputs: HAWKEYE

• toLowerCase(): Converts all characters in a string to lowercase.

let text = "HULK";
console.log(text.toLowerCase()); // Outputs: hulk

5. Concatenating Strings

The concat() method or the + operator can be used to join two or more strings:

let text1 = "Ant";
let text2 = "Man";
console.log(text1.concat("-", text2)); // Outputs: Ant-Man
console.log(text1 + "-" + text2); // Outputs: Ant-Man

6. Trimming Whitespace

• trim(): Removes whitespace from both ends of a string.

let text = "   Black Widow   ";
console.log(text.trim()); // Outputs: Black Widow

There are two other variations of trim method:

• trimStart(): Removes whitespace from the beginning of a string.
• trimEnd(): Removes whitespace from the end of a string.

7. Replacing Substrings

• replace(): Replaces a specified value with another value in a string.

let text = "Avengers Assemble!";
console.log(text.replace("Assemble", "Disassemble")); // Outputs: Avengers Disassemble!

• replaceAll(): Replaces all occurrences of a specified value with another value.

let text = "Avengers Assemble! Assemble!";
console.log(text.replaceAll("Assemble", "Disassemble")); // Outputs: Avengers Disassemble! Disassemble!

8. Splitting a String

The split() method splits a string into an array of substrings based on a specified delimiter:

let text = "Iron Man, Captain America, Thor";
let heroes = text.split(", ");
console.log(heroes); // Outputs: ["Iron Man", "Captain America", "Thor"]

Conclusion

We have discussed some most commonly used string functions in JavaScript. Mastering these string methods will empower you to handle text more effectively in your JavaScript applications.

Feel free to experiment with these methods and see how they can simplify your coding tasks! If you have any questions or need further clarification, just let me know.

“Until we meet again, keep striving for excellence! 🌟💪”

-HB