数値を指定した桁数の表記にする

指定した桁数（文字数）に調整する

数値を指定した桁数（文字数）の表記にするときはpadStartメソッドを使います。
このメソッドは第1パラメータに文字数、第2パラメータに加える文字を指定します。

以下の例では変数number1〜number4に入っている数値に対して、padStartメソッドで指定した桁数になるよう調整してconsole.logメソッドで出力します。

JavaScript コード例

let number1 = 1;
let number2 = 301;
let number3 = 15550;
let number4 = 220001;

console.log(number1.toString().padStart( 5, '0')); // '00001'
console.log(number2.toString().padStart( 5, '0')); // '00301'
console.log(number3.toString().padStart( 5, '0')); // '15550'
console.log(number4.toString().padStart( 5, '0')); // '220001'

padStartメソッドはStringオブジェクトのメソッドなので、実行する前にtoStringメソッドで文字列に変換します。
また、変数number3とnumber4のようにすでに桁数（文字数）が達しているときは特に何もせず、そのまま戻り値になります。

浮動小数点数に対しても同じように実行することができますが、小数点も1文字にカウントして調整をします。

JavaScript コード例

let number1 = 0.1;
let number2 = 0.09;

console.log(number1.toString().padStart( 5, '0')); // '000.1'
console.log(number2.toString().padStart( 5, '0')); // '00.09'

負の数に対しては一度文字列に変換する性質上、そのまま実行するとうまくいきません。

JavaScript コード例

let number1 = -1;
let number2 = -100;

console.log(number1.toString().padStart( 5, '0')); // '000-1'
console.log(number2.toString().padStart( 5, '0')); // '0-100'

そのため、負の値についてはMath.absメソッドで絶対値を取得した上でpadStartメソッドを実行することで意図した値に整形することができます。

JavaScript コード例

let number1 = -1;
let number2 = -100;

// Math.absメソッドで絶対値を取得する
number1 = Math.abs(number1);
number2 = Math.abs(number2);

console.log('-' + number1.toString().padStart( 5, '0')); // '-00001'
console.log('-' + number2.toString().padStart( 5, '0')); // '-00100'

こちらの記事は役に立ちましたか？

コメントありがとうございます！
運営の参考にさせていただきます。