[JavaScript] 超入門：データ型を基礎から理解！文字列・数値・配列・オブジェクトをやさしく解説

MARKLEAPS

2025.06.18

JavaScriptでWebサイトに動きをつけたり、アプリを作ったりするには、まず「データの扱い方」を理解することが大切です。

このページでは、JavaScriptでよく使う4つの基本データ型（文字列・数値・配列・オブジェクト）と、その基本的な使い方をやさしく解説します。

難しい用語はできるだけ避けながら、実際に使うシーンをイメージできるように紹介していくので、ぜひ手を動かしながら読み進めてみてください。

文字列（String）を扱う

名前やメッセージなど、「文字」を扱うときは文字列（String）型を使います。
文字列は ‘（シングルクオート）や “（ダブルクオート）で囲んで書きます。

const name = "Taro";
const greeting = 'こんにちは';

1 2	const name = "Taro"; const greeting = 'こんにちは';

よくある操作

const text = "JavaScript";

console.log(text.length);       // 文字数を調べる → 10
console.log(text.toUpperCase()); // 大文字に変換 → "JAVASCRIPT"
console.log(text.includes("Script")); // 特定の文字列を含むか → true

const text = "JavaScript";

console.log(text.length); // 文字数を調べる → 10

console.log(text.toUpperCase()); // 大文字に変換 → "JAVASCRIPT"

console.log(text.includes("Script")); // 特定の文字列を含むか → true

テンプレート文字列（テンプレートリテラル）を使うと、変数を埋め込んだ文章を簡単に書けます。

const name = "Hanako";
console.log(`こんにちは、${name}さん！`);

1 2	const name = "Hanako"; console.log(`こんにちは、${name}さん！`);

※これらのコードは、ブラウザの「開発者ツール → Console」などで実行結果を確認できます。

数値（Number）を使う

金額やスコア、数量などの「数」は数値型（Number）で扱います。

const price = 1200;
const quantity = 3;
const total = price * quantity;

console.log(total); // → 3600

const price = 1200;

const quantity = 3;

const total = price * quantity;

console.log(total); // → 3600

よくある操作

const num = 10;

console.log(num + 5);    // 足し算 → 15
console.log(num - 3);    // 引き算 → 7
console.log(num * 2);    // 掛け算 → 20
console.log(num / 2);    // 割り算 → 5

const num = 10;

console.log(num + 5); // 足し算 → 15

console.log(num - 3); // 引き算 → 7

console.log(num * 2); // 掛け算 → 20

console.log(num / 2); // 割り算 → 5

文字列と数値を間違って足すと、意図しない結果になります。

const a = "100";
const b = 50;
console.log(a + b); // → "10050"（数値ではなく文字列として結合される）

const a = "100";

const b = 50;

console.log(a + b); // → "10050"（数値ではなく文字列として結合される）

配列（Array）でデータをまとめる

複数のデータを「順番つき」でまとめて管理したいときは配列（Array）を使います。

const fruits = ["りんご", "バナナ", "ぶどう"];

1	const fruits = ["りんご", "バナナ", "ぶどう"];

よくある操作

console.log(fruits[0]);         // → "りんご"（0番目を取得）
console.log(fruits.length);     // → 3（要素数）

fruits.push("みかん");          // 配列の末尾に追加
console.log(fruits);           // → ["りんご", "バナナ", "ぶどう", "みかん"]

fruits.splice(1, 1);            // 1番目を削除
console.log(fruits);           // → ["りんご", "ぶどう", "みかん"]

console.log(fruits[0]); // → "りんご"（0番目を取得）

console.log(fruits.length); // → 3（要素数）

fruits.push("みかん"); // 配列の末尾に追加

console.log(fruits); // → ["りんご", "バナナ", "ぶどう", "みかん"]

fruits.splice(1, 1); // 1番目を削除

console.log(fruits); // → ["りんご", "ぶどう", "みかん"]

ループ文（for や forEach など）と組み合わせて、1つずつ処理する場面もよくあります。

オブジェクト（Object）で情報を整理する

オブジェクトは「名前（キー）と値（バリュー）」のセットで情報をまとめます。

const user = {
  name: "Satoshi",
  age: 28,
  isMember: true
};

const user = {

name: "Satoshi",

age: 28,

isMember: true

};

よくある操作

console.log(user.name);     // → "Satoshi"
console.log(user["age"]);   // → 28

user.age = 29;              // 値を変更
user.email = "satoshi@example.com"; // プロパティを追加

console.log(user.name); // → "Satoshi"

console.log(user["age"]); // → 28

user.age = 29; // 値を変更

user.email = "satoshi@example.com"; // プロパティを追加

オブジェクトは「意味のある名前と値」をセットにできるので、複数の情報を1つにまとめて扱うのに便利です。

真偽値（Boolean）で「はい・いいえ」を表す

「～かどうか？」を判断したいときに使うのが、真偽値（Boolean）型です。
値はたったの2つだけで、 true（真） と false（偽） です。

const isLoggedIn = true;
const hasCoupon = false;

1 2	const isLoggedIn = true; const hasCoupon = false;

よくある使い方
Boolean型は、if文などの条件分岐でよく使います。

if (isLoggedIn) { console.log("ようこそ！"); } else { console.log("ログインしてください"); }

1	if (isLoggedIn) { console.log("ようこそ！"); } else { console.log("ログインしてください"); }

比較演算やチェックの結果としても使われます：

console.log(10 > 5); // → true
console.log("a" === "b"); // → false

1 2	console.log(10 > 5); // → true console.log("a" === "b"); // → false

「〇〇かどうか」という情報を扱うときは、Boolean型が基本になります。

JavaScriptの主なデータ型一覧まとめ

データ型	説明	例
文字列（String）	文字の集まり	`'Hello'`
数値（Number）	整数や小数	`123`
配列（Array）	複数の値をまとめたもの	`[1, 2, 3]`
オブジェクト（Object）	名前と値のペア	`{ name: 'Taro' }`
真偽値（Boolean）	「はい／いいえ」を表す	`true` / `false`

JavaScriptは型を自動で判断する

JavaScriptでは、変数の型を明示的に指定する必要はありません。
値を代入すると、自動的にその型が決まります。

typeof でデータ型を調べてみよう

変数の中身が何の型か確認したいときは typeof を使います。

console.log(typeof "hello");     // → string
console.log(typeof 123);         // → number
console.log(typeof true);        // → boolean
console.log(typeof ["a", "b"]);  // → object（注意！配列もobjectと出る）
console.log(typeof null);        // → object（JavaScriptの歴史的な仕様によるものです）