.net column
.NET開発者のためのブログメディア

データ取得のイメージ

JavaScriptでのreplaceを使った文字列置換方法を紹介|replaceでの文字列置換方法を学ぼう!

2020年09月26日

SE
JavaScriptでは関数を利用した文字列の置換方法があることを知りましたが、具体的な方法を教えてください。

PM
かしこまりました。ここではreplace関数を利用した文字列置換方法を見ていきましょう。

JavaScriptの繰り返し処理 – for文の使い方とは?


今回は、JavaScriptの繰り返し構文である、for文の使い方について説明します。
例えば、1から10まで繰り返し処理をしたり、配列の要素数分繰り返し処理したい場面があると思います。
for文の使い方をマスターすれば、繰り返し処理が効率的に実現できます。

JavaScriptのfor文の使い方に興味のある方はぜひご覧ください。

基本的な使い方

JavaScriptのfor文の基本的な使い方を紹介します。
以下のように記述します。

 

実際のソースコードを見てみましょう。

実行結果は以下のようになります。

JavaScriptのfor文はこのように記述します。

配列に対するfor文

JavaScriptでは配列要素の繰り返し処理にfor文が使用できます。

実際のソースコードを見てみましょう。

実行結果は以下のようになります。

配列.lengthで、配列の要素数が取得できます。
0 ~ 配列要素数-1 までの要素を繰り返し処理で出力しています。

また、配列ではfor-of文で繰り返し処理が行えます。
実際のソースコードを見てみましょう。

実行結果は以下のようになります。

lengthを使用することなく、配列要素の繰り返し処理が実現できています。
このように、JavaScriptでは配列要素の繰り返し処理にfor文が使用できます。

for-in文

JavaScriptではオブジェクトの繰り返し処理にfor-in文が使用できます。
見た目はfor-ofとよく似ていますので、間違えないように注意してください。

実際のソースコードを見てみましょう。

実行結果は以下のようになります。

 

このように、JavaScriptではオブジェクトの繰り返し処理にfor-in文が使用できます。
ちなみに、配列に対してfor-in文を使用すると以下のようになります。

実行結果は以下のようになります。

実行エラーにはなりませんが、配列のインデックスが出力されます。

break

JavaScriptでは、for文のブロックを抜けるには”break”を使用します。

実際のソースコードを見てみましょう。

実行結果は以下のようになります。

iが3になったらbreakすることで、for文のブロックを抜けていることが分かります。
このように、JavaScriptではfor文のブロックを抜けるには”break”を使用します。

continue

JavaScriptでは、for文のブロックをスキップするには”continue”を使用します。

実際のソースコードを見てみましょう。

実行結果は以下のようになります。

iが3の場合に、continueを実行することでfor文のブロックをスキップします。
このように、JavaScriptではfor文のブロックをスキップするには”continue”を使用します。

forEach

JavaScriptでは、forEach文で繰り返し処理が行えます。
forEach文は配列の繰り返し処理にだけ使用できます。

実際のソースコードを見てみましょう。

実行結果は以下のようになります。

配列の要素数分のデータが出力されていることが分かります。

また、JavaScriptではラムダ式である”アロー演算子”を使って、forEachメソッドを記述することができます。
実際のソースコードを見てみましょう。

実行結果は以下のようになります。

配列の要素数分のデータが出力されていることが分かります。
こちらの方がシンプルですね。

また、配列のインデックスも取得したい場合は以下のように記述します。

実行結果は以下のようになります。

 

このように、JavaScriptではforEach文で繰り返し処理が行えます。

SE
マッチする文字列を指定することもできるんですね。

PM
他にも文字列置換の関数がありますので、色々とコードを書いてマスターしてください。

JavaScriptでreplaceを使って文字列置換してみよう

いかがでしたでしょうか。
JavaScriptでのreplace関数を使った文字列置換方法について説明しました。

 

replace関数を使用することで、以下のようなことができます。
・最初にマッチする文字列のみを置換
・マッチするすべての文字列を置換
・最後にマッチする文字列のみを置換

 

また、マッチする文字列を別の関数に渡すこともできます。
ぜひご自身でソースコードを書いて、理解を深めてください。


.NET分野でのキャリアアップをお考えの方は、現在募集中の求人情報をご覧ください。

また、直接のエントリーも受け付けております。

エントリー(応募フォーム)

Search

Popular

reccomended

Categories

Tags

Jobs