JavaScriptで文字列の各文字をアルファベット順にN文字分シフトする方法
JavaScriptで文字列の各文字をN文字分シフトするには?
英字のみで構成された文字列が与えられたとき、その各文字を、英語のアルファベット順でN文字後ろの文字に置き換える処理を考えます。
例えば n = 1 の場合、「a」は「b」、「b」は「c」というように1つずつ後ろへずらします。末尾の「z」だけは一つ先の「a」に折り返す(ラップアラウンドする)点に注意しましょう。
この仕組みは、古典的な暗号手法として知られる「シーザー暗号(Caesar cipher)」と同じものです。
具体例
入力文字列が「crazy」、シフト数が n = 1 の場合、期待される出力は次のとおりです。
alphabeticShift(inputString) = "dsbaz"
実装コード
const str = 'crazy';
const alphabeticShift = (str = '', n = 1) => {
let arr = [];
for(let i = 0; i < str.length; i++) {
arr.push(String.fromCharCode((str[i].charCodeAt() + n)));
}
let res = arr.join("").replace(/{/g, 'a');
return res;
};
console.log(alphabeticShift(str));
コードの解説
- charCodeAt():各文字をUnicodeのコードポイント(数値)に変換します。小文字の「a」〜「z」は連続したコード(97〜122)を持っています。
- String.fromCharCode():数値のコードポイントを再び文字へ変換します。これにより、文字コードにnを加算するだけで「n文字後のアルファベット」が得られます。
- replace(/{/g, 'a'):「z」(コード122)に1を加えると「{」(コード123)になってしまうため、これを「a」へ置き換えて折り返しを処理しています。
実行結果
dsbaz
より汎用的な実装(任意のnに対応)
上記のコードは「z」からの折り返しを単純な置換で処理しているため、n = 1 以外の値では正しく動作しません。任意のシフト数に対応させたい場合は、剰余演算(%)を使う方法がおすすめです。
const alphabeticShift = (str = '', n = 1) => {
return str.replace(/[a-z]/g, c =>
String.fromCharCode((c.charCodeAt() - 97 + n) % 26 + 97)
);
};
console.log(alphabeticShift('crazy', 1)); // "dsbaz"
console.log(alphabeticShift('xyz', 2)); // "zab"この実装では、文字コードから基準値である「a」のコード(97)を引いて0〜25の範囲に正規化し、26で割った余りを求めることで、どれほど大きなnでも自動的にアルファベットの範囲内で折り返せるようになっています。
-
JavaScriptのループを停止する方法|clearInterval()の使い方を解説
JavaScriptでsetInterval()によって繰り返し実行されている処理(ループ)を停止したい場合は、clearInterval()を使用します。setInterval()は指定した間隔ごとに関数を繰り返し呼び出すメソッドですが、そのままでは無限に処理が続いてしまいます。そこで、あらかじめ戻り値として取得したタイマーIDをclearInterval()に渡すことで、ループを任意のタイミングで止めることができます。コード例以下は、一定回数スクロール処理を繰り返した後にループを停止するサンプルコードです。<!DOCTYPE html> <html lang="
-
【JavaScript】ドキュメント全体のHTMLを文字列として取得する方法を解説
Webページのソースコード全体を取得して処理したい場面は、デバッグや動的なコンテンツ操作など、JavaScript開発では意外と多くあります。この記事では、ドキュメント全体のHTMLを文字列として取得する方法を、具体的なコード例とともにわかりやすく解説します。 innerHTMLプロパティを使った取得方法 ドキュメント全体のHTMLを文字列として取得するには、document.documentElementのinnerHTMLプロパティを利用します。 document.documentElement.innerHTML; document.documentElementはHTML文書のルート要