JavaScript метод String.prototype.padEnd()

Определение и применение

JavaScript метод padEnd() позволяет дополнить текущую строку, начиная с её конца (справа) с помощью пробельного символа (по умолчанию), или заданной строкой, таким образом чтобы результирующая строка достигла заданной длины.

Индексы и длины здесь измеряются в кодовых единицах UTF-16. Например, "😀".length равно 2; разрезание по индексу может разделить суррогатную пару. Исходная строка не изменяется.

Поддержка браузерами

Спецификация: ecma262

Поддерживается во всех основных браузерах с 2018 года.

ВсеКомпьютерыМобильные

Совместимостьjavascript.builtins.String.padEnd
Возможность	Компьютеры					Мобильные
Возможность	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on iOS	Samsung Browser	WebView Android	WebView on iOS
`padEnd`	✓57	✓15	✓48	✓44	✓10	✓57	✓48	✓43	✓10	✓7.0	✓57	✓10

поддерживаетсяс ограниченияминет поддержкинет данных≤31 — не позднее версии 31

JavaScript синтаксис

JavaScript

// дополнить текущую строку пробельными символами до заданной длины
string.padEnd( targetLength );

// дополнить текущую строку переданными символами до заданной длины
string.padEnd( targetLength, padString  );

Спецификация

ECMAScript: String.prototype.padEnd()

Значения параметров

String: справочные сведения
Параметр	Описание
`targetLength`	Целое число, которое определяет длину текущей строки после того как она будет заполнена. Если значение отсутствует, или меньше длины текущей строки, то текущая строка будет возвращена с той же длиной (останется без изменений).
`padString`	Определяет строковое значение, которым будет дополнена текущая строка. При необходимости заданная строка может быть повторена с целью достижения заданной длины для текущей строки, или усечена, если заданная длина строки была достигнута ранее. Значение по умолчанию для этого параметра - " " (`U+0020`).

Примеры, попробуйте сами

В примере «Заполнение справа» показан результат вызова метода.

Заполнение справа

Измените исходную строку или аргумент метода и сравните результат после запуска.

index.html

HTML

<!doctype html>
<html lang="ru">
  <head>
    <meta charset="UTF-8" />
    <title>Заполнение справа</title>
  </head>
  <body>
    <p>Результат выполнения выводится в консоль.</p>
  </body>
</html>

main.js

JavaScript

var x = 'string' // инициализируем переменную, содержащую строку

console.log(x.padEnd()) // x содержит значение "string"
console.log(x.padEnd(5)) // x содержит значение "string"
console.log(x.padEnd(10)) // x содержит значение "string    "
console.log(x.padEnd(20)) // x содержит значение "string              "

console.log(x.padEnd(10, '.')) // x содержит значение "string...."
console.log(x.padEnd(10, '---')) // x содержит значение "string----"
console.log(x.padEnd(10, 'abc')) // x содержит значение "stringabca"

В следующем примере мы рассмотрим как с помощью методов padEnd() и padStart() подготовить и вывести на консоль значения из массива, выравнивая при этом длину строки конкретного элемента для удобного просмотра и чтения выведенной информации.

В примере «Выравнивание сумм» показан результат вызова метода.

Выравнивание сумм

Измените исходную строку или аргумент метода и сравните результат после запуска.

index.html

HTML

<!doctype html>
<html lang="ru">
  <head>
    <meta charset="UTF-8" />
    <title>Выравнивание сумм</title>
  </head>
  <body>
    <p>Результат выполнения выводится в консоль.</p>
  </body>
</html>

main.js

JavaScript

let array = ['147.13', '20.11', '40.99', '13.06', '255', '189'] // инициализируем переменную, содержащую массив строковых значений
let outputValues = array.map((val) =>
    parseFloat(val) // принимаем строку в качестве аргумента и возвращаем десятичное число
        .toFixed(2) // возвращаем строковое представление числа в нотации с фиксированной запятой (2 знака после запятой)
        .padStart(10) // дополняем слева текущую строку пробельными символами до заданной длины
        .padEnd(14, ' RUR'),
) // дополняем справа текущую строку переданными символами до заданной длины

console.log(outputValues.join('\n'))

// результат вывода будет следующим:

//     147.13 RUR
//      20.11 RUR
//      40.99 RUR
//      13.06 RUR
//     255.00 RUR
//     189.00 RUR