JavaScript

レシピ

数値

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

数値を指定した桁数の表記に整える方法について解説します。

この記事のポイント

  • 数値の前に「0」を加えて桁数の表記を揃える
  • 表記を調整した数値の方は文字列(String)になる

指定した桁数(文字数)に調整する

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

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

コード例

var number1 = 1;
var number2 = 301;
var number3 = 15550;
var 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メソッドで文字列に変換します。
また、変数number3number4のようにすでに桁数(文字数)が達しているときは特に何もせず、そのまま戻り値になります。

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

コード例

var number1 = 0.1;
var number2 = 0.09;

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

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

コード例

var number1 = -1;
var number2 = -100;

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

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

コード例

var number1 = -1;
var 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'

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

ありがとうございます。
もしよろしければ、あわせてフィードバックや要望などをご入力ください。

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