2022年11月1日

データ型

JavaScriptの値は常に特定の型を持ちます。例えば、文字列や数値などです。

JavaScriptには8つの基本データ型があります。ここでは、それらを概説し、次の章ではそれぞれについて詳しく説明します。

変数には任意の型を格納できます。例えば、変数はある時点では文字列で、その後は数値を格納することができます。

// no error
let message = "hello";
message = 123456;

JavaScriptのように、このようなことを許可するプログラミング言語は、「動的型付け」と呼ばれます。これは、データ型は存在しますが、変数はそれらのいずれにも束縛されないことを意味します。

数値

let n = 123;
n = 12.345;

数値型は、整数と浮動小数点数の両方を表します。

数値には、乗算*、除算/、加算+、減算-など、多くの演算があります。

通常の数値に加えて、このデータ型に属する「特殊な数値」と呼ばれるものがあります:Infinity-InfinityNaNです。

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

    ゼロで除算した結果として得られます。

    alert( 1 / 0 ); // Infinity

    または、直接参照することもできます。

    alert( Infinity ); // Infinity
  • NaNは計算エラーを表します。これは、間違った、または未定義の数学演算の結果です。例えば、

    alert( "not a number" / 2 ); // NaN, such division is erroneous

    NaNは「粘着性」があります。NaNに対するそれ以上の数学演算は、NaNを返します。

    alert( NaN + 1 ); // NaN
    alert( 3 * NaN ); // NaN
    alert( "not a number" / 2 - 1 ); // NaN

    そのため、数学式にNaNがあると、それが結果全体に伝播します(例外は1つだけです:NaN ** 01です)。

数学演算は安全です

JavaScriptでは、数学を行うことは「安全」です。ゼロで割ったり、数値以外の文字列を数値として扱ったりなど、何でもできます。

スクリプトは致命的なエラー(「死ぬ」)で停止することはありません。最悪の場合、結果としてNaNが得られます。

特殊な数値は正式には「数値」型に属します。もちろん、これらは、この単語の一般的な意味での数値ではありません。

数値の扱い方については、数値の章で詳しく説明します。

BigInt

JavaScriptでは、「数値」型は、(253-1)(つまり9007199254740991)より大きい、または負の場合は-(253-1)より小さい整数値を安全に表すことができません。

厳密に言うと、「数値」型はより大きな整数(最大1.7976931348623157 * 10308)を格納できますが、安全な整数範囲±(253-1)外では、すべての数字が固定64ビットストレージに収まらないため、精度エラーが発生します。そのため、「近似」値が格納される場合があります。

たとえば、これらの2つの数値(安全な範囲のすぐ上)は同じです。

console.log(9007199254740991 + 1); // 9007199254740992
console.log(9007199254740991 + 2); // 9007199254740992

つまり、(253-1)より大きいすべての奇数は、「数値」型にはまったく格納できません。

ほとんどの場合、±(253-1)の範囲で十分ですが、暗号化やマイクロ秒精度のタイムスタンプなど、非常に大きな整数の範囲全体が必要になる場合があります。

任意の長さの整数を表すために、BigInt型が最近言語に追加されました。

BigInt値は、整数の末尾にnを追加することによって作成されます。

// the "n" at the end means it's a BigInt
const bigInt = 1234567890123456789012345678901234567890n;

BigInt数値はめったに必要とされないため、ここでは説明しませんが、別の章BigIntを設けました。そのような大きな数値が必要な場合は、それをお読みください。

互換性の問題

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

どのバージョンのブラウザがサポートされているかを知るには、 * MDN * BigInt互換性テーブルを確認できます。

文字列

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

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

JavaScriptには、3種類の引用符があります。

  1. 二重引用符: "Hello"
  2. 単一引用符:'Hello'
  3. バッククォート:`Hello`

二重引用符と単一引用符は「単純な」引用符です。 JavaScriptでは、それらの間に実質的に違いはありません。

バッククォートは「拡張機能」引用符です。 $ {…}で囲むことにより、変数と式を文字列に埋め込むことができます。たとえば、

let name = "John";

// embed a variable
alert( `Hello, ${name}!` ); // Hello, John!

// embed an expression
alert( `the result is ${1 + 2}` ); // the result is 3

$ {…}内の式が評価され、結果が文字列の一部になります。 nameのような変数、1 + 2のような算術式、またはもっと複雑なものを入れることができます。

これはバッククォートでのみ実行できることに注意してください。他の引用符には、この埋め込み機能がありません!

alert( "the result is ${1 + 2}" ); // the result is ${1 + 2} (double quotes do nothing)

文字列については、文字列の章で詳しく説明します。

文字型はありません。

一部の言語では、単一文字に特別な「文字」型があります。たとえば、C言語とJavaでは「char」と呼ばれます。

JavaScriptには、そのような型はありません。 string型が1つだけあります。文字列は、ゼロ文字(空)、1文字、または複数文字で構成されます。

真偽値(論理型)

真偽値型には、truefalseの2つの値しかありません。

この型は、yes / no値を格納するためによく使用されます。trueは「はい、正しい」を意味し、falseは「いいえ、正しくない」を意味します。

