JavaScriptで1桁の数字を0埋めして2桁の表示を行う方法について簡単にまとめました。
0埋め表示は日付や時間などで活用できます。
目次
はじめに
2つの方法「padStart()」と「slice()」を紹介します。
方法①：padStart() の使い方
padStart() は、指定した文字列を指定した文字数分まで埋めてくれます。
文字列に標準搭載されている「padStartメソッド」を使用するため、0埋めする数字が数値の場合は文字列に変換する必要があります。
文字列.padStart( 文字数, 文字列 )
「文字数」：文字数を指定
「文字列」：埋める文字列を指定
let num = 5;
console.log( String(num).padStart(2,'0') ); // '0'で埋めて2桁にする
// '05'
num = 15;
console.log( String(num).padStart(2,'0') ); // 2桁の場合は0埋めはしない
// '15'方法②：slice() の使い方
slice()は、引数で指定した位置からの値を切り取ってくれます。
文字列.slice( 数値 )
「数値」：切り取る文字列の開始位置を指定
・引数が正の値→先頭から値を取得
・引数が負の値→末尾から数えた値を取得
let num = 5;
console.log( ('0' + num).slice(-2) ); // 「05」の末尾2桁を取得
// '05'
num = 15;
console.log( ('0' + num).slice(-2) ); // 「015」の末尾2桁を取得
// '15'