JavaScript を使って文字列をキャメルケースに変換する

Beginner

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

はじめに

この実験では、JavaScript を使って文字列をキャメルケースに変換する方法を学びます。キャメルケースは、プログラミングで使用される命名規則であり、複数語の識別子は、最初の単語を除いて各単語が大文字で始まり、それらの間にスペースやアンダースコアがない書き方で記述されます。この実験で提供されている toCamelCase() 関数は、正規表現と配列メソッドを使って文字列をキャメルケースに変換します。

これは Guided Lab です。学習と実践を支援するためのステップバイステップの指示を提供します。各ステップを完了し、実践的な経験を積むために、指示に注意深く従ってください。過去のデータによると、この 初級 レベルの実験の完了率は 100%です。学習者から 100% の好評価を得ています。

キャメルケース文字列変換

文字列をキャメルケースに変換するには、次の手順に従います。

  1. ターミナル/SSH を開き、コーディングの練習を始めるために node と入力します。
  2. 適切な正規表現を使って String.prototype.match() を使って文字列を単語に分割します。
  3. Array.prototype.map(), Array.prototype.slice(), Array.prototype.join(), String.prototype.toLowerCase()、および String.prototype.toUpperCase() を使って単語を結合し、各単語の先頭文字を大文字にします。
  4. 以下に示す toCamelCase 関数を使って変換を行います。
const toCamelCase = (str) => {
  const words =
    str &&
    str.match(
      /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
    );
  const capitalizedWords =
    words &&
    words.map(
      (word) => word.slice(0, 1).toUpperCase() + word.slice(1).toLowerCase()
    );
  const camelCaseString = capitalizedWords && capitalizedWords.join("");
  return (
    camelCaseString &&
    camelCaseString.slice(0, 1).toLowerCase() + camelCaseString.slice(1)
  );
};

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

toCamelCase("some_database_field_name"); //'someDatabaseFieldName'
toCamelCase("Some label that needs to be camelized");
//'someLabelThatNeedsToBeCamelized'
toCamelCase("some-javascript-property"); //'someJavascriptProperty'
toCamelCase("some-mixed_string with spaces_underscores-and-hyphens");
//'someMixedStringWithSpacesUnderscoresAndHyphens'

まとめ

おめでとうございます!あなたはキャメルケース文字列の実験を完了しました。あなたの技術を向上させるために、LabEx でさらに多くの実験を練習することができます。