• JavaScript Basics

  • Operators in JavaScript

  • Conditional Statements in JavaScript

  • JavaScript Strings

  • JavaScript Arrays

  • JavaScript Loop

  • JavaScript Functions

  • Conclusion

JavaScript String Methods

String Methods in JavaScript

JavaScript provides many methods for working with strings. Since strings are immutable (they cannot be changed once created), these methods return new strings without altering the original one.

Basic String Methods

1. String Length

The .length property returns the number of characters in a string. This is useful for checking the length of user input.

javascript
1let text = "Hello, World!";
2let length = text.length; // Outputs: 13

2. charAt()

The charAt() method returns the character at a specified position in a string.

javascript
1let text = "JavaScript";
2let character = text.charAt(2); // Outputs: "v"

3. charCodeAt()

The charCodeAt() method returns the Unicode of the character at a specified index in the string.

javascript
1let text = "JavaScript";
2let unicode = text.charCodeAt(2); // Outputs: 118 (Unicode for "v")

4. at()

The at() method returns the character at a specified index. It works similarly to charAt().

javascript
1let text = "JavaScript";
2let character = text.at(3); // Outputs: "a"

5. Accessing Characters Using []

You can access characters in a string like an array by using square brackets.

javascript
1let text = "JavaScript";
2let character = text[4]; // Outputs: "S"

6. slice()

The slice() method extracts a section of a string and returns it as a new string. You can specify the start and end positions.

javascript
1let text = "JavaScript is fun";
2let part = text.slice(0, 10); // Outputs: "JavaScript"

7. substring()

The substring() method works like slice() but does not accept negative indexes.

javascript
1let text = "JavaScript is fun";
2let part = text.substring(0, 10); // Outputs: "JavaScript"

8. substr()

The substr() method extracts a specified number of characters from a starting position.

javascript
1let text = "JavaScript is fun";
2let part = text.substr(0, 10); // Outputs: "JavaScript"

9. toUpperCase()

The toUpperCase() method converts all characters in a string to uppercase.

javascript
1let text = "hello world";
2let upperText = text.toUpperCase(); // Outputs: "HELLO WORLD"

10. toLowerCase()

The toLowerCase() method converts all characters in a string to lowercase.

javascript
1let text = "HELLO WORLD";
2let lowerText = text.toLowerCase(); // Outputs: "hello world"

11. concat()

The concat() method joins two or more strings and returns a new string.

javascript
1let text1 = "Hello";
2let text2 = "World";
3let result = text1.concat(" ", text2); // Outputs: "Hello World"

12. trim()

The trim() method removes whitespace from both sides of a string.

javascript
1let text = "   Hello World   ";
2let trimmedText = text.trim(); // Outputs: "Hello World"

13. trimStart()

The trimStart() method removes whitespace only from the beginning of a string.

javascript
1let text = "   Hello World   ";
2let trimmedStartText = text.trimStart(); // Outputs: "Hello World   "

14. trimEnd()

The trimEnd() method removes whitespace only from the end of a string.

javascript
1let text = "   Hello World   ";
2let trimmedEndText = text.trimEnd(); // Outputs: "   Hello World"

15. padStart()

The padStart() method pads the beginning of a string with a specified character to reach a desired length.

javascript
1let text = "5";
2let paddedText = text.padStart(3, "0"); // Outputs: "005"

16. padEnd()

The padEnd() method pads the end of a string with a specified character to reach a desired length.

javascript
1let text = "5";
2let paddedText = text.padEnd(3, "0"); // Outputs: "500"

17. repeat()

The repeat() method repeats a string a specified number of times.

javascript
1let text = "Hi! ";
2let repeatedText = text.repeat(3); // Outputs: "Hi! Hi! Hi! "

18. replace()

The replace() method replaces a specified value in a string with a new value. It only replaces the first occurrence.

javascript
1let text = "Hello, World!";
2let newText = text.replace("World", "JavaScript"); // Outputs: "Hello, JavaScript!"

19. replaceAll()

The replaceAll() method replaces all occurrences of a specified value in a string with a new value.

javascript
1let text = "Hello, World! Hello again!";
2let newText = text.replaceAll("Hello", "Hi"); // Outputs: "Hi, World! Hi again!"

20. split()

The split() method splits a string into an array based on a specified separator.

javascript
1let text = "JavaScript,HTML,CSS";
2let languages = text.split(","); // Outputs: ["JavaScript", "HTML", "CSS"]

Key Takeaways on JavaScript String Methods

  • Immutability: JavaScript strings are immutable, meaning methods create new strings rather than changing the original.
  • Length Property: .length provides the total number of characters in a string, useful for validating input length.
  • Character Access: Use charAt() or square brackets ([]) to access individual characters in a string.
  • String Extraction: Use slice(), substring(), or substr() to get parts of a string. slice() allows negative indexes, while substring() does not.
  • Case Conversion: toUpperCase() and toLowerCase() are useful for converting text to all uppercase or lowercase.
  • Whitespace Removal: trim(), trimStart(), and trimEnd() remove spaces from around or within strings, helpful for cleaning user input.
  • Concatenation: Use concat() or simply + to combine strings into one.
  • Padding: padStart() and padEnd() add padding to strings, useful for formatting text in fixed-width fields.
  • Replacing Text: replace() replaces the first match, while replaceAll() replaces all occurrences in the string.
  • Repeating Text: repeat() duplicates a string a set number of times.
  • Splitting Text: split() divides a string into an array based on a specified separator, ideal for breaking up text data.

Frequently Asked Questions