JavaScriptでライセンスキーを整形する方法:ダッシュ区切りと大文字変換の実装
問題
文字列strを第1引数、整数nを第2引数として受け取るJavaScript関数を作成する必要があります。文字列strは英数字とダッシュ(ハイフン)で構成されています。
ダッシュは、文字列内の英数字をグループに分割する役割を果たします。つまり、ダッシュがn個あれば、文字列はn+1個のグループに分割されます。しかし、与えられた文字列内のダッシュは、正しい位置に配置されていない可能性があります。
私たちが目指すのは、各グループの文字数をKに揃えることです。ただし、最初のグループだけは例外で、Kより短くても構いませんが、少なくとも1文字は含まれている必要があります。
この要件を満たすためには、ダッシュを挿入し直す必要があります。さらに、この関数は文字列内のすべての小文字を大文字に変換しなければなりません。
例えば、関数への入力が以下の場合:
const str = '8-4B0t37-k';
const num = 4;
出力は次のようになるべきです:
const output = '84B0-T37K';
出力の解説
文字列strは2つの部分に分割され、それぞれの部分がちょうど4文字ずつになっています。
実装例
この処理を実現するコードは以下の通りです:
const str = '8-4B0t37-k';
const num = 4;
const formatKey = (str = '', num = 1) => {
let acc = '';
let flag = num;
for(let i = str.length - 1; i >= 0; i--){
const char = str.charAt(i);
if(char !== '-') {
if(flag === 0) {
acc = `-${acc}`;
flag = num;
};
acc = `${char.toUpperCase()}${acc}`;
flag -= 1;
};
};
return acc;
};
console.log(formatKey(str, num));
コードの解説
formatKey()関数では、以下の手順で処理を行っています:
文字列を後ろから逆順に走査しています。これは、残りの文字数がnum未満になるケース(最初のグループは正確にnum文字である必要がないため)に対応するためです。
挿入した文字数をカウントし続け、カウントが0になったタイミングでダッシュを挿入し、カウントをnumにリセットします。
出力結果
コンソールへの出力は以下のようになります:
84B0-T37K
-
JavaScriptでオブジェクトを新しい配列に変換する方法
JavaScriptでは、オブジェクトのプロパティやネストされたデータを取り出し、扱いやすい形で新しい配列にフォーマットできます。本記事では、学校(school)オブジェクトに含まれる生徒情報を、文字列形式の配列へ変換する実践的なコード例を紹介します。 ポイントとなるテクニック このサンプルでは、以下の2つのJavaScript機能を活用しています。 分割代入(Destructuring assignment):オブジェクトから特定のプロパティを簡潔に取り出す構文です。 for...of ループ:配列内の各要素を順番に処理するために使用します。 コード例 <!DOCTYPE html
-
JavaScriptでEnterキーの押下イベント(keypress)を検出する方法
Webアプリケーションでは、ユーザーがEnterキーを押したタイミングで特定の処理を実行したい場面がよくあります。例えば、検索フォームで入力後に自動で検索を実行したり、チャット画面でメッセージを送信したりするケースです。 JavaScriptでは、onkeypressイベントとEnterキーのキーコード「13」を組み合わせることで、簡単にEnterキーの押下を検出できます。 基本的な実装方法 まず、HTML側のinput要素にonkeypress属性を設定し、キーが押されたときに呼び出す関数を指定します。 onkeypress=yourFunctionName 次に、JavaScript側でイ