логотип PurpleSchool
логотип PurpleSchool

Как работает метод padEnd() - JavaScript

Автор

Виталий Котов

Метод padEnd() заполняет текущую строку другой строкой до заданной длины.

// объявление строки
let string1 = "CODE";

// добавление "*" в конец заданной строки
// пока длина заполненной строки не достигнет 10
let paddedString = string1.padEnd(10, "*");

console.log(paddedString);

// Вывод в консоль: CODE******

Синтаксис padEnd()

Синтаксис метода padEnd() следующий:

str.padEnd(targetLength, padString);

Где str - это строка.

Параметры padEnd()

Метод padEnd() принимает два параметра:

  • targetLength
    • Длина конечной строки после заполнения текущей строки.
  • padString (необязательно) - строка, которой следует заполнить текущую строку. Значение по умолчанию - " ".

Примечание:

  • Если padString слишком длинная, она будет усечена, чтобы соответствовать targetLength.
  • Если targetLength < str.length, строка возвращается без изменений.

Возвращаемое значение padEnd()

Возвращает строку указанной targetLength с padString, примененным к концу текущей строки.

Примечание: операторы присваивания, такие как + и +=, настоятельно рекомендуется использовать вместо метода padEnd().

Примеры

Пример 1: Использование метода padEnd()

// объявление строки
let string1 = "CODE";

// добавление "$" в конец заданной строки
// пока длина последней заполненной строки не достигнет 10
let paddedString1 = string1.padEnd(10, "$");

console.log(paddedString1);

Вывод в консоль:

CODE$$$$$$

В приведенном выше примере мы присвоили строковое значение "CODE" в string1 и использовали метод padEnd() для вставки символа "$" в конец string1. Внутри метода мы также передали 10 в качестве targetLength.

Таким образом, метод возвращает конечную строку "CODE$$$$$$" длиной 10.

Пример 2: Использование padString с несколькими символами в padEnd()

// объявление строки
let string1 = "CODE";

// добавление «JavaScript» в конец строки
// пока длина дополненной строки не достигнет 17

let paddedString2 = string1.padEnd(17, "JavaScript");

console.log(paddedString2);

Вывод в консоль:

CODEJavaScriptJav

В приведенном выше примере мы передали несколько символов "JavaScript" в padEnd() и присвоили возвращаемое значение paddedString2.

Метод добавляет "JavaScript" к концу "CODE" до тех пор, пока длина конечной строки не станет равной 17. Таким образом, paddedString2 возвращает конечную строку "CODEJavaScriptJav", длина которой равна 17.

Пример 3: Использование длинной строки padString в padEnd()

// объявление строки
let string1 = "CODE";

// переданная padString усекается, чтобы соответствовать целевой длине
paddedString3 = string1.padEnd(10, "ABCDEFGHIJKL");

console.log(paddedString3);

Вывод в консоль:

CODEABCDEF

В приведенном выше примере мы передали "ABCDEFGHIJKL" в качестве padString. Метод padEnd() усекает заданную padString так, чтобы длина строки после заполнения соответствовала упомянутой targetLength (10).

Таким образом, string1.padEnd(10, "ABCDEFGHIJKL") возвращает конечную строку "CODEABCDEF", длина которой равна 10.

Стрелочка влевоКак работает метод padStart() - JavaScriptКак работает метод matchAll() - JavaScriptСтрелочка вправо

Постройте личный план изучения Javascript до уровня Middle — бесплатно!

Javascript — часть карты развития Frontend

  • step100+ шагов развития
  • lessons30 бесплатных лекций
  • lessons300 бонусных рублей на счет

Бесплатные лекции

Все гайды по Javascript

Как работает метод trim() - JavaScriptКак работает метод toUpperCase() - JavaScriptКак работает метод toLowerCase() - JavaScriptКак работает метод substring() - JavaScriptКак работает метод startsWith() - JavaScriptКак работает метод split() - JavaScriptКак работает метод slice() - JavaScriptКак работает метод search() - JavaScriptКак работает метод replaceAll() - JavaScriptКак работает метод replace() - JavaScriptКак работает метод repeat() - JavaScriptКак работает метод padStart() - JavaScriptКак работает метод padEnd() - JavaScriptКак работает метод matchAll() - JavaScriptКак работает метод match() - JavaScriptКак работает метод localeCompare() - JavaScriptКак работает свойство length - JavaScriptКак работает метод lastIndexOf() - JavaScriptКак работает метод indexOf() - JavaScriptКак работает метод includes() - JavaScriptКак работает метод fromCodePoint() - JavaScriptКак работает метод fromCharCode() - JavaScriptКак работает метод endsWith() - JavaScriptКак работает метод concat() - JavaScriptКак работает метод codePointAt() - JavaScriptКак работает метод charCodeAt() - JavaScriptКак работает метод charAt() - JavaScript
Итератор в JavaScript
try...catch в JavaScriptError в JavaScript
Событие wheel в JavaScriptСобытие unload в JavaScriptСобытие touch в JavaScriptСобытие submit в JavaScriptСобытие scroll в JavaScriptСобытие reset в JavaScriptМетод .preventDefault() в JavaScriptСобытие mouseover в JavaScriptСобытие mouseout в JavaScriptСобытие load в JavaScriptСобытие keyup в JavaScriptСобытие keydown в JavaScriptСобытие invalid в JavaScriptСобытие input в JavaScriptСобытийная модель Event в JavaScriptОбъект события Event в JavaScriptСобытие DOMContentLoaded в JavaScriptСобытие dblclick в JavaScriptСобытие click в JavaScriptСобытие change в JavaScriptСобытие beforeunload в JavaScript
Как работает метод some() - JavaScriptКак работает метод reverse() - JavaScriptКак работает метод reduce() - JavaScriptКак работает метод map() - JavaScriptКак работает метод isArray() - JavaScriptКак работает метод indexOf() - JavaScriptКак работает метод includes() - JavaScriptКак работает метод from() - JavaScriptКак работает метод forEach() - JavaScriptКак работает метод flatMap() - JavaScriptКак работает метод flat() - JavaScriptКак работает метод findIndex() - JavaScriptКак работает метод find() - JavaScriptКак работает метод filter() - JavaScriptКак работает метод every() - JavaScriptМассивы в JavaScript
Открыть базу знаний

Лучшие курсы по теме

изображение курса

Основы JavaScript

Антон Ларичев
иконка часов12 бесплатных уроков
иконка звёздочки рейтинга4.8
Backend
Frontend
Mobile
изображение курса

TypeScript с нуля

Антон Ларичев
иконка часов21 бесплатный урок
иконка звёздочки рейтинга4.7
Backend
Frontend
Mobile
изображение курса

Next.js - с нуля

Антон Ларичев
иконка часов23 бесплатных урока
иконка звёздочки рейтинга4.7
Frontend