How to use padStart & padEnd — ES7

I thought it would be cool if i spent some time researching and learning some ES7 features and share that with you!

Happy new year by the way ☺

You can use an online code editor such as to write these statements in and then open the “web inspector” to see the output in the console.


In incredibly simple terms “padStart" is used to “pad" or “concatenate" a string to the start of another string up to a specified length. So let’s say we have a variable like the below.

let myVar = “6";

We also have another variable below called “myPaddedStartString" which is used to invoke the “padStart" method of the String object to pad the letter “C" to the left of the “myVar" variable until the length of the “myPaddedStartString" method is 10 characters.

let myPaddedStartString = myVar.padStart(10,”C”);

So the output of this would be



So we have 9 letter “C"s to the left or start of the number 6.

You can also pad multiple characters to the start of the initial string, however, if you have multiple characters to pad and the string meets the length given within “padStart" then the remaining characters will be cut off/truncated. Also, the default value for the padstring is a space character but in our example above it is “C". An example of “padStart" is below.

let myVarTwo = “5";let mySecondPadStartString = myVarTwo.padEnd(20,”ABCD");

So the output below would be


As you can see the string is 20 characters however the last “ABCD" has been cut off at “ABC" because the “padStart" length was limited to 20 characters within the “mySecondPadStartString” variable.


PadEnd works the exact same way as “padStart" ,however, the characters are added to the end of the string. An example is below.

let myPadEndVar= "6";let myFinalPadEndString= myPadEndVar.padEnd(20,"ABCD");console.log(myFinalPadEndString);6ABCDABCDABCDABCDABC

Just to end, the browsers that support this are

Chrome 57

Edge 15

Firefox 48

Internet explorer- Nope (what a surprise lol)

Opera 44

Safari 10

Apologies for the short article but I wanted to write a nice short article to get back into the swing of things so I can prepare myself to write longer and more thought out pieces in the future

Dont forget to clap, share and express what you like/didnt like about the article

Happy new year and stay safe!





Software Developer in the UK. With a keen passion for React Native & C#

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

JavaScript Interview Questions


How to Create Comments in JavaScript

Deploy an Angular Application to IIS

Set up a Chromebook for Quasar front-end development

Announcing JIRA Plugin for MSM v2

Weekly Digest 25/2021

Array/Object Destructuring in ES6

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


Software Developer in the UK. With a keen passion for React Native & C#

More from Medium

How to sort with Array.sort()

Introduction to JSON

Passing filter callback in and map callback in Array.filter in JavaScript

Thoughts on Declarative vs Functional Programming and QML/Javascript