質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.37%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

818閲覧

JavaScript 文字列を構成する文字の位置を表示したいです。

mimino2525

総合スコア1

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2021/06/17 03:12

編集2021/06/17 09:47

前提・実現したいこと

文字列「文字列HelloWorld」から「HelloWorld」を構成するそれぞれの文字が何番目に存在するかを表示するプログラムを作っています。
しかし、下記のコードでは重複している文字の番号が一緒になってしまうのでそれを解決したいです。
また、consoleが多く無駄が多く感じるのでfor等を使って短くする方法もあれば教えてください。

該当のソースコード

JavaScript

html

1<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4 <meta charset="utf-8"> 5 </head> 6 <body> 7 <script> 8 var string = "文字列HelloWorld" 9 10 console.log('H:', string.indexOf("H"), '番') 11 console.log('e:', string.indexOf("e"), '番') 12 console.log('l:', string.indexOf("l"), '番') 13 console.log('l:', string.indexOf("l"), '番') 14 console.log('o:', string.indexOf("o"), '番') 15 console.log('W:', string.indexOf("W"), '番') 16 console.log('o:', string.indexOf("o"), '番') 17 console.log('r:', string.indexOf("r"), '番') 18 console.log('l:', string.indexOf("l"), '番') 19 console.log('d:', string.indexOf("d"), '番') 20 </script> 21 </body> 22</html>

補足情報(FW/ツールのバージョンなど)

Brackets

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

int32_t

2021/06/17 03:20 編集

'o' や 'l' の出力はどうなって欲しいのでしょうか? また、string = "Ho Hello World" だとどういう結果になって欲しいですか?
m.ts10806

2021/06/17 03:20

コードのマークダウンができていませんので、他の質問や回答を参考に調整を。
mimino2525

2021/06/17 07:00

回答ありがとうございます。最初の'o'は7番、二番目の'o'は9番と表示したいです。lも同様に最初は5番、二番目は6番、最後は11番で表示したいです
mimino2525

2021/06/17 10:09

m.ts108006 >> コードの方見やすく調整しました。
guest

回答2

0

  • 「文字列HelloWorld」から「HelloWorld」を見つける
  • 見つかった「HelloWorld」のそれぞれの文字が、「文字列HelloWorld」の何文字目にあるか表示する(「HelloWorld」の順番通り)

ということをしたいのだと想定して回答いたします。

重複している文字の番号が一緒になってしまう原因としては、indexOfメソッドが、一番左の文字から一文字ずつ順番に見て行って、「一番最初に見つかった場所の番号(インデックス)を返す」からです。
"Hello World"の中に、"l"は2つあって、1つ目は3文字目、2つ目は4文字目ですが、indexOfメソッドでは一番最初の"l"の場所が返ってくるので、何度実行しても結果は変わらないわけですね。

今回は、

  • まず「HelloWorld」という文字列が含まれる場所を探す
  • その最初の文字の番号に1ずつ足していけば、全ての文字の番号が分かる

ことを利用して作ってみました。

Javascript

1let string = "文字列HelloWorld"; 2let pattern = "HelloWorld"; 3// 「文字列HelloWorld」の何文字目から「HelloWorld」が始まるか(インデックスなので、1番最初の文字は「0」) 4let index = string.search(new RegExp(pattern)); 5 6for (let i = 0; i < pattern.length; i++) { 7 console.log(pattern.charAt(i) + ":" + (index + i + 1) + "番"); 8}

投稿2021/06/17 04:01

編集2021/06/17 04:20
hallen0225

総合スコア587

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

mimino2525

2021/06/18 03:26

なるほど。ありがとうございました!コード参考にさせて頂きます。
guest

0

ベストアンサー

コードが上手くカッコ良く表示できていないですね。このように表示できればカッコイイし見やすいですよね?

html

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4<meta charset="utf-8"> 5</head> 6<body> 7<script> 8var string = "文字列HelloWorld" 9 10console.log('H:', string.indexOf("H"), '番') 11console.log('e:', string.indexOf("e"), '番') 12console.log('l:', string.indexOf("l"), '番') 13console.log('l:', string.indexOf("l"), '番') 14console.log('o:', string.indexOf("o"), '番') 15console.log('W:', string.indexOf("W"), '番') 16console.log('o:', string.indexOf("o"), '番') 17console.log('r:', string.indexOf("r"), '番') 18console.log('l:', string.indexOf("l"), '番') 19console.log('d:', string.indexOf("d"), '番') 20</script> 21</body> 22</html>

次からやり方を調べて、このように表示して頂けると助かります(いやでも質問する方も大変ですよね。)

さてご質問にお答えしていきます。

しかし、下記のコードでは重複している文字の番号が一緒になってしまうのでそれを解決したいです。

まず、重複している文字の番号(=インデックス)がなんで一緒になるのは、string.indexOf(searchElement)が、文字列を前からチェックして一番最初に見つけたsearchElementの文字の番号を返すからです。だから2つめ以降のその後ろの方にある文字列はみつからないですよね?

実を言うと、string.indexOfは2つめの引数を取ることができて、string.indexOf(searchElement, fromIndex)と取ることができて、このfromIndexのところに検索開始するインデックスを指定すると、その場所から文字の検索を開始してくれます。

詳しくわこちらを見てください

さて、 もう一つの質問ですが、

また、consoleが多く無駄が多く感じるのでfor等を使って短くする方法もあれば教えてください

これは、しっかりfor文やif文を学ばれると自ずと書けるようになると思います。また、私が直接動くコードを書くと、「質問者が書いたコード」というより、「私が書いたコード」となりますので、この辺は質問者御自身でまずfor文やifを書いてみてください。もしそこで間違ってたり、上手く動かないときにまた、ご質問してくださると良いでしょう(そのときは、質問のコードも綺麗に表示してくださいね?)

ループを書く手掛りのみのこしておきます。

javascript

1const HelloWorldArray = ["H", "e", "l", "l", "o", "W","o","r", "l", "d"];

のように、HelloWorldの文字の配列をつくってから、配列の要素をループをまず作ってみてください。それから、じっくり自分で考えてみてください。

投稿2021/06/17 04:10

nobkz

総合スコア320

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

mimino2525

2021/06/18 03:24

できました!こんな感じでしょうか? ```html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> </head> <body> <script> var a=0 var string = "文字列HelloWorld" const HelloWorldArray =['H','e','l','l','o','W','o','r','l','d'] mojinuki(string) function mojinuki(str){ for(i=0; i<HelloWorldArray.length; i++) { a =str.indexOf(HelloWorldArray[i],a+1) console.log(HelloWorldArray[i], str.indexOf(HelloWorldArray[i],a), '番') } } </script> </body> </html> ```
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.37%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問