타입스크립트 튜토리얼 object

객체는 키 값 쌍의 세트를 포함하는 인스턴스다. 값은 스칼라 값 또는 함수 또는 다른 객체의 배열의 될 수 있다.

문법

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)

출력

Tom 
Hanks

타입스크립트 타입 템플릿

자바스크립트 에서 객체 리터럴을 다음과 같이 생성했다고 한다.

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

객체에 몇가지 값을 추가하고 싶을 때, 자바스크립트는 필요한 수정을 하도록 허락한다. 나중에 person 객체에 함수를 추가할 필요가 있다고 가정하면 이렇게 할 수 있다.

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

타입스크립트에서 똑같은 코드를 쓰면 컴파일러는 에러를 출력한다. 타입스크립트에서 객체는 타입 템플릿을 가져야하기 때문이다. 타입스크립트에서의 객체는 특정 타입의 인스턴스여야 한다.

선언에서 메서드 템플릿을 써서 해결할 수 있다.

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

출력

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 객체를 전달해서 호출된다.

자바스크립트 컴파일

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"});

자바스크립트 컴파일

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

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

출력

first name :Sachin 
last name :Tendulkar

duck-typing

덕 타이핑에서 두 객체가 만약 서로 같은 속성의 집합을 공유한다면 같은 타입으로 고려된다. 덕 타이핑은 객체의 실제 타입이 아닌 객체에서의 특정 속성의 존재 여부를 확인하여 적합성 검사를 한다.

"오리처럼 걷고, 수영하고, 우는 새를 본다면, 그 새를 오리라고 부를 수 있다."

타입스크립트 컴파일러는 타입 안정성을 유지하는 동안 즉석에서 객체 생성을 허락하는 덕 타이핑 시스템을 구현한다. 다음 예는 함수에 요구되는 멤버들을 모두 포함하지만 인터페이스를 명시적으로 구현하지 않은 객체가 어떻게 전달되는 지를 보여준다.

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})

https://www.tutorialspoint.com/typescript/typescript_objects.htm