2021年3月13日

データ型

JavaScript の値は常に特定の型です。例えば、文字列や数値です。

JavaScript には8つの基本的なデータ型があります。ここでは基本を学び、次のチャプターでそれらの詳細について話しましょう。

なお、変数はどんなデータでも入れることができます。変数はある時点では文字列で、その後数値を設定することができます:

// エラーなし
let message = "hello";
message = 123456;

このようなことができるプログラミング言語は “動的型付け” と呼ばれ、データ型はありますが、変数はそのどれにもバインドされないことを意味します。

数値

let n = 123;
n = 12.345;

数値 型は整数と浮動小数点両方に使われます。

数値に関する多くの操作があります、 e.g. 乗算 *, 除算 /, 加算 +, 減算 - など。

通常の数値に加えて、これらのタイプに属する “特別な数値型” もあります。: Infinity-InfinityNaN.

  • Infinity は数学的な無限大 ∞ を表します。どの値よりも大きい特別な値です。

    ゼロによる除算でそれを得ることができます。:

    alert( 1 / 0 ); // 無限大

    もしくは、単にコードに直接書くこともできます:

    alert( Infinity ); // 無限大
  • NaN は計算上のエラーを表します。正しくないもしくは未定義の数学的な操作の結果です。例:

    alert( "not a number" / 2 ); // NaN, このような除算は誤りです

    NaN は粘着性です。NaN 以降はどのような操作をしても NaN になります:

    alert( "not a number" / 2 + 5 ); // NaN

    そのため、数学的な表現の中のどこかに NaN がある場合、結果全体に伝搬します。

算術演算子は安全です

JavaScriptでは数学をするのは安全です。ゼロによる除算、数値ではない文字列を数値として扱う、など何でもできます。

スクリプトは致命的なエラー(“死”)で止まることはありません。 最悪の場合でも NaN という結果になります。

特別な数値は正式には “数値” 型に所属します。もちろん、常識では数値ではありませんが。

チャプター 数値 でより数値の動作について見ていきます。

BigInt

JavaScript では、“数値” 型は (253-1) (つまり 9007199254740991) より大きい、あるいは負値であれば -(253-1) より小さい整数を表現することができません。これらは内部表現に起因する技術的な制限です。

ほとんどの目的ではこれで十分ですが、場合によっては非常に大きな数が必要になります。例えば暗号化やマイクロ秒の精度のタイムスタンプです。

BigInt 型は任意の長さの整数を表現するために、最近言語に追加された型です。

BigInt の値は整数値の末尾に n を追加することで作成されます:

// 末尾の "n" は BigInt を意味します
const bigInt = 1234567890123456789012345678901234567890n;

BigInt の数値はめったに必要とされないのでここでは説明しませんが、別のチャプター BigInt で記載しています。このような大きな数値が必要なときは参照してください。

互換性の問題

現時点では、BigInt は Firefox/Chrome/Edge/Safari でサポートされていますが、IE ではサポートされていません。

MDN BigInt compatibility table で、どのバージョンのブラウザがサポートしているか確認できます。

文字列

JavaScriptの文字列は引用符で囲む必要があります。

let str = "Hello";
let str2 = 'Single quotes are ok too';
let phrase = `can embed ${str}`;

JavScriptでは3種類の引用符があります。

  1. ダブルクォート: "Hello".
  2. シングルクォート: 'Hello'.
  3. バッククォート: `Hello`.

ダブル/シングルクォートは “シンプルな” 引用符です。JavaScriptの中ではそれらに違いはありません。

バッククォートは “拡張機能” の引用符です。変数を ${…} の中にラップすることで、変数を埋め込み文字列の中で表現することができます。たとえば:

let name = "John";

// 変数が埋め込まれた場合
alert( `Hello, ${name}!` ); // Hello, John!

// 式が埋め込まれた場合
alert( `the result is ${1 + 2}` ); // 結果は 3

${…} の中の表現は評価され、結果は文字列の一部になります。そこには何でも置くことができます: name のような変数、1 + 2 のような算術表現、またはより複雑なものを書くこともできます。

これはバッククォートでのみ可能なことに留意してください。他のクォートはこのような埋め込みは許容しません!

alert( "the result is ${1 + 2}" ); // 結果は ${1 + 2} です(ダブルクォートは何もしません)

チャプター文字列 で、より深く文字列の説明をします。

character 型はありません

言語によっては、1文字のための特別な “文字” 型があります。たとえば、C言語やJavaでは、それは char です。

JavaScriptではこのような型はありません。string 型の1つなだけです。文字列は単一の文字または複数の文字から構成されます。

boolean (論理型)

boolean 型は2つの値だけを持ちます: truefalse

この型は通常 yes/no の値を格納するために使われます: true は “yes” を意味し、 false は “no, 正しくない” を意味します。

例:

let nameFieldChecked = true; // yes, 名前フィールドはチェックされている
let ageFieldChecked = false; // no, 年齢フィールドは未チェック

Boolean 値は比較の結果としても使われます:

let isGreater = 4 > 1;

alert( isGreater ); // true (比較結果は "yes" です)

