關於 String.padStart() 與 String.padEnd()

前言

  最近發現 String.padStart() 與 String.padEnd() ，抽個空作個學習，在此做個紀錄。

內容

  String.padStart() 與 String.padEnd() 的功能都是填充字串，一個填充在字首，另一個則在字尾，範例如下

const str1 = '5';

console.log(str1.padStart(1, '01'));//5
console.log(str1.padStart(2, '01'));//05
console.log(str1.padStart(3, '01'));//015
console.log(str1.padStart(6, '01'));//010105
//
console.log(str1.padEnd(1, '01'));//5
console.log(str1.padEnd(2, '01'));//50
console.log(str1.padEnd(3, '01'));//501
console.log(str1.padEnd(6, '01'));//501010

這兩個 Function 的參數都是兩個，第一個是"目標字串長度"，第二個則是要填充的字串，範例的第一個都是字串長度"1"，而原本字串的長度也是"1"，所以不會填充任何字串，接著把"目標字串長度"變成"2"會如何?以 String.padStart()  來說會得到"05"，開頭的"0"，其實是要填充的字串的第一個字元，接著長度調成"3"，就會得到"015"，就剛好是要填充的字串加原本的字串，最後把長度調成"6"會怎麼樣呢?會得到"010105"，會看到要填充的字串開始重複， String.padEnd() 的行為與 String.padStart() 一樣，只是將字串填到字尾而已。

參考資料

[ developer.mozilla.org ] String.prototype.padStart()

[ developer.mozilla.org ] String.prototype.padEnd()