Nerd For Tech
Published in

Nerd For Tech

Basics of Javascript · String · padStart() (method)

This article is a transcript of my free youtube series about basics of web development. If you prefer watching over reading, feel free to visit my channel “Dev Newbs”.

Hello to all the fellow newbs! Another slacker method is ahead of us and today it is going to be padStart(). Let’s dig into it, so we can go for an ice cream or something.

The padStart() method keeps padding the current string with the given string until the resulting string reaches target length. In the case of this method, padding is applied from the beginning of the current string.

We need to provide one mandatory parameter which is the target length of the resulting padded string. Second parameter is optional and it specifies the string that should be used for padding.

Let’s see some basic examples for this method.

// no optional parameter
'"' + 'ABC'.padStart(10) + '"' // " ABC"
// current length >= target length
'"' + 'ABCDEFGHIJ'.padStart(5) + '"' // "ABCDEFGHIJ"
// padding keeps repeating in loop until target length is achieved
'"' + 'ABCDE'.padStart(10, "abc") + '"' // "abcabABCDE"
// padding stops once target length is achieved
'"' + 'ABCDEF'.padStart(10, "abcdef") + '"' // "abcdABCDEF"
// default padding sequence is one empty space character (" ")
'"' + 'ABCDEF'.padStart(10, " ") + '"' // " ABCDEF"
'"' + 'ABCDEF'.padStart(10) + '"' // " ABCDEF"

If the target length is less than or equal to current length, no padding is applied and string is left as-is.

Process of padding is done in a loop one character at a time. Once we apply the last character from the padding string and the current length of the string is less than the target string, we continue to pad starting again with the first character of the padding string and so on.

On the other hand, if we reach the target length before we use each character of the padding string, the padding process ends then and there.

The default value for the padding string is empty space, if no other string sequence is provided.

Okay, still nothing groundbreaking. But as always, we can make our lives more miserable. Why not do that, right? Let’s mess with the two code unit characters.

let emoji = "🙂";"Length: " + emoji.length                          // Length: 2// padding with characters that require two code units
'"' + 'ABCDE'.padStart(9, '🙂') + '"' // "🙂🙂ABCDE"
'"' + 'ABCDE'.padStart(10, '🙂') + '"' // "🙂🙂�ABCDE"
// padding with unicode values
'"' + 'ABCDE'.padStart(9, '\ud83d\ude42') + '"' // "🙂🙂ABCDE"
'"' + 'ABCDE'.padStart(10, '\ud83d\ude42') + '"' // "🙂🙂�ABCDE"

Here lies our loyal smiley face with code unit length of two.

As long as the padding hits both code unit values, all is good. But once we only pad with one code unit, there goes an unknown character.

We can try it directly with the emoji or we can use the unicode value for each code unit. The result is the same. Again, nothing we can really do, since this is a valid string sequence by any measure.

So again I should emphasize not to use those pesky two code unit characters for the padding. If you want to actually display them, that is. If not, knock yourselves out, by any means.

As the previous one — also this article is on point and short. Not much to talk about really. But thank you for your attention anyways. And as always — see you in the next article.




NFT is an Educational Media House. Our mission is to bring the invaluable knowledge and experiences of experts from all over the world to the novice. To know more about us, visit

Recommended from Medium

7 Tricks For Working With JavaScript Objects

Smarter and Faster Angular Development with Nx

The Vanilla JavaScript Component

Background Geolocation v3

The Power of Memento Design Pattern in JavaScript

How to stake ZTG tokens to 🧊 Iceberg Nodes 🧊 and get rewards!

A deep analysis of functions in JavaScript.

Build SpaceX fan site using GraphQL with React and Apollo Client -1

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Jakub Korch

Jakub Korch

Web enthusiast, programmer, husband and a father. Wannabe entrepreneur. You name it.

More from Medium

Have you heard of Application Frameworks…?

My Journey with DLithe Bootcamp(.NET Full Stack Week 3(Feb7- Feb12)

Why You Should Learn JavaScript Even in 2022

Back to the basics Javascript Var, Let,.