後ほどチャプター論理演算子でbooleanのより詳細を説明します。

“null” 値

特殊な null 値は上で述べたどの型にも属しません。

それは自身の別の型を形成し、null 値だけを含みます。

let age = null;

JavaScriptでは、 null は他の言語のような “存在しないオブジェクトへの参照” または “null へのポインタ” ではありません。

それは、 “無し”、“空” または “不明な値” と言った意味を持つ特別な値です。

上のコードは、 age は何らかの理由で不明な値もしくは空であることを述べています。

“undefined” 値

特殊な値 undefined も別に扱われます。null のように、それ自身の型を持ちます。

undefined の意味は “値は代入されていません” です。

もしも変数は宣言されているが代入されていない場合、その値は正確には undefined です:

let x;

alert(x); // "undefined" を表示

技術的にはどの変数にも undefined を代入することができます。

let age = 100;

// 値を undefined に変更
age = undefined;

alert(age); // "undefined"

…しかし、そのようにするのは推奨されません。一般的には、 “空” や “不明な値” と言った用途では null を使い、undefined は変数が割り当てられているか、もしくは似たような確認のために使います。

オブジェクトとシンボル

object 型は特殊です。

他のすべての型は、値は1つのもの(文字列, 数値, または何でも)だけを含むので、“プリミティブ” と呼ばれます。対照的に、オブジェクトはデータのコレクションやより複雑なエンティティを格納するために使われます。

その重要性から、オブジェクトに関してはプリミティブについて詳しく学んだ後に、チャプターオブジェクトで扱います。

symbol 型はオブジェクトの一意な識別子を作るのに使われます。完全性のためにここで言及していますが、オブジェクトの後で勉強するのがよいでしょう。

typeof 演算子

typeof 操作は、引数の型を返します。異なる型の値を別々に処理したい、または素早くチェックしたいときに役立ちます。

これは2つの形式の構文をサポートします:

  1. 演算子として: typeof x.
  2. 関数スタイル: typeof(x).

言い換えると、それは括弧があってもなくても動作します。結果は同じです。

typeof x の呼び出しは型名の文字列を返します。:

typeof undefined // "undefined"

typeof 0 // "number"

typeof 10n // "bigint"

typeof true // "boolean"

typeof "foo" // "string"

typeof Symbol("id") // "symbol"

typeof Math // "object"  (1)

typeof null // "object"  (2)

typeof alert // "function"  (3)

最後の3行については追加の説明が必要かもしれません:

  1. Math は数学的な操作を提供する組み込みオブジェクトです。チャプター数値で学ぶでしょう。ここでは、単にオブジェクトとしての例です。
  2. typeof null の結果は "object" です。これは間違っています。これは typeof において、公式に認められているエラーで、互換性のために維持されています。もちろん、null はオブジェクトではありません。それは自身の別の型をもつ特殊な値です。なので、繰り返しますがそれは言語のエラーです。
  3. alert は言語の機能なので、typeof alert の結果は "function" です。我々は次のチャプターで function を勉強します。そして、言語の中には特別な “function” 型がないことがわかるでしょう。function はオブジェクト型に属します。しかし typeof はそれらを別々に扱います。正式にはそれは正しくありませんが、実際にはとても便利です。

サマリ

JavaScriptには7つの基本型があります。

  • number あらゆる種類の数値: 整数または浮動小数点
  • bigint は任意の長さの整数値のための型
  • string 文字列。文字列は1つかより多くの文字を持ち、別の1文字型はありません。
  • boolean true/false
  • null 不明な値 – 単一の値 null を持つスタンドアロン型
  • undefined 未割り当て値 – 単一の値 undefined を持つスタンドアロン型
  • object より複雑なデータ構造
  • symbol 一意な識別子

typeof 操作は変数にどの型が格納されているかを知ることができます。

  • 2つの形式: typeof x or typeof(x).
  • "string" のように型の名前の文字列を返します。
  • null"object" を返します – それは言語のエラーで、実際はオブジェクトではありません。

次のチャプターではプリミティブ値について集中し、それらに精通した後オブジェクトに進みます。

タスク

重要性: 5

このスクリプトの出力はどうなるでしょう?

let name = "Ilya";

alert( `hello ${1}` ); // ?

alert( `hello ${"name"}` ); // ?

alert( `hello ${name}` ); // ?

バッククォートは ${...} の中の式を文字列に埋め込みます。

let name = "Ilya";

// 式は数字の1です
alert( `hello ${1}` ); // hello 1

// 式は文字列の "name" です
alert( `hello ${"name"}` ); // hello name

// 式は変数で、そこに埋め込まれます
alert( `hello ${name}` ); // hello Ilya
チュートリアルマップ

コメント

コメントをする前に読んでください…
  • 自由に記事への追加や質問を投稿をしたり、それらに回答してください。
  • 数語のコードを挿入するには、<code> タグを使ってください。複数行の場合は <pre> を、10行を超える場合にはサンドボックスを使ってください(plnkr, JSBin, codepen…)。
  • 記事の中で理解できないことがあれば、詳しく説明してください。