この記事で分かること
- JavaScriptの変数とは何か
- 変数の宣言方法（
varの基本） - 初期値の代入と複数宣言の書き方
- 変数名の命名規則と注意点
- ローカル変数とグローバル変数の違い
- スコープ（有効範囲）の仕組み
変数とは、値や式を一時的に保存しておくための「箱」のようなものです。
変数を使うことでコードが読みやすくなり、メンテナンス性も大きく向上します。
JavaScriptの変数には、次のような値を格納できます。
- 数値
- 文字列
- 真偽値（
true/false） - オブジェクト（配列、日付、ウィンドウなど）
例：ユーザーが入力した名前を変数に格納して表示する
var res = prompt("名前を入力してください。");
document.write("こんにちは、" + res + "さん。");
変数の記述方法
JavaScriptでは、変数を使う前に宣言するのが一般的です。
変数の宣言には var を使いますが、JavaScriptは初めて登場した単語を変数として扱うため、var を省略することも可能です。
ただし、var の有無で変数の有効範囲（スコープ）が変わるため、基本的には var を付けて宣言することを推奨します。
変数を宣言する
変数の宣言だけを行う場合：
var str;
var myNum;
複数の変数をまとめて宣言することもできます。
var str, myNum;
変数を宣言し、初期値を代入する
宣言と同時に値を代入することもできます。
var str = "ようこそ";
var myNum = 10;
複数の変数を1行でまとめることも可能です。
var str = "ようこそ", myNum = 10;
変数名の付け方（命名規則）
変数名は、命名規則に従っていれば自由に付けられます。
- 使用できる文字：英字、数字、_、$
- 先頭に数字は使えない
- 予約語は使用できない
例：res の代わりに henji としても問題ありません。
変数名は、どんな値が入っているか分かりやすい名前にすると可読性が上がります。
変数の有効範囲（スコープ）
変数には次の2種類があります。
- グローバル変数：関数の外部や複数の関数で有効
- ローカル変数：関数の内部でのみ有効
スコープは、変数がどこまで有効かを示す範囲のことです。
変数宣言のルール：
- 関数内で
varを付けて宣言 → ローカル変数 - 関数外で宣言 → グローバル変数
- 関数内で
varを付けずに宣言 → グローバル変数（非推奨）
例：ローカル変数とグローバル変数の違い
a = 1; // グローバル変数
function showNum() {
var a; // ローカル変数
a = 3;
document.write(a); // → 3
}
showNum();
document.write(a); // → 1
関数内で同名の変数を宣言すると、ローカル変数が優先されます。
JavaScript 初心者におすすめの学習書籍
書籍で学ぶのが向いている人
- 紙の本で体系的に学びたい
- ネット記事だけだと情報が断片的に感じる
- 基本文法を順序立てて理解したい
変数・スコープは JavaScript の基礎であり、書籍ではこれらを体系的に順序立てて学べるため、理解が深まりやすいです。
いちばんやさしい JavaScript の教本
写真や図が多く、手を動かしながら学べる初心者向けの入門書です。
変数の宣言・初期化・スコープなど、基本を丁寧に理解できます。
この本で解決できること：
- JavaScriptの基本文法をやさしく理解できる
- 手を動かしながら学べるため、挫折しにくい
- 「まず動くものを作ってみたい」が実現できる
確かな力が身につく JavaScript「超」入門
JavaScriptの基礎を体系的に学びたい方に向いている入門書です。
変数・スコープの仕組みを深く理解し、実務レベルの基礎力を身につけられます。
この本で解決できること：
- JavaScriptの基礎を体系的に学び直せる
- 実務で使えるレベルの基礎力が身につく
- 現代的なコードの書き方が理解できる
動画で理解を深めたい方へ（Udemy講座）
変数・スコープは JavaScript の基礎中の基礎ですが、実際のコード例を見ながら学ぶと理解が一気に深まります。
Udemy では、初心者向けに丁寧に解説された動画講座が多数あります。
初心者のためのJavaScript 完全入門
変数・関数・スコープなど、JavaScriptの基礎を体系的に学べる人気講座です。
実際の画面操作を見ながら学べるため、初心者でも理解しやすい構成になっています。
この講座で解決できること：
- 変数・スコープの仕組みを視覚的に理解できる
- DOM操作やイベント処理まで一気に学べる
- 初心者がつまずきやすいポイントを動画で理解できる
→ 初心者のためのJavaScript 完全入門（Udemy）
超JavaScript 完全ガイド 2026
基礎から応用まで幅広く学べる講座で、変数・スコープの理解をさらに深めたい方に最適です。
この講座で解決できること：
- JavaScriptの基礎〜応用を体系的に理解できる
- 現代的なコードの書き方が身につく
- 実務で必要な知識をまとめて習得できる
体系的に学びたい方へ（スクールという選択肢）
変数・スコープは理解できても、DOM操作・イベント処理・非同期処理に進むと、独学では急に難しく感じることがあります。
こうした段階で「質問できる環境」があると、理解スピードが大きく変わります。
独学でつまずきやすいポイント
- コードの意図が理解できない
- スコープの仕組みで混乱しやすい
- コードレビューを受ける機会がない
- 学習の順番に自信が持てない
スクールでは、プロの講師が学習ロードマップを作成し、つまずきやすい部分を丁寧にサポートしてくれます。
「効率よく学びたい」「質問しながら進めたい」という方に向いています。
無料相談で得られるメリット
- あなたのレベルに合わせた学習計画を作成してくれる
- 独学でつまずきやすい部分を事前に教えてくれる
- 学習方法の改善点をプロがアドバイス
- エンジニア転職を視野に入れたキャリア相談も可能
JavaScript を効率よく学びたい方には、未経験からエンジニアを目指せる
DMM WEBCAMP の学習コースも選択肢のひとつです。
変数に関するよくある質問（FAQ）
var を省略してもいい？
省略するとグローバル変数になってしまうため、基本的には var を付けて宣言することを推奨します。
変数名に日本語は使える？
技術的には可能ですが、可読性や保守性の観点から英字で命名するのが一般的です。
ローカル変数とグローバル変数の違いは？
ローカル変数は関数内でのみ有効、グローバル変数はスクリプト全体で有効です。
複数の変数を1行で宣言してもいい？
問題ありませんが、可読性のために1行1変数を推奨するケースもあります。
まとめ
- 変数は値を保存するための「箱」
varを使って宣言するのが基本- 変数名は命名規則に従う
- スコープは「変数が有効な範囲」
- ローカル変数とグローバル変数の違いを理解することが重要
