10 Most Important String Methods in JavaScript For Everyday Use

Photo by João Silas on Unsplash

Hey guys, What’s up. Today I’m going to discuss the most common and cool JavaScript built-in functions which must need in your every programming. Actually, I’m going to describe some cool build-in methods of string, number, array, object, and math also in JavaScript. So why late, Let’s dive into it.

Most Common String Methods

1. concat()

It used to add or join multiple strings to one string. When we need to add one more than string, we can use it.

oneString.concat(‘separator’, anotherString)

const firstName = "Jhon";
const lastName = "Doe";
const title = "2nd";
// Concatenation between two String.
const twoStr = firstName.concat(' ', lastName);
console.log(twoStr); // expected output: Jhon Doe
// Concatenation among three String.
const threeStr = firstName.concat(' ', lastName,' ', title);
console.log(threeStr); // expected output: Jhon Doe 2nd
// feel free to use ' ', '+', ',' what you want as string separator.

2. includes()

includes() is used for checking a selected string elements or characters from a string, it would be a word also. And If it gets the targeted thing, it returns true otherwise returns false.

string.includes(‘string characters’, string)

const string = "JavaScript is cool";
const lang = "JavaScript";
string.includes(lang) ? console.log(true) : console.log(false);
// expected output: true
// we can check only one characters or more than one. For Example:
string.includes('J') ? console.log(true) : console.log(false);
// expected output: true
string.includes('Java') ? console.log(true) : console.log(false);
// expected output: true
string.includes('java') ? console.log(true) : console.log(false);
// expected output: false // It's case-sensitive also.

3. split()

split() used to separate or divide string by on the basis of different types of separators like ‘ ‘ or comma and what you want. It’s important to keep in mind that it returns an array as output.

const personName = "Jhon Doe";
const splitPersonName = personName.split(' ');
console.log(splitPersonName); // expected output: [ 'Jhon', 'Doe' ]
const greetings = 'hi, hey, hello';
const splitGreetings = greetings.split(', ');
console.log(splitGreetings); 
// expected output: [ 'hi', 'hey', 'hello' ]

4. slice()

If you want to copy a string by value not copy by reference, the slice() method is going solution to you. You can change or do anything with copied string but the previous string will remain unchanged.

string.slice(‘startsIndex’, ‘endsIndex’)

const string = "JavaScript is Beauty."
const sliceString = string.slice(0, 11)
console.log(sliceString); // expected output: JavaScript

5. charAt()

It returns a string character according to the index of string. If you need to know a specific string character providing the string index, you can easily grab it by using that cool method.

string.charAt(index)

const string = 'John Doe';
const gotChar = string.charAt(2);
console.log(gotChar); // expected output: h
const anotherChar = string.charAt(0);
console.log(anotherChar);  // expected output: J

6. subStr()

subStr method is used to get a portion of the string. It gives two arguments. one is for start index and another is for length. If you gave only one argument, that would be taken as a starting index, the last index of string would be taken automatically as the length.

string.subStr(startsIndex, length);

const string = 'This is a simple text';
const gotText = string.substr(9, 7);
console.log(gotText); // expected output: simple
const anotherText = string.substr(9);
console.log(anotherText); // expected output: simple text

7. trim()

trim() is one of the cool functions of string in javascript. It used to remove extra white spaces both starting and ending point of the string.

We can also use trimStart() to remove white spaces at the starting point and trimEnd() to remove white spaces at the ending point.

string.trim()
string.trimStart();
string.trimEnd();

const name = '     John Doe     ';
const trimName = name.trim();
console.log(trimName); // expected output: John Doe
const age = '          32';
const trimAtStart = age.trimStart();
console.log(trimAtStart); // expected output: 32
const address = 'Chittagong           ';
const trimAtEnd = address.trimEnd();
console.log(trimAtEnd); // expected output: Chittagong

8. startsWith() & endsWith()

statsWith() is used for matching string character or characters at the starting point of a certain string. On the other hand, endsWith() is used for matching ending character or characters at the ending point of a certain string.

string.endsWith(chars);
string.startsWith(chars);

const greeting = "Hi, John";
greeting.startsWith('Hi') ? console.log("True") : console.log("False");
// expected output: true;
greeting.startsWith('H') ? console.log("True") : console.log("False");
// expected output: true;
greeting.endsWith('n') ? console.log("True") : console.log("False");
// expected output: true;
greeting.endsWith('John') ? console.log("True") : console.log("False");
// expected output: true;
greeting.endsWith('john') ? console.log("True") : console.log("False");
// expected output: false; // Because, It's case-sensetive

9. indexOf() & lastIndexOf()

IndexOf() returns the length of total characters until serching character or characters. And lastIndexOf() also returns the length of total characters until the last serching character or characters.

string.indexOf(chars);
string.lastIndexOf(chars);

const paragraph = 'I am a dog lover. I love dog';
const serchTxt = 'dog';
console.log(paragraph.lastIndexOf(serchTxt)); // expected output: 25
console.log(paragraph.indexOf(serchTxt)); // expected output: 7

10. toUpperCase() & toLowerCase()

toUpperCase() is used to convert all characters of string to upper case, I mean capital letter and toLowerCase() is used to convert all characters of string to lower case, I mean small letter.

string.toUpperCase();
string.toLowerCase();

const string = "Hey, Programmers";
const upperCase = string.toUpperCase();
console.log(upperCase); // expected output: HEY, PROGRAMMERS
const lowerCase = string.toLowerCase();
console.log(lowerCase); // expected output: hey, programmers

Bonus Content: JavaScript Number Methods

1. isNan()

NaN means Not a Number. If the arguments not converted into a number, then it returns NaN. isNaN() is used for checking a number. If it’s argument is a number or number like string, it returns false and otherwise returns true.

isNaN(arg)

const add = (a, b) => {
    if (isNaN(a) || isNaN(b)) {
        return "Arguments must a number!";
    } else {
        return a + b;
    }
}
const sum = add(2, 2);
console.log(sum); // expected output: 4
console.log(isNaN(2)); // expected output: false
console.log(isNaN('2')); // expected output: false
console.log(isNaN('apple')); // expected output: true

2. parseFloat()

parseFloat() is used to return a number from string. If your argument is a number, It returns a number. If the argument is string, it tries to return a number. If it can’t convert string to number, then this function return NaN.

parseFloat(str)

const numberTypedString = '100';
const number = parseFloat(numberTypedString);
console.log(number); // expected output: 100
console.log(typeof number); // expected output: number
const name = 'foo';
const parseName = parseFloat(name);
console.log(parseName); // expected output: NaN

3. parseInt()

It used to get an integer type value based on different types of number systems like binary, octal, decimal hexadecimal. It takes two arguments in which one argument takes an integer or string value and another argument takes the base of number systems like 2 for binary, 8 for octal, 10 for decimal, 16 for hexadecimal.

parseInt(‘number’, base)

const numberLikeString = '100';
const decimalToInt = parseInt(numberLikeString, 10); // 10 is the base of decimal
console.log(decimalToInt); // expected output: 100
const binaryNumber = 11;
const binaryToInt = parseInt(binaryNumber, 2); // 2 is the base of binary
console.log(binaryToInt); // expected output: 3
const hexaDecimal = '12a';
const hexaToInt = parseInt(hexaDecimal, 16); // 16 is the base hexadecimal.
console.log(hexaToInt); // expected output: 298

That’s all about cool string methods in JavaScript. In this article, I am trying to cover some of the important mostly used JS string methods which are needed in daily programming problem-solving. Thanks for being with me. If you have any questions or suggestions, don’t forget to drop in below.