Preface

When working with JavaScript strings, there are many interesting tricks that can improve your coding efficiency. This article will cover some of these techniques for JavaScript strings to make you more skilful in string manipulation.Let's go!

String padding

Sometimes, it may be necessary to ensure that a string reaches a specific length. In this case, you can use the padStart and padEnd methods. These methods are used to pad the string with the specified characters at the beginning and end of the string until the string reaches the specified length.

// Use the padStart method to fill the beginning of the string with ‘0’ characters until it reaches length 8.
const binary = ‘101’.padStart(8, ‘0’);
console.log(binary); // ‘00000101’
// Use the padEnd method to fill the end of the string with ‘ * ’ characters until it is 10 long
const str = ‘Hello’.padEnd(11, ‘ *’); console.log(str); // ‘00000101
console.log(str); // ‘Hello * * *’

String Reversal

Reversing characters in a string is a common requirement and can be done using the extension operators ... , the reverse method, and the join method to achieve this.

// Reverse the characters in a string, using the extension operator, the reverse method, and the join method
const str = ‘developer’;
const reversedStr = [. .str].reverse().join(‘’); console.log(reversedStr)
console.log(reversedStr); // ‘reversed’

Initial Capitalisation

To capitalise the first letter of a string, you can use a variety of methods, such as the toUpperCase and slice methods, or you can use an array of characters.

// Initial-case operations, using the toUpperCase and slice methods
let city = ‘paris’;
city = city[0].toUpperCase() + city.slice(1);
console.log(city); // ‘Paris’

String Array Splitting

If you need to split a string into an array of characters, you can use the extension operator ... .

// Use the extension operator to split a string into a character array
const str = ‘JavaScript’;
const characters = [... .str]; console.log(characters); // [‘J’, ‘a’, ‘a’, ‘j’)
console.log(characters); // [‘J’, ‘a’, ‘v’, ‘a’, ‘S’, ‘c’, ‘r’, ‘i’, ‘p’, ‘t’]

Splitting Strings with Multiple Delimiters

In addition to regular string splitting, you can use regular expressions to split strings on multiple different separators.

// Use regular expressions and the split method to split strings on multiple separators
const str = ‘java,css;javascript’;
const data = str.split(/[,;]/);
console.log(data); // [‘java’, ‘css’, ‘javascript’]

Checking for string includes

The includes method can be used to check if a string contains a specific sequence without using a regular expression.

// Use the includes method to check if a string contains a specific sequence
const str = ‘javascript is fun’;
console.log(str.includes(‘javascript’)); // true

Checking if a string starts or ends in a specific sequence

If you need to check if a string starts or ends in a specific sequence, you can use the startsWith and endsWith methods.

// Use the startsWith and endsWith methods to check if a string starts or ends with a specific sequence
const str = ‘Hello, world!’;
console.log(str.startsWith(‘Hello’)); // true
console.log(str.endsWith(‘world’)); // false

String Replacement

To replace all occurrences of a particular substring in a string, you can use the replace method combined with a regular expression with global flags, or the new replaceAll method (note: not supported by all browsers and Node.js versions).

// Use the replace method in combination with a globally flagged regular expression to replace all occurrences of the string
const str = ‘I love JavaScript, JavaScript is amazing!’;
console.log(str.replace(/JavaScript/g, ‘Node.js’)); // ‘I love Node.js, Node.js is amazing!’

Summary

JavaScript string manipulation isn't just about splicing and dicing, and the 8 tricks presented in this article are only part of string manipulation - there's a lot more string manipulation out there waiting for you to delve into. These techniques will allow you to become more flexible and efficient when working with strings. I hope these techniques will help you in your JavaScript programming work.