JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptで文字列内の2つ以上の連続スペースを1つのスペースに変換する方法

概要

HTMLの入力欄からユーザーが入力した文字列をJavaScriptで受け取り、その中に含まれる「2つ以上の連続した空白」を検出し、すべて1つのスペースに置き換えるプログラムを作成します。このような処理には正規表現を使うのが最もシンプルで確実な方法です。replace()メソッドの第1引数に正規表現 /\s{2}/g を指定することで、目的の結果を簡単に得られます。

使用する正規表現のポイント

  • \s：半角スペース・タブ・改行などの空白文字にマッチします。
  • {2}：直前のパターンが2回以上連続する場合にマッチします。
  • g（グローバルフラグ）：文字列内のすべての該当箇所を置換対象にします。

サンプルコード

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>REMOVE SPACES</title>
</head>
<body>
<script>
    function removeSpaces() {
        var textInput = insertText.value;
        textInput = textInput.replace(/\s{2}/g, " ");
        insertText.value = textInput;
    }
</script>
<input type="text" id="insertText" value="containin extra space">
<button onclick="removeSpaces()">OK</button>
</body>
</html>

コードの仕組み

removeSpaces()関数は、まずIDがinsertTextの入力欄から現在の値を取得します。続いて replace(/\s{2}/g, " ") により、2つ以上連続する空白をすべて1つのスペースに置き換え、その結果を同じ入力欄へ書き戻します。「OK」ボタンをクリックするとこの関数が実行され、余分なスペースが自動的に整理されます。

実行結果

初期状態では、入力欄に余分なスペースを含むテキストが表示されています。

JavaScriptで文字列内の2つ以上の連続スペースを1つのスペースに変換する方法

「OK」ボタンをクリックすると、連続していたスペースがすべて1つのスペースにまとめられます。

JavaScriptで文字列内の2つ以上の連続スペースを1つのスペースに変換する方法

  1. JavaScriptの正規表現を使って文字列の特定部分を削除する方法

    JavaScriptでは、正規表現（RegExp）と replace() メソッドを組み合わせることで、文字列の中から指定した2つの区切り文字に挟まれた部分を簡単に削除できます。基本的な考え方たとえば、括弧「( )」で囲まれたテキストを削除したい場合は、次のような正規表現パターンを使用します。/ *\([^)]*\) */g — 括弧とその中身、および前後の空白にマッチします。\( と \) — 開き括弧と閉じ括弧そのものにマッチします。[^)]* — 閉じ括弧以外の任意の文字列にマッチします。末尾の g フラグ — 文字列内のすべての該当箇所を置換対象にします。サンプルコード以下は、文字列か

  2. 2台以上のパソコンを1台のモニターに接続する3つの方法

    現在、家庭に2台以上のパソコンがあり、仕事、勉強、ゲーム、ネットサーフィンなどさまざまな用途で使い分けているのは珍しくありません。かつてソフトウェア開発者たちは、世界中のすべての家庭にコンピュータが行き渡るとは想像していませんでしたが、今日ではコンピュータは時計やテレビと同じように、家庭・学校・オフィスにすっかり浸透しています。個人用と仕事用など、複数のパソコンを持っている方も多いのではないでしょうか。 この記事では、「2台以上のパソコンを1台のモニターに接続する方法」をわかりやすく解説します。 パソコンが同じ机の上にあっても、別々の部屋に設置されていても、1組のマウス・キーボード・モニターだ