変数とデータ型について

JavaScriptでは、変数とデータ型の理解がプログラミングの基礎となります。
このセクションでは、変数の宣言方法、スコープ、ホイスティング、
基本的なデータ型について詳しく説明します。

変数の宣言

JavaScriptでは、変数を宣言するために var, let, const の3つのキーワードがあります。
それぞれのキーワードには異なる特徴があります。

var

var は、JavaScriptで最も古い変数宣言の方法です。
varで宣言された変数は関数スコープを持ちます。

var x = 10;
console.log(x); // 10

varで宣言された変数は、再宣言が可能で、同じスコープ内で複数回宣言してもエラーになりません。

var x = 10;
var x = 20;
console.log(x); // 20

また、varで宣言された変数は、ブロックスコープを無視するため、
意図しない動作を引き起こすことがあります。

if (true) {
var y = 30;
}
console.log(y); // 30

let

let は、ES6(ECMAScript 2015)で導入された変数宣言の方法です。
letで宣言された変数はブロックスコープを持ちます。

let a = 10;
if (true) {
let a = 20;
console.log(a); // 20
}
console.log(a); // 10

letで宣言された変数は再宣言が禁止されています。
同じスコープ内で再宣言するとエラーになります。

let b = 10;
// let b = 20; // エラー

const

const も、ES6で導入された変数宣言の方法です。
constで宣言された変数は定数となり、再代入が禁止されています。
constもブロックスコープを持ちます。

const c = 10;
console.log(c); // 10
// c = 20; // エラー: 再代入禁止

オブジェクトや配列をconstで宣言した場合、その内容を変更することはできますが、
変数自体を再代入することはできません。

const person = { name: "Alice" };
person.name = "Bob"; // これはOK
console.log(person.name); // Bob
// person = { name: "Charlie" }; // エラー: 再代入禁止

変数のスコープ

変数のスコープは、変数がアクセスできる範囲を指します。
JavaScriptには3種類のスコープがあります。

  1. グローバルスコープ: どこからでもアクセスできる変数のスコープ。
  2. 関数スコープ: 関数内でのみアクセスできる変数のスコープ。
  3. ブロックスコープ: ブロック({})内でのみアクセスできる変数のスコープ。

グローバルスコープ

グローバルスコープで宣言された変数は、プログラム全体からアクセスできます。

var globalVar = "I am global";
function showGlobalVar() {
console.log(globalVar);
}
showGlobalVar(); // I am global

関数スコープ

関数スコープで宣言された変数は、その関数内でのみアクセスできます。

function myFunction() {
var functionVar = "I am local to myFunction";
console.log(functionVar);
}
myFunction(); // I am local to myFunction
// console.log(functionVar); // エラー: functionVarは未定義

ブロックスコープ

ブロックスコープで宣言された変数は、そのブロック内でのみアクセスできます。
letconst はブロックスコープを持ちます。

if (true) {
let blockVar = "I am block scoped";
console.log(blockVar); // I am block scoped
}
// console.log(blockVar); // エラー: blockVarは未定義

変数のホイスティング

JavaScriptでは、変数宣言がそのスコープの先頭に持ち上げられる現象をホイスティングと呼びます。
これは、実行時に変数宣言が関数またはスクリプトの先頭に移動するためです。

console.log(hoistedVar); // undefined
var hoistedVar = "I am hoisted";
console.log(hoistedVar); // I am hoisted

letconst はホイスティングされますが、初期化される前にアクセスするとエラーが発生します。

// console.log(hoistedLet); // エラー: hoistedLetは未定義
let hoistedLet = "I am hoisted";
console.log(hoistedLet); // I am hoisted

データ型

JavaScriptには7つの基本的なデータ型があります。

  1. 数値(Number)
  2. 文字列(String)
  3. 真偽値(Boolean)
  4. 未定義(Undefined)
  5. ヌル(Null)
  6. シンボル(Symbol)
  7. ビッグイント(BigInt)

数値(Number)

数値データ型は整数と浮動小数点数を表します。

let num1 = 42;
let num2 = 3.14;

文字列(String)

文字列データ型はテキストデータを表します。
文字列はシングルクォート(')、ダブルクォート(")、またはバッククォート(`)で囲みます。

let str1 = 'Hello';
let str2 = "World";
let str3 = `Hello, ${str1} ${str2}`;
console.log(str3); // Hello, Hello World

真偽値(Boolean)

真偽値データ型は、true または false のいずれかの値を持ちます。

let isTrue = true;
let isFalse = false;

未定義(Undefined)

未定義データ型は、変数が宣言されているが値が設定されていない場合に自動的に割り当てられます。

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

ヌル(Null)

ヌルデータ型は、意図的に空の値を示すために使用されます。

let empty = null;
console.log(empty); // null

シンボル(Symbol)

シンボルデータ型は一意の識別子を表します。
シンボルは主にオブジェクトのプロパティとして使用されます。

let sym1 = Symbol('unique');
let sym2 = Symbol('unique');
console.log(sym1 === sym2); // false

ビッグイント(BigInt)

ビッグイントデータ型は、任意の精度の整数を表します。
ビッグイントは、末尾に n を付けて表します。

let bigInt = 1234567890123456789012345678901234567890n;
console.log(bigInt); // 1234567890123456789012345678901234567890

型変換

JavaScriptでは、データ型を明示的または暗黙的に変換することができます。

明示的な型変換

明示的な型変換は、関数を使用してデータ型を変換します。

let num = 42;
let str = String(num);
console.log(str); // "42"
console.log(typeof str); // string

let bool = Boolean(num);
console.log(bool); // true
console.log(typeof bool); // boolean

暗黙的な型変換

暗黙的な型変換は、JavaScriptが自動的にデータ型を変換することを指します。

let num1 = 10;
let num2 = "20";
let result = num1 + num2;
console.log(result); // "1020"
console.log(typeof result); // string

let bool = 1 == true;
console.log(bool); // true

まとめ

JavaScriptの変数とデータ型は、プログラミングの基礎を形成します。
変数の宣言方法やスコープ、ホイスティングの理解は、正しいコードを書くために重要です。
また、データ型の理解は、データを適切に操作し、型変換を適切に扱うために必要です。
これらの基本的な概念をマスターすることで、より複雑なプログラムを作成するための基盤が築かれます。
次のステップでは、これらの基本概念を応用して、実際のアプリケーション開発に役立てる方法を学びます。