[JavaScript]ゼロ埋め(ゼロパディング)の実装方法について

プログラムでコード値などを使っていると規定の桁数に足りない分だけ先頭に 0 を追加して桁数を揃える「ゼロ埋め」を行うことがよくあります。今回はこの「ゼロ埋め(ゼロパディング)」の JavaScript での実装方法について説明していきたいと思います。

ゼロ埋め(ゼロパディング)とは

書式の桁数に満たない数値や文字列を足りない桁数だけ 0 を追加するなどして書式の桁数に揃えることです。

伝票の ID の桁数が 5 桁固定となっている場合、伝票 ID は以下のようにゼロ埋めする必要があります。

伝票 ID : 1 ⇨ 00001
伝票 ID : 99 ⇨ 00099

padStart() 関数は、戻り値の文字列が指定した桁数になるように、現在の文字列を他の文字列を必要に応じて繰り返して延長します。
延長は現在の文字列の先頭から適用されます。

const id = 1;

console.log(id.toString().padStart(5, '0'));
// 00001

ちなみに padEnd() 関数を使用すると文字列の後ろに文字を追加してくれます。

const id = 777;

console.log(id.toString().padEnd(5, '0'));
// 77700

slice() 関数は、元の文字列を変更せず、文字列の一部分を取り出し、それを新しい文字列として返します。
slice() 関数の引数にマイナスの値を設定することでそのマイナスの値の桁数分文字列の終わりから取得することができます。

const id = 99;

console.log(('00000' + id.toString()).slice(-5));
// 00099

JavaScript の小技的な実装方法だったりしますが、あらかじめ知識があるかどうかでプログラミングの作業効率も変わってくるので、こういった実装方法があることをしっかり覚えておきたいですね。