This blog will tell all about JavaScript String Methods that you’ll probably use on your way to being a JavaScript developer.
For easier reading, I’ve separated each method for how handy they are.
But, these depend on what you’re building too. So don’t assume these are the exact thing you need to know to build your project while using JavaScript / TypeScript.
For better readability, I’ve separated the topics into how useful they are.
Useful
These methods are what you’ll definitely use one day or have already used while writing JavaScript / TypeScript.
length
You can use .length on a string. This will return how many characters there are in that string.
var text = "Hello Monkeys"
var textLength = text.length // there are 13 characters
console.log(textLength) // = 13split()
.split() is probably one of the most used methods. It separates each character into a string
var text = "Hello"
var textLength = text.split('') //[ 'H', 'e', 'l', 'l', 'o']
console.log(textLength)Optionally you could also separate them by any letter you’d want. For example in this case. Space ” “.
var text = "Hello Monkeys"
var textLength = text.split(' ');
console.log(textLength) // [ 'Hello', 'Monkeys' ]As you can see it separated Hello and Monkeys from the string “Hello World” by using the space between them. You can input any other valid characters too.
For example .split(“@”).
This can separate emails name from their domain.
example@mail.com ➡️ [ ‘example’ , ‘mail.com’ ]
You could also give it a second parameter, which would be a number.
This will limit how many splits there will be.
var text = "Hello Monkey Lovers!"
var textLength = text.split(' ', 2);
console.log(textLength) // [ 'Hello', 'Monkey' ]As you can see Lovers haven’t been logged, that’s because it got limited.
indexOf()
This method returns the index of a word in a string.
let str = "Hello citizen of Monkey Island"
let i = str.indexOf("citizen")
console.log(i) // 6trim()
Another simple yet useful in some cases.
This is the trim method.
let text1 = " Hello Monkeys! ";
let text2 = text1.trim();
console.log(text2) //Hello Monkeys!It removes the blank spaces at the start and end of the string.
But not the space between each word of the string.
Comes in Handy
replace()
The replace method accepts 2 arguments.
The first argument is the text which you want to be replaced.
The second argument is what you want to replace that text.
let text = "Hello Monkeys!";
let result = text.replace("Monkeys", "Everyone")
console.log(result); // "Hello Everyone!"slice()
This method will return a part of a string based on the arguments you give it.
This method can accept 2 arguments. Which are both numbers.
let text = "Hello Monkeys!"
let result = text.slice(0, 5)
console.log(result); // HelloIn this example, the method gets the first letter at index 0 until the last index of 5 but does not include it.
If you only give it 1 argument, then it will take the first index until the last index.
let text = "Hello Monkeys!";
let result = text.slice(6);
console.log(result);It starts with the letter M at index 6 and grabs every letter behind it.
includes()
The includes() method checks if the value that you passed in exists in it or not.
let text = "Hello Monkeys!"
let exist = text.includes("Monkeys") // Checks if Monkeys exist in the text or not
console.log(exist) // true ( that means it does )
let text = "Hello Monkeys!"
let exist = text.includes("Cats") // Checks if Cats exist in the text or not
console.log(exist)// false ( it doesn't )
concat()
concat() is a method that connects 2 strings together.
This method accepts 2 arguments.
let greet = "Hello"
let animal = "Monkeys"
let connect = greet.concat(" ", animal) // having a space between greet and animal string
console.log(connect)// Hello MonkeysThe first one is what will between the two strings when you connect them
The second argument is what string would you be connecting it to.
Good to Know
toUpperCase()
This is a very simple method. Yet very useful in some projects.
It just changes every letter in that string to an uppercase letter.
var text = "hello monkeys"
var upperText = text.toUpperCase()
console.log(upperText)
toLowerCase()
This method is the opposite of the previous .toUpperCase().
var text = "Hello MONKEYS"
var lowertext = text.toLowerCase();
console.log(lowertext)
It changes any uppercase letter to a lowercase letter.
startsWith()
startsWith() is somewhat similar to includes().
But instead of checking the entire string if it exists in the string or not.
It only checks the start of the string.
let text = "Hello Monkeys!"
let exist = text.startsWith("H")
console.log(exist) // true (Hello Monkeys! starts with H)This doesn’t only check by a letter. You can pass in a word too.
let text = "Hello Monkeys!"
let exist = text.startsWith("Hello")
console.log(exist) // true (Hello Monkeys! starts with H)
endsWith()
Again, like most of the methods.
There’s an opposite of it.
It does exactly the same thing with startsWith() but it just checks the end
let text = "Hello Monkeys!"
let exist = text.endsWith("!")
console.log(exist)// true (the string ends with !)
// You can pass in a word too
let text = "Hello Monkeys!"
let exist = text.endsWith("Monkeys!")
console.log(exist)// true (the string ends with Monkeys!)padStart()
padStart() accepts 2 arguments just like replace(). But doesn’t do the same thing.
The first argument is how to index you want to pad at the start.
let text = "5";
let padded = text.padStart(4,"0");
console.log(padded)// 0005padEnd()
This method is the opposite of padstart().
It just pads the string at the end of it.
let text = "5";
let padded = text.padEnd(4,"0");
console.log(padded) // 5000
Summary
Today I talked about the different string methods there are in JavaScript / TypeScript. You can also check out our blog about Python String Methods here too. Click the link and it’ll take to you it. Have a nice day👋.