Typescript-objects

提供:Dev Guides
移動先:案内検索

TypeScript-オブジェクト

  • オブジェクト*は、キーと値のペアのセットを含むインスタンスです。 値は、スカラー値または関数、または他のオブジェクトの配列です。 構文は以下のとおりです-

構文

var object_name = {
   key1: “value1”,//scalar value
   key2: “value”,
   key3: function() {
     //functions
   },
   key4:[“content1”, “content2”]//collection
};

上記のように、オブジェクトにはスカラー値、関数、配列やタプルなどの構造を含めることができます。

例:オブジェクトリテラル表記

var person = {
   firstname:"Tom",
   lastname:"Hanks"
};
//access the object values
console.log(person.firstname)
console.log(person.lastname)

コンパイル時に、JavaScriptで同じコードが生成されます。

上記のコードの出力は次のとおりです-

Tom
Hanks

TypeScriptタイプテンプレート

JavaScriptでオブジェクトリテラルを次のように作成したとします-

var person = {
   firstname:"Tom",
   lastname:"Hanks"
};

オブジェクトに値を追加する場合、JavaScriptを使用して必要な変更を加えることができます。 後でpersonオブジェクトに関数を追加する必要があるとします。これがこれを行う方法です。

person.sayHello = function(){ return "hello";}

Typescriptで同じコードを使用すると、コンパイラーはエラーを返します。 これは、Typescriptでは、具象オブジェクトに型テンプレートが必要だからです。 Typescriptのオブジェクトは、特定の型のインスタンスでなければなりません。

これは、宣言でメソッドテンプレートを使用することで解決できます。

例:Typescript Typeテンプレート

var person = {
   firstName:"Tom",
   lastName:"Hanks",
   sayHello:function() {  } //Type template
}
person.sayHello = function() {
   console.log("hello "+person.firstName)
}
person.sayHello()

コンパイル時に、JavaScriptで同じコードが生成されます。

上記のコードの出力は次のとおりです-

hello Tom

オブジェクトをパラメーターとして関数に渡すこともできます。

例:関数パラメーターとしてのオブジェクト

var person = {
   firstname:"Tom",
   lastname:"Hanks"
};
var invokeperson = function(obj: { firstname:string, lastname :string }) {
   console.log("first name :"+obj.firstname)
   console.log("last name :"+obj.lastname)
}
invokeperson(person)

この例では、オブジェクトリテラルを宣言しています。 関数式は、personオブジェクトを渡して呼び出されます。

コンパイル時に、次のJavaScriptコードが生成されます。

//Generated by typescript 1.8.10
var person = {
   firstname: "Tom",
   lastname: "Hanks"
};

var invokeperson = function (obj) {
   console.log("first name :" + obj.firstname);
   console.log("last name :" + obj.lastname);
};

invokeperson(person);

その出力は次のとおりです-

first name :Tom
last name :Hanks

匿名オブジェクトをその場で作成して渡すことができます。

例:匿名オブジェクト

var invokeperson = function(obj:{ firstname:string, lastname :string}) {
   console.log("first name :"+obj.firstname)
   console.log("last name :"+obj.lastname)
}
invokeperson({firstname:"Sachin",lastname:"Tendulkar"});

コンパイル時に、次のJavaScriptコードが生成されます。

//Generated by typescript 1.8.10
var invokeperson = function (obj) {
   console.log("first name :" + obj.firstname);
   console.log("last name :" + obj.lastname);
};

invokeperson({ firstname: "Sachin", lastname: "Tendulkar" });
invokeperson({ firstname: "Sachin", lastname: "Tendulkar" });

その出力は次のとおりです-

first name :Sachin
last name :Tendulkar

ダックタイピング

ダックタイピングでは、2つのオブジェクトが同じプロパティセットを共有している場合、2つのオブジェクトは同じタイプであると見なされます。 ダックタイピングは、オブジェクトの実際のタイプではなく、オブジェクト内の特定のプロパティの存在を検証して、適合性をチェックします。 概念は一般的に次のフレーズで説明されています-

「アヒルのように歩き、アヒルのように泳ぎ、カモのように鳴く鳥を見るとき、私はその鳥をアヒルと呼びます。」

TypeScriptコンパイラは、型の安全性を保ちながら、オブジェクトをその場で作成できるようにするダックタイピングシステムを実装しています。 次の例は、インターフェイスを明示的に実装していないが、必要なすべてのメンバーを含むオブジェクトを関数に渡す方法を示しています。

interface IPoint {
   x:number
   y:number
}
function addPoints(p1:IPoint,p2:IPoint):IPoint {
   var x = p1.x + p2.x
   var y = p1.y + p2.y
   return {x:x,y:y}
}

//Valid
var newPoint = addPoints({x:3,y:4},{x:5,y:1})

//Error
var newPoint2 = addPoints({x:1},{x:4,y:3})