例えば

let nameFieldChecked = true; // yes, name field is checked
let ageFieldChecked = false; // no, age field is not checked

ブール値は、比較の結果としても得られます

let isGreater = 4 > 1;

alert( isGreater ); // true (the comparison result is "yes")

真偽値については、論理演算子の章で詳しく説明します。

「null」値

特別なnull値は、上記のいずれの型にも属していません。

これは、null値のみを含む独自の型を形成します

let age = null;

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

これは、「何もない」、「空」、または「値が不明」を表す特別な値です。

上記のコードは、ageが不明であることを示しています。

「undefined」値

特別な値undefinedも際立っています。 nullと同様に、独自の型を作成します。

undefinedの意味は「値が割り当てられていない」です。

変数が宣言されているが割り当てられていない場合、その値はundefinedです。

let age;

alert(age); // shows "undefined"

技術的には、undefinedを変数に明示的に割り当てることができます。

let age = 100;

// change the value to undefined
age = undefined;

alert(age); // "undefined"

…しかし、それを行うことはお勧めしません。通常、nullを使用して変数に「空」または「不明」の値を割り当てますが、undefinedは割り当てられていないもののデフォルトの初期値として予約されています。

オブジェクトとシンボル

object型は特別です。

他のすべての型は「プリミティブ」と呼ばれます。これは、それらの値に1つのもの(文字列、数値など)しか含めることができないためです。対照的に、オブジェクトはデータのコレクションとより複雑なエンティティを格納するために使用されます。

それほど重要であるため、オブジェクトは特別な扱いに値します。プリミティブについて詳しく学んだ後、オブジェクトの章でそれらを扱います。

symbol型は、オブジェクトの一意の識別子を作成するために使用されます。完全を期すためにここで言及する必要がありますが、オブジェクトを知るまで詳細は延期します。

typeof演算子

typeof演算子は、オペランドの型を返します。これは、異なる型の値を異なる方法で処理したい場合、または簡単なチェックを行いたい場合に役立ちます。

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"です。これは、JavaScriptの初期の頃から公式に認められているtypeofのエラーであり、互換性のために維持されています。確かに、nullはオブジェクトではありません。これは、独自の個別の型を持つ特別な値です。 typeofの動作はここでは間違っています。
  3. typeof alertの結果は "function"です。これは、alertが関数であるためです。次の章では関数を学習しますが、JavaScriptには特別な「関数」型がないこともわかります。関数はオブジェクト型に属します。ただし、typeofはそれらを異なる方法で処理し、 "function"を返します。これもJavaScriptの初期の頃から来ています。技術的には、このような動作は正しくありませんが、実際には便利な場合があります。
typeof(x)構文

別の構文:typeof(x)に遭遇するかもしれません。 typeof xと同じです。

はっきり言うと、typeofは演算子であり、関数ではありません。ここの括弧はtypeofの一部ではありません。これは、数学的グループ化に使用される種類の括弧です。

通常、このような括弧には(2 + 2)などの数式が含まれていますが、ここでは1つの引数(x)のみが含まれています。構文的には、typeof演算子とその引数の間にスペースを空けないようにすることができます。一部の人々はそれを好みます。

typeof x構文の方がはるかに一般的ですが、typeof(x)を好む人もいます。

まとめ

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

  • 7つのプリミティブデータ型
    • numberあらゆる種類の数値:整数または浮動小数点数。整数は±(253-1)によって制限されます。
    • bigint任意の長さの整数。
    • string文字列の場合。文字列にはゼロ以上の文字を含めることができ、個別の単一文字型はありません。
    • booleantrue / falseの場合。
    • null不明な値の場合-単一の値nullを持つスタンドアロン型。
    • undefined未割り当ての値の場合-単一の値undefinedを持つスタンドアロン型。
    • symbol一意の識別子の場合。
  • そして1つの非プリミティブデータ型
    • objectより複雑なデータ構造の場合。

typeof演算子を使用すると、変数にどの型が格納されているかを確認できます。

  • 通常はtypeof xとして使用されますが、typeof(x)も可能です。
  • "string"などの型の名前を含む文字列を返します。
  • null"object" を返しますが、これは言語のエラーであり、実際にはオブジェクトではありません。

次の章では、プリミティブ値に焦点を当て、それらに精通したら、オブジェクトに進みます。

タスク

重要度: 5

スクリプトの出力は何ですか?

let name = "Ilya";

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

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

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

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

let name = "Ilya";

// the expression is a number 1
alert( `hello ${1}` ); // hello 1

// the expression is a string "name"
alert( `hello ${"name"}` ); // hello name

// the expression is a variable, embed it
alert( `hello ${name}` ); // hello Ilya
チュートリアルマップ

コメント

コメントする前にこれを読んでください…
  • 改善の提案がある場合は、コメントする代わりに、GitHub issue を送信するか、プルリクエストを送信してください。
  • 記事の内容が理解できない場合は、詳しく説明してください。
  • 短いコードを挿入するには <code> タグを使用し、複数行の場合は <pre> タグで囲み、10行を超える場合はサンドボックス(plnkrjsbincodepenなど)を使用してください。