Getting to Know JavaScript Built-In Methods — Strings

Tolani Benson
4 min readMay 4, 2020

--

Photo by Kevin Ku on Unsplash

This is the first in a series of posts I’ll be writing about JavaScript’s built-in methods for various data types.

There are a ton of handy ready-made methods which can be used to manipulate data, and I’ll be explaining some of the most useful ones here. I’ll add links to the rest of the series at the bottom of this post to use as a quick reference guide for all your JS built-in method needs!

Today I’ll be starting with String — one of the 6 JS primitive data types. If you’re not completely familiar with all of the data types I’ll give you a quick recap, and here’s a link to the MDN docs if you want a bit more detail.

Primitive

  • Null — no value (not to be confused with Undefined)
  • Undefined — a declared variable that has not been assigned a value
  • Boolean — true or false
  • Number — numbers, includes integers & floats, there is no distinction between the two i JS
  • String — a collection of characters treated as an array
  • Symbol — a unique value that is not equal to any other value

Complex — aka Objects

All non-primitive data types are classed as Objects. This covers a really broad range of data types but the main ones we’ll be focusing on are:

  • Objects — defined within curly braces, containing key value pairs { }
  • Arrays — lists of data defined within square brackets [ ]
  • Date — date objects
  • Math — mathematical operations

Technically, primitive data types cannot have methods, but JavaScript treats them as objects so that they can be operated on using these built-in methods.

JavaScript String Methods

Getting back to the point of this post, let’s explore some of the JS String methods.

The methods below are used to operate on strings, but if you want to convert a different type of object into an object you can do this using obj.toString() .

A quick note on the notation — to make this article readable I’m just going to use “str” to represent a string, assume str is a variable that has been assigned a string. These methods can also be called with a string placed in parentheses at the beginning of the expression, eg (“JavaScript is great”).charAt(0) will return the same as if we defined const sentence = “JavaScript is great” and called sentence.charAt(0) — we get “J” in both cases.

str.length()

Returns the length of a string.

str.toUpperCase()

Convert all of the characters in a string to capitals. Non-destructive — returns a new string, does not change the original string.

str.toLowerCase()

As with toUpperCase. Converts all characters to lower case. Non-destructive.

str.split(separator, limit)

Splits the string into an array, split by the provided separator. Eg (“JavaScript is great”).split(“ “) will return [“JavaScript”, “is”, “great”]. If an empty string (“”) is provided, it will split each character into a new element in the array (this can also be achieved with the spread operator […str]). Optional second parameter, limit, takes an integer — will only return the number of elements specified, eg (“JavaScript is great”).split(“ “, 2) will return [“JavaScript”, “is”]. Non-destructive.

str.charAt(index)

I’m sure from the spoiler in the earlier paragraph you have worked out that this returns the character at the defined index. The string is treated as an array of characters, each with an index reference.

str.indexOf(searchString, index)

Returns the index of the provided search parameter within the string. If there it is in the string more than once it returns the index of the first instance. Optional second parameter gives the position of the index of where to start the search from (begins at this position and searches to the end of the string, defaults to 0 if not defined). If it is not found returns -1. Also str.lastIndexOf(searchString, index) gives index of last instance of search string.

str.includes(searchString, index)

Check whether a string includes a defined search string. Returns true if it is found, false if not. Optional second parameter gives the position of the index of where to start the search from, same as indexOf.

str.startsWith(searchString, index)

Find out whether a string begins with the provided search parameter. Returns a boolean. Optional second parameter, index — searches string starting at the index provided. If not set defaults to 0.

str.endsWith(searchString, length)

Find out whether a string ends with the provided search parameter. Returns a boolean. Optional second parameter, length — searches the number of characters stated, from beginning of the string. If not set defaults to str.length.

str.match(regexp)

Searches for matches to a provided regular expression object. Returns an array of all matches. Non-destructive.

str.replace(searchFor, replaceWith)

Finds every instance of the search for substring and replaces it with the given new substring. Non-destructive.

str.trim()

Removes whitespace from beginning and end of a string. Also str.trimStart() and str.trimEnd() to remove whitespace from just the beginning or end of a string, respectively. Non-destructive.

str.repeat(count)

Repeat string count times.

So there you have it! A bunch of helpful methods to simplify your code when operating on strings!

I hope you you found it a helpful! If so give me some claps :)

You can bookmark this page as a quick reference guide to come back to when you need it, and I’ll add links to the rest of the posts here as I write them:

--

--

Tolani Benson

Ex-financial analyst turned software engineer. Lover of learning, coding, cake and dogs. Not in that order.