interface

interface의 장점

- extends로 복사가 가능하다.

- 중복 선언이 가능하다. => 자동 extends가 된다.

- extends했을 때 중복 속성이 생기면 미리 error 발생

- type의 경우 중복 속성이 미리 발생하지 않는다. 

interface Person{
	name : string;
    age : number;
}

interface User extends Person{
	email : string;
    phone : string;
}

let Yeonji : Person = { name : "Yeonji", age : 22 };
let Sujin : User = { name : "Sujin", age : 22, email :"sujin@mmm.com", phone : "010-2222-2222" };

 

 type vs interface

type interface
중복 X 중복 O
&를 사용하여 확장 extends keyword를 사용하여 확장

 

728x90

class type 지정

! constructor함수는 return type이 항상 object이기 때문에 return type을 지정하면 안된다.

class Person{
	let name : string;
	constructor(a : string){
    	this.name = a;
    }
};

Person.prototype.greet = function(a : sring) : void{
	console.log("hello" + a);
}

let Minseo = new Person("Minseo");

console.log(Minseo.name); // result : Minseo
// Person의 자식들은 모두 greet이라는 함수를 사용할 수 있다.

 

728x90

Literal Types

let 이름 : "Lee";
이름 = "kim"; //error, 이름에는 "Lee"이외의 값 들어올 수 없다.

function 함수( a : "hi" ){
	console.log(a);
}

함수("hello"); // error 함수의 parameter로 "hi"만 가능
return type도 똑같이 Literal type으로 지정해 줄 수 있다.

 

as const

아래와 같은 경우 Name.name의 type이나, show function의 parameter type 이 둘 다 "kim"이지만, Name.name 의 type을 찍어보면 string이 나온다. 이 경우 Name의 type을 직접 object라고 지정을 해주거나, Name의 뒤에 as const를 붙여주어 object value 값을 그대로 type으로 지정해주게 한다.

 

as const 장점

1. object value값을 그대로 타입으로 지정해준다.

2. object 속성들에 모두 readonly를 붙여준다.

var Name = {
	name : "kim"
};

function show( x : "kim" ){

}

show(Name.name); // error 발생
var Name = {
	name : "kim"
}as const;

or

var Name : object = {
	name : "kim"
};

function show( x : "kim" ){

}

show(Name.name); // 정상 동작

 

728x90

type allias

Typescript에서는 type도 따로 선언할 수 있다. 길고 복잡한 Union type을 따로 type allias로 만들어 사용하여 가독성 향상시키고 코드 길이를 줄일 수 있다. 

type 변수의 이름은 첫 글자를 대문자로 하는게 국룰

!! type은 재정의가 불가능하다 !!

type Person = { name : string, age : number };
let minseo : Person = { name : Minseo, age : 21 };

 

type extend

type Name = { name : string };
type Age = { age : number };

type Person = Name & Age;

let Minseo : Person = { name : Minseo, age : 21 };

 

function type allias

함수 type allias는 함수 표현식에만 사용할 수 있다.

type FunctionType = ( a : string ) => number; 
// string type의 매개변수를 갖고, return type이 number인 함수 type allias

let myFunction : FunctionType = function(){
	// 함수 표현식
}

object 내의 함수도 함수 type allias를 지정할 수 있다. 

type Member = {
	name : string,
    age : number,
    plusOne : ( x : number ) => number,
    changeName : () => void
}

 

728x90

'Language > Typescript' 카테고리의 다른 글

[ Typescript ] rest parameter type지정  (2) 2021.12.18
[ Typescript ] interface  (0) 2021.12.18
[ Typescript ] class type 지정  (0) 2021.12.18
[ Typescript ] Litertal Types & as const  (2) 2021.12.17
[ Typescript ] Typescript 시작하기  (0) 2021.12.17

+ Recent posts