siren.

Tech | Life | Gadget | Manabi | Tools | About

2. JavaScript入門 (変数, データ型)

TechJavaScript

JavaScript

変数とは

変数はデータを格納するための箱です。プログラミングにおいて、変数はデータに名前を付けてそのデータを後で参照または操作するために使用されます。変数にはさまざまなタイプのデータを格納でき、それは文字列、数値、オブジェクト、関数などを格納します。

var, let, const

var、let、const はJavaScriptにおいて変数を宣言するためのキーワードですが、それぞれに特定の挙動やスコープ（変数が参照可能な範囲）があります。

var

var は最も伝統的な変数宣言の方法で、関数スコープを持っています。つまり、var で宣言された変数はその変数が宣言された関数内、およびその関数内のすべてのブロック（if 文、for ループなど）でアクセス可能です。ただし、var はホイスティング（変数宣言がそのスコープの先頭に移動される挙動）の影響を受けやすく、予期せぬバグを引き起こす可能性があるため、現在は推奨されていません。

let

let はES6（ECMAScript 2015）で導入され、ブロックスコープを持ちます。これは、let で宣言された変数はその変数が宣言されたブロック内、および任意の内部ブロックでのみアクセス可能であるということです。これにより、より限定された範囲で変数を使用することができ、var のような予期せぬ挙動を防ぐことができます。

const

const もES6で導入されたキーワードで、let と同様にブロックスコープを持っています。しかし、const で宣言された変数は再代入ができません（不変）。つまり、一度値が割り当てられると、その変数には新しい値を割り当てることができません。これは、プログラム内で変更されない値を持つ変数を宣言するのに適しています。

以下に、それぞれの使用例を示します：

var name = "Yamada"; // 関数スコープ
let age = 25;        // ブロックスコープ
const birthday = "1998-01-01"; // ブロックスコープ、再代入不可

一般的には、可変な値を扱う場合は let を、変更されない値には const を使用することが推奨されます。これにより、プログラムの意図がより明確になり、エラーの発生を防ぐことができます。

データ型とは

javaScriptにはいくつかの基本的なデータ型があります。これらを理解することは、プログラムの動作を正確に把握し、エラーを避けるために不可欠です。以下はJavaScriptにおける主要なデータ型です：

1. 数値（Number）

  • これは整数または浮動小数点数を表します。JavaScriptでは、整数と小数は同じ Number 型に分類されます。
  • 例: let age = 25;、let price = 99.99;

2. 文字列（String）

  • 文字の並びを表し、シングルクォート（'）、ダブルクォート（"）、またはバックティック（`）で囲みます。
  • 例: let name = 'Yamada';、let greeting = "Hello, World!";

3. 真偽値（Boolean）

  • 真（true）または偽（false）のいずれかの値を持ちます。
  • 例: let isStudent = true;、let isFinished = false;

4. オブジェクト（Object）

  • 複数の値をキーと値のペアで格納します。オブジェクトはプロパティとメソッドを持つことができます。
  • 例: let person = { name: 'Yamada', age: 25 };

5. 配列（Array）

  • 順序付きの要素のリストです。配列は0から始まるインデックスでアクセスできます。
  • 例: let colors = ['red', 'green', 'blue'];

6. 関数（Function）

  • JavaScriptでは、関数もデータ型の一つとして扱われます。関数は特定の処理を実行するためのコードのブロックです。
  • 例: function greet() { console.log('Hello!'); }

7. アンディファインド（Undefined）

  • 変数が宣言されているが、値が割り当てられていない場合にこの型が割り当てられます。
  • 例: let x; // xはundefinedです

8. ヌル（Null）

  • ある変数が何の値も持たない（空である）ことを意図的に表します。
  • 例: let y = null;

9. シンボル（Symbol）

  • ES6で導入された、ユニークかつ不変の値です。主にオブジェクトのプロパティのキーとして使用されます。
  • 例: let mySymbol = Symbol('unique');

10. BigInt

  • ES2020で導入された、Number型で扱える範囲を超える大きな整数を扱うための型です。
  • 例: let largeNumber = BigInt(9007199254740991);

それぞれのデータ型は特定の種類のデータを扱うのに適しており、適切に使用することでプログラムの柔軟性と効率性が向上します。また、型変換や型チェックを適切に行うことも重要です。

サンプルコード

数値（Number）

let age = 30; // 整数
let price = 99.99; // 浮動小数点数

文字列（String）

let name = '山田'; // シングルクォート
let greeting = "こんにちは、世界！"; // ダブルクォート
let phrase = `名前は${name}です`; // テンプレートリテラルと変数の埋め込み

真偽値（Boolean）

let isStudent = true; // 真
let hasLicense = false; // 偽

オブジェクト（Object）

let person = {
    name: '山田',
    age: 30,
    greet: function() { console.log("こんにちは!"); }
};

配列（Array）

let colors = ['赤', '緑', '青'];
console.log(colors[0]); // "赤"を表示

関数（Function）

function greet() {
    console.log('こんにちは!');
}
greet(); // "こんにちは!" を表示

アンディファインド（Undefined）

let x;
console.log(x); // undefinedを表示

ヌル（Null）

let y = null;
console.log(y); // nullを表示

シンボル（Symbol）

let mySymbol = Symbol('unique');
let anotherSymbol = Symbol('unique');
console.log(mySymbol === anotherSymbol); // falseを表示。シンボルはユニークです。

BigInt

let largeNumber = BigInt(9007199254740991);
console.log(largeNumber); // 9007199254740991nを表示