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

JavaScriptで空の文字列(空の値)を作成する方法をわかりやすく解説

JavaScriptで空の文字列(空の値)を作成するには、変数に空の文字列リテラル "" を代入するだけです。宣言した変数に何も入っていない状態(undefined)とは異なり、空の文字列はれっきとした「文字列型」の値として扱われます。

以下に、空の文字列を作成して、その値とデータ型を確認する基本的なサンプルコードを示します。

サンプルコード

<html>
   <head>
      <script>
         // 変数を宣言し、空の文字列を代入
         var val;
         val = "";
 
         // 値とデータ型を出力
         document.write("Value: " + val);
         document.write("<br>Type: " + typeof val);
      </script>
   </head>
   <body>
   </body>
</html>

実行結果

Value:
Type: string

コードの解説

このコードでは、まず変数 val を宣言し、そこに空の文字列 "" を代入しています。画面には「Value:」の後に何も表示されませんが、これは変数が空の文字列を持っているためです。

次に typeof 演算子でデータ型を確認すると、「string」と出力されます。つまり、空の文字列も通常の文字列と同じ「文字列型」として認識されていることがわかります。

空の文字列と null・undefined の違い

初心者が混同しやすいポイントとして、空の文字列は nullundefined とは別物である点に注意しましょう。

  • 空の文字列(""):文字列型の値であり、長さ0の文字列。typeof は「string」を返す。
  • null:「値が意図的に存在しない」ことを表す。型は「object」になる。
  • undefined:変数が宣言されただけで値が代入されていない状態。

空の文字列かどうかを判定する方法

実際の開発では、文字列が空かどうかをチェックする場面が多くあります。その場合は length プロパティを使うのが一般的です。

if (val.length === 0) {
   document.write("空の文字列です");
}

このように、JavaScriptで空の文字列を扱う方法を理解しておくと、フォームの入力チェックや初期化処理など、さまざまな場面で役立ちます。

  1. 【JavaScript入門】配列を使ってラジオボタンを動的に生成する方法

    JavaScriptでは、配列のデータをもとにラジオボタンを動的に生成することができます。その際に活用するのが、要素を作成する createElement() メソッドと、作成した要素を画面に追加する appendChild() メソッドです。 サンプルコード 以下は、性別の選択肢を配列で管理し、それを元にラジオボタンを自動生成するコード例です。 <!DOCTYPE html> <html lang=ja> <head> <meta charset=UTF-8> <meta name=viewport content=width=devic

  2. 【JavaScript】ドキュメント全体のHTMLを文字列として取得する方法を解説

    Webページのソースコード全体を取得して処理したい場面は、デバッグや動的なコンテンツ操作など、JavaScript開発では意外と多くあります。この記事では、ドキュメント全体のHTMLを文字列として取得する方法を、具体的なコード例とともにわかりやすく解説します。 innerHTMLプロパティを使った取得方法 ドキュメント全体のHTMLを文字列として取得するには、document.documentElementのinnerHTMLプロパティを利用します。 document.documentElement.innerHTML; document.documentElementはHTML文書のルート要