JavaScriptで数字をゼロパディング(ゼロ埋め)する方法
2026/09/15
JavaScriptで予め桁数を決めておいて、桁数未満の場合は0で埋めたい場合の対応方法をメモ。
対応方法
推奨対応方法
console.log(String(1).padStart(5, '0')); // 00001 console.log(String(15).padStart(5, '0')); // 00015 console.log(String(777).padStart(8, '0')); // 00000777
古めの対応方法
console.log(zeroPadding(1)); // 00001
console.log(zeroPadding(15)); // 00015
console.log(zeroPadding(777, 8)); // 00000777
function zeroPadding(num, digit = 5){
if (!num || !digit || num.length === digit) {
return num;
}
// 空文字をつけてString型の変換
num += '';
for (let i = num.length; i < digit; i++) {
num = '0' + num;
}
return num;
}
リファレンス
String.prototype.padStart()
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/padStart
参考サイト
関連記事
-
-
JavaScriptのIntersectionObserverを利用して指定した要素が表示されているか確認する方法
ブラウザ上で指定した要素が表示されているかチェックし、表示されている場合は何らか ...
-
-
構造化データ(JSON-LD形式)をJavaScriptで動的に描写する方法
あるサイトに構造化データをJSON-LD形式で出力させたかった。ただ、当該環境で ...
-
-
バニラJS対応(jQuery非依存)の通知(トースト)系ライブラリ「Notyf」の利用方法
以前に通知(トースト)系ライブラリ「Toastr」の利用方法をメモしたが、こちら ...
-
-
クロスドメイン環境のiframeで子フレームから親フレームに値を渡す方法
クロスドメインの環境でiframeを使用しており、子フレーム側から親フレーム側に ...
-
-
jQueryで要素を移動する方法のまとめ
jQueryで要素を移動する際、insertBefore / insertAft ...