JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのpadStart()メソッドとは？文字列の先頭にパディングを追加する方法を解説

padStart()メソッドとは

JavaScriptでは、concat()メソッドを使うことで2つの文字列を連結できます。しかし、元の文字列の先頭に特定の文字列を追加したい場合、最も簡単な方法がstring.padStart()メソッドです。

このメソッドは、単に文字列を先頭に追加するだけでなく、追加後の合計文字数も管理してくれます。引数は2つあり、1つ目は目標となる長さ（length）、2つ目は追加する文字列です。指定された長さに達するまで、2つ目の文字列が元の文字列の先頭に繰り返し追加されます。

構文

string.padStart(length, "string");
  • length：結果として得られる文字列の合計文字数を指定します。
  • string：元の文字列に付加する文字列を指定します。省略した場合はスペースで埋められます。

使用例

<html>
<body>
   <script>
      var str = "the best";
      var st = "Hello";
      document.write(st.padStart(24, " glad to meet you, "));
      document.write("</br>");
      document.write(str.padStart(16, "Tutorix "));
   </script>
</body>
</html>

出力結果

glad to meet you, Hello
Tutorix the best

文字列の長さが指定したlengthより大きい場合

元の文字列の長さが、第1引数で指定したlength以上の場合、パディングは一切行われず、元の文字列がそのまま出力されます。つまり、既存の文字列が切り詰められたり変更されたりすることはありません。

使用例

<html>
<body>
<script>
   var str = "Tutorix is the best e-learning platform best";
   document.write(str.padStart(16, "Tutorix "));
</script>
</body>
</html>

出力結果

Tutorix is the best e-learning platform best

まとめ

padStart()メソッドは、日付や時刻の表示を揃える際（例：「5」を「05」にする）や、固定幅の出力を整形する際などに非常に便利なメソッドです。指定した長さに満たない場合のみ先頭へ文字列を追加し、すでに長さが足りている場合は元の文字列をそのまま返すという挙動を覚えておきましょう。

  1. JavaScriptで文字列を単語に分割できるか判定する方法

    空でない文字列 str と、空でない単語のリストを格納した文字列の配列 arr が与えられます。ここで求められているのは、str を、配列に存在する1つ以上の単語をスペースで区切った並びに分割できるかどうかを判定する関数を作成することです。注意点配列内の同じ単語は、分割の際に何度でも再利用して構いません。配列には重複した単語は含まれていません。例1入力が次の場合を考えてみましょう。const str = applepenapple; const arr = [apple, pen];このときの出力は true になります。その理由は以下の通りです。applepenapple は apple p

  2. JavaScriptで不正な時間文字列（HH:MM:SS）を正規化して修正する方法

    JavaScriptでは、「HH:MM:SS」形式の時間文字列を扱う場面がよくあります。しかし、時間の加算処理などで計算ミスが発生すると、分や秒が60を超えてしまう「壊れた」時間文字列が生成されることがあります。この記事では、そうした不正な時間文字列を正しく正規化する方法を解説します。 課題：壊れた時間文字列とは 今回求められるのは、JavaScriptで「HH:MM:SS」形式の時間文字列を受け取り、必要な修正を加えた上で、正しい時間文字列として返す関数を作成することです。 問題になるのは、加算処理のバグによって、次のような不正な値が含まれてしまうケースです。 MM（分）の部分が60を超え