JavaScript における文字列を埋める方法

JavaScriptJavaScriptBeginner
今すぐ練習

This tutorial is from open-source community. Access the source code

💡 このチュートリアルは英語版からAIによって翻訳されています。原文を確認するには、 ここをクリックしてください

はじめに

この実験では、JavaScript の pad() 関数を調べます。pad() 関数を使うと、文字列を両端に指定した文字で埋めて、特定の長さにすることができます。これを達成するために、String.prototype.padStart()String.prototype.padEnd() メソッドをどのように使うか学びます。


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") subgraph Lab Skills javascript/variables -.-> lab-28537{{"JavaScript における文字列を埋める方法"}} javascript/data_types -.-> lab-28537{{"JavaScript における文字列を埋める方法"}} javascript/arith_ops -.-> lab-28537{{"JavaScript における文字列を埋める方法"}} javascript/comp_ops -.-> lab-28537{{"JavaScript における文字列を埋める方法"}} end

文字列を埋める関数

指定された文字で文字列を両端に埋めるには、指定された length より短い場合、次の関数を使用します。

const pad = (str, length, char = " ") =>
  str.padStart((str.length + length) / 2, char).padEnd(length, char);

この関数は、String.prototype.padStart()String.prototype.padEnd() を使って、与えられた文字列を両端に埋めます。3番目の引数 char を省略すると、空白文字を既定の埋め文字として使用できます。

以下は、pad() 関数の使い方のいくつかの例です。

pad("cat", 8); // '  cat   '
pad(String(42), 6, "0"); // '004200'
pad("foobar", 3); // 'foobar'

コーディングの練習を始めるには、ターミナル/SSH を開いて node と入力します。

まとめ

おめでとうございます!文字列の埋め込みの実験を完了しました。スキルを向上させるために、LabExでさらに実験を行って練習してください。