溝畑です。
JavaScriptでゼロパディングするときってどうしてますか?
調べて出てくる方法のほとんどが、sliceを使ったやり方だと思います。
こんな感じとか・・・。
1 2 3 4 5 6 7 8 9 10 |
const pad = (target, n) => { let zero = '' for (let i = 0; i < n; i++) { zero += '0' } return (zero + target).slice(0 - n) } console.log(pad(22, 4)) // 0022 |
小数点以下はtoFixed()を使えば基本的には大丈夫です。
前にも小数点以下にもゼロパディングが必要になるような書式指定をされると、
これまた面倒です。
toFixed()で後ろにゼロつけて・・・。
小数点で分割して、前ゼロつけて、結合するみたいな。
これも楽になるものがES2017で追加されています。
padStart, padEndです。
そのまんま!後ろはtoFixed()するとして、padStartに焦点を当てます。
padStart
String.prototype.padStart> padStart() メソッドは、結果の文字列が指定した長さになるように、現在の文字列を他の文字列で (必要に応じて繰り返して) 延長します。延長は、現在の文字列の先頭から適用されます。
最初のコードのように、4桁で足りないなら前は0埋めをpadStartでやると・・・。
1 2 |
const pad = (target, n) => String(target).padStart(n, '0') console.log(pad(22, 4)) // 0022 |
第一引数で文字数、第二引数に埋める文字を指定するだけです。
随分と楽になりました。
整数部3桁、小数点以下は4桁のようなフォーマットなら、
1 2 |
const num = 34.41 console.log(num.toFixed(4).padStart(8, '0')) // 034.4100 |
ポイントは、小数点を含めた文字数にすること。
padStartを使って、意外と面倒なゼロパディングを楽にやっちゃいましょう!