JavaScriptで文字列の各文字をインデックス配列を持つオブジェクトにマッピングする方法
問題の概要
文字列が与えられたとき、各文字の出現位置(インデックス)を配列として格納したオブジェクトを作成する関数を実装します。文字列の各文字(要素)がオブジェクトのキーとなり、その文字が出現したインデックスをまとめた配列が値になります。
期待される出力
例えば、入力文字列が以下の場合:
const str = 'cannot';
出力は次のようなオブジェクトになります。
const output = {
'c': [0],
'a': [1],
'n': [2, 3],
'o': [4],
't': [5]
};実装コード
以下が実際の実装コードです。
const str = 'cannot';
const mapString = str => {
const map = {};
for(let i = 0; i < str.length; i++){
if(map.hasOwnProperty(str[i])){
map[str[i]] = map[str[i]].concat(i);
}else{
map[str[i]] = [i];
};
};
return map;
};
console.log(mapString(str));コードの解説
この関数の処理の流れは次のとおりです。
- 空のオブジェクトを用意: 結果を格納するための
mapを初期化します。 - ループで走査:
forループにより、文字列を先頭から1文字ずつ処理します。 - キーの存在チェック:
hasOwnProperty()を使って、その文字がすでにキーとして登録されているかを判定します。 - インデックスの追加: キーが存在すれば
concat()で既存の配列に現在のインデックスを連結し、存在しなければ新しい配列[i]を作成して格納します。
実行結果
コンソールには以下のように表示されます。
{ c: [ 0 ], a: [ 1 ], n: [ 2, 3 ], o: [ 4 ], t: [ 5 ] }このように、同じ文字が複数回出現した場合でも、すべての出現位置が1つの配列に正しく記録されていることが確認できます。この手法は、文字の出現頻度や位置を調べるテキスト解析などにも応用できる汎用的なパターンです。
-
JavaScriptのImage()オブジェクトとは?使い方とサンプルコードを解説
JavaScriptにおけるImage()オブジェクトは、HTMLの<img>要素を表すオブジェクトです。このオブジェクトを使うことで、JavaScriptから動的に画像を生成し、Webページに追加することができます。Image()コンストラクタには、引数として画像の幅と高さをピクセル単位で指定できます。また、生成した画像オブジェクトのsrcプロパティに画像のURLを設定することで、画像を読み込むことが可能です。Image()オブジェクトの基本的な使い方以下は、JavaScriptでImage()オブジェクトを使用するサンプルコードです。コード例<!DOCTYPE html&
-
JavaScriptオブジェクトの内容を文字列として表示する方法
JavaScriptでオブジェクトの内容を文字列形式で画面に表示したい場合、document.getElementById()でHTML要素を取得し、innerHTMLを使って書き出すのが基本的な方法です。オブジェクトを文字列に変換するには、JSON.stringify()メソッドを活用します。 実装手順 まず、表示先となるHTML要素にIDを設定します。次に、JavaScript側でそのIDを指定して要素を取得し、変換した文字列をinnerHTMLに代入します。 コード例 <!DOCTYPE html> <html lang="ja"> <h