TypeScriptのオブジェクト(object)型について理解しよう!

TypeScript

TypeScriptのオブジェクト(object)型とは

TypeScriptのオブジェクト型は、プリミティブ型に無いすべての値を表します。

ちなみに、TypeScriptにおけるプリミティブ型は以下の通りです。

  • string
  • number
  • bigint
  • boolean
  • null
  • undefined
  • symbol

以下は、オブジェクト型の変数を宣言する方法です。

let person: object;

person = {
    name: '田中',
    age: 20,
    job: 'teacher'
};

console.log(person); // {
                     //   name: '田中',
                     //   age: 20,
                     //   job: 'teacher'
                     // };

上記の変数personはオブジェクト型の変数なので、プリミティブ型である文字列などを代入すると、エラーが発生します。

person = 'Hello World!' // エラーが発生

また、personオブジェクトは、特定のプロパティを持つオブジェクト型です。もし、personオブジェクトに存在しないプロパティにアクセスしようとすると、エラーが発生します。

person.height // personにheightプロパティが存在しないため、エラーが発生する

上記のようなことはJavaScriptではundefinedが返ってくるだけで問題なく動きますが、型が定められているTypeScriptでは動作しないので注意しましょう。

オブジェクトのプロパティに型を指定する

オブジェクトのプロパティに型を明示的に指定するには、まず、以下の構文でオブジェクトを宣言します。(前項のpersonオブジェクトを使います)

let person: {
    name: string;
    age: number;
    job: string;
};

そして、personオブジェクトを、記述されたプロパティを持つリテラル・オブジェクトに割り当てます。

person = {
    name: '田中';
    age: 20;
    job: 'teacher';
};

また、上記の手順を組み合わせて、オブジェクト型の宣言と代入を同時に行うことも可能です。

let person: {
    name: string;
    age: number;
    job: string;
} = {
    name: '田中';
    age: 20;
    job: 'teacher';
};

Object型とobject型の違い

TypeScriptには、大文字のOを使ったObjectという型もあり、両者の違いを理解することが大切です。

  • Object型:stringやnumber, boolean等、全てのオブジェクトの機能を含む
  • object型:プリミティブ型の機能を含まない

例えば、Object型ではtoString()メソッドやvalueOf()メソッドがあり、どのオブジェクトからもアクセスできるようになっています。

ちなみに、以下で解説している {} はObject型に当たります。

空のオブジェクト {} について

TypeScriptには、{}で表されるオブジェクト型によく似ているempty型があります。

empty型{}は、それ自体に何のプロパティも持たないオブジェクトなので、このようなオブジェクトのプロパティにアクセスしようとすると、TypeScriptはコンパイル時にエラーを出します。

let sampleObject: {};

sampleObject.name = '田中'; // error TS2448: Property 'name' does not exist on type '{}'.

しかし、Object型で宣言されたすべてのプロパティとメソッドにはアクセスすることができます。

let sampleObject: {} = {};

console.log(sampleObject.toString()); // [object Object]

タイトルとURLをコピーしました