// 인터페이스
// let user:object;
// user = {
// name : 'xx',
// age : 30
// }
// console.log(user.name) // error
// property를 정의해서 객체를 사용할 때 interface 사용
type Score = 'A' | 'B' | 'C' | 'F';
interface User {
name: string;
age: number;
gender?: string; // 있어도 되고 없어도 되고
readonly birthYear: number; // 읽기 전용
[grade: number]: Score; // type을 생성해서 사용할 수 있음
}
let user: User = {
name: 'xx',
age: 30,
birthYear: 2000,
1: 'A',
// 2 : 'D' // error 정의되지 않은 Score
};
user.age = 10;
user.gender = 'male';
// user.birthYear = 1990; // error readonly
console.log(user);
// interface 함수
interface Add {
(num1: number, num2: number): number;
}
const add: Add = function (x, y) {
return x + y;
};
add(1, 2);
// add(a, 2); // type error
interface isAdult {
(age: number): boolean;
}
const g: isAdult = (age) => {
return age > 19;
};
g(33); // true
// implements
// interface class
interface Car {
color: string;
wheels: number;
start(): void;
}
class Bmw implements Car {
color;
wheels = 4;
constructor(c: string) {
this.color = c;
}
start() {
console.log('go...');
}
}
const m = new Bmw('green');
console.log(m)
m.start();
// extend 인터페이스 확장
interface Benz extends Car {
door: number;
stop(): void;
}
const benz : Benz = {
color : 'black',
wheels : 4,
start(){
console.log('do not go')
},
door : 5,
stop(){
console.log('stop');
}
}
console.log(benz)
// 복수 확장
interface Toy {
name: string;
}
interface ToyCar extends Car, Toy {
price : number
}
728x90
'Frontend > typescript' 카테고리의 다른 글
Typescript 배우기 6 (클래스) (0) | 2022.06.05 |
---|---|
Typescript 배우기 5 (리터럴, 유니온/교차 타입) (0) | 2022.06.05 |
Typescript 배우기 4 ( 함수) (0) | 2022.05.19 |
Typescript 배우기 2(타입종류) (0) | 2022.05.19 |
TypeScript 배우기 1 (0) | 2022.05.02 |