javascript
  1. javascript-padstart
PreviousNext

JavaScript padStart()

The JavaScript padStart() method is a string method that is used to pad the current string with another string (repeated, if needed) until the resulting string reaches the given length. The padding is applied from the beginning (left side) of the current string.

Syntax

The syntax for the padStart() method is as follows:

string.padStart(targetLength, padString)
  • targetLength: The length of the resulting padded string.
  • padString: The string to be padded to the current string.

Example

Consider the following example:

let str = 'abc';
str = str.padStart(5, '0');
console.log(str);

Output:

"00abc"

In the above example, we have defined a string str and used the padStart() method to pad it with the '0' character until the length of the resulting string is 5 characters.


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>JavaScript Output</title>
</head>
<body>

<!-- Your JavaScript code goes here -->
<script>
  let str = 'abc';

  // Using padStart method to pad the string with zeros
  str = str.padStart(5, '0');

  // Displaying the result in the HTML document
  document.write('<p>' + str + '</p>');
</script>

</body>
</html>
Try Playground

Explanation

The padStart() method adds a padding string to the current string until the target length is reached. If the target length is already less than or equal to the length of the current string, then no padding is applied.

The padString parameter may be truncated if the number of characters required to complete the padding exceeds the length of the string.

Use

The padStart() method can be used wherever we need to pad a string with a specific character or substring until a certain length is reached. It is commonly used in various scenarios such as:

  • Formatting output to display numbers and dates in a standardized format.
  • Creating fixed-width columns in table data.
  • Aligning the contents of strings in a specific column.

Important Points

The following are some of the important points to note while using the padStart() method:

  • The padStart() method is only available in ES2017 (ES8) and higher.
  • The first argument (targetLength) is required, and the second argument (padString) is optional.
  • If the padString argument is not provided, the space character (" ") is used by default.
  • The padStart() method does not modify the original string; it returns a new string with the padding applied.
  • The padStart() method is also chainable, meaning we can call other methods on the returned padded string.

Summary

In summary, the padStart() method is a useful string method in JavaScript that allows for padding a string to a specific length with a given character or substring. It is commonly used to format output, create fixed-width columns, and align the contents of strings. While using this method, it's important to note the syntax, examples, important points, and use cases, as described above.

localeCompare()padEnd()
Published on: