JavaScriptのデータ型とは？基本から解説

JavaScriptを学習するうえで欠かせない概念のひとつが「データ型」です。
データ型を理解すると、変数にどのような値を扱えるのか、どのような処理が可能なのかが明確になります。

JavaScriptは柔軟な言語であり、他のプログラミング言語と比べてデータ型の扱いが特徴的です。
そのため、基礎を正しく理解しておくことが重要です。

この記事では、JavaScriptのデータ型について基礎から解説します。
Web制作においてよく使用するデータ型や、実務でも役立つ知識まで体系的に紹介します。

なお、JavaScriptの役割や基本構造については、以下の記事で詳しく解説しています。

• JavaScriptの役割と基本構造

JavaScriptのデータ型とは

JavaScriptのデータ型とは、データの種類を表す仕組みのことです。

例えば、以下のように扱う値によって種類が異なります。

• 数値
• 文字列
• 真偽値
• 配列
• オブジェクト

プログラムでは、これらのデータを処理することでWebページの動きを実現します。

例：

let price = 1000;
let name = "商品A";
let isSale = true;

このように、値の種類によって扱い方が変わるため、データ型の理解は非常に重要です。

JavaScriptのデータ型の種類

JavaScriptのデータ型は大きく2つに分類されます。

• プリミティブ型（Primitive）
• オブジェクト型（Object）

それぞれの特徴を理解することで、JavaScriptの仕組みがより明確になります。

プリミティブ型（Primitive）

プリミティブ型は、単一の値を扱うシンプルなデータ型です。

JavaScriptには次の7種類のプリミティブ型があります。

それぞれ順番に見ていきます。

string（文字列）

stringは、文字の並びを扱うデータ型です。

文字列は次のようにクォーテーションで囲みます。

let message = "Hello";
let name = 'JavaScript';

Web制作では次のような用途で頻繁に使用されます。

• テキスト表示
• 入力フォームの値
• HTML要素の内容

number（数値）

numberは、数値を扱うデータ型です。

整数と小数の両方を扱えます。

let price = 1000;
let rate = 1.08;

計算処理などで使用されます。

let total = 1000 + 500;

boolean（真偽値）

booleanは、true または false の2つの値のみを持つデータ型です。

let isLogin = true;
let isEmpty = false;

主に条件分岐で使用されます。

if (isLogin) {
  console.log("ログイン済み");
}

条件分岐については、以下の記事でも詳しく解説しています。

• JavaScriptの基本構文と仕組み

undefined（未定義）

undefinedは、値がまだ設定されていない状態を表します。

let value;
console.log(value); // undefined

変数を宣言しただけで値を代入していない場合に表示されます。

null（空の値）

nullは、意図的に値が存在しないことを示すデータ型です。

let data = null;

undefinedとの違いは次の通りです。

symbol（シンボル）

symbolは、一意の値を生成するデータ型です。

let id = Symbol();

主にオブジェクトのプロパティキーなどで使用されます。

一般的なWeb制作では使用頻度は高くありません。

bigint（ビッグイント）

bigintは、非常に大きな整数を扱うためのデータ型です。

let bigNumber = 9007199254740991n;

通常のnumber型で扱えない大きな整数を扱う場合に使用されます。

オブジェクト型（Object）

JavaScriptでは、プリミティブ型以外はすべてオブジェクトです。

オブジェクトは、複数の値をまとめて管理するデータ型です。

let user = {
  name: "Taro",
  age: 25
};

オブジェクトは次のようなデータ構造を作る際に使用されます。

• ユーザー情報
• 商品情報
• 設定データ

オブジェクトについては、以下の記事で詳しく解説しています。

• JavaScriptのオブジェクトとは？基礎から解説

配列もオブジェクトの一種

JavaScriptでは、配列もオブジェクトの一種です。

let fruits = ["apple", "banana", "orange"];

配列は、複数の値を順番に管理するためのデータ構造です。

例：

console.log(fruits[0]); // apple

配列については、以下の記事で詳しく解説しています。

• JavaScriptの配列とは？基本から理解する

typeofでデータ型を確認する

JavaScriptでは、typeofを使うことでデータ型を確認できます。

typeof "hello";  // string
typeof 100;      // number
typeof true;     // boolean

例：

let value = 10;
console.log(typeof value);

データ型を確認することで、プログラムのエラーを防ぐことができます。

JavaScriptは動的型付け言語

JavaScriptの大きな特徴のひとつが、**動的型付け（Dynamic Typing）**です。

これは、変数の型を事前に決める必要がないという仕組みです。

let value = 10;
value = "Hello";

このように、同じ変数に異なる型の値を代入できます。

柔軟で便利ですが、意図しないバグの原因になることもあります。

データ型を理解する重要性

JavaScriptでは、データ型の理解がプログラムの品質に大きく影響します。

例えば次のような問題が発生する可能性があります。

• 文字列と数値の混在
• nullやundefinedによるエラー
• 型変換のミス

そのため、基礎の段階でデータ型をしっかり理解しておくことが重要です。

まとめ

JavaScriptのデータ型は、プログラムの基本となる重要な概念です。

ポイントをまとめると次の通りです。

• JavaScriptのデータ型は「データの種類」を表す
• データ型は「プリミティブ型」と「オブジェクト型」に分類される
• プリミティブ型は7種類ある
• 配列やオブジェクトは複数の値を扱える
• typeofでデータ型を確認できる

データ型を理解すると、JavaScriptのコードの読み書きが大きく楽になります。

関連記事

• JavaScriptの役割と基本構造
• JavaScriptの変数とは？let・const・varの違い
• JavaScriptの配列とは？基本から理解する
• JavaScriptのオブジェクトとは？基礎から解説
• JavaScriptの関数とは？基本と使い方