[TypeScript] Interface

승미니·2021년 6월 12일
0

TypeScript

목록 보기
2/3

1. 사용 이유

let user:object;

user = {
	name : 'lee',
  	age: '25'
}

// 에러 발생
console.log(user.name)
  • object에는 특정 속성 값에 대한 정보가 없기 때문에 interface를 사용한다.

2. Interface 형태

// 문자열 Literal type
type Score = 'A' | 'B' | 'C' | 'D'

interface User {
	name: string;
  	age: number;
  	gender?: string;
  	readonly birth: number;
  	[grade:number] : Score;
} 

let user : User = {
	name: 'lee',
  	age : 25,
   	birth: 0628,
  	1 : 'A',
  	2 : 'B',
  	// F는 type Score에 없는 값이라 에러가 발생한다. 
  	3 : 'F'
  	// gender는 optional property 라서 없어도 오류가 발생하지 않는다. 
}

user.age = 10;

// readonly 라서 수정하면 에러가 발생한다. 
user.birth = 1225

console.log(user.age) // 10으로 출력
  • optional property는 ?를 붙여서 사용한다.
  • readonly property는 생성할 때만 할당이 가능하고 이후에는 수정을 할 수 없다.

3. Interface로 함수 정의

interface Add {
  	// 파라미터                    반환값
	(num1: number, num2: number):number;
}

const add : Add = function(x, y) {
	return x + y;
}

interface IsAdult {
  (age: number):boolean;
}

const a:IsAdult = (age) => {
	return age > 19;
}

4. Interface로 클래스 정의

interface Car {
	color: string;
  	buyYear: number;
  	start():void;
}

class Benz implements Car {
	color : "black";
  	buyYear: 2021;
  	start() {
		console.log ('부릉');
	}
}

// Constructor 사용
class Benz implements Car {
  	color;
  	buyYear: 2021;
  
  	constructor(c:string) {
		this.color : c;
	}
  
  	start() {
		console.log ('부릉');
	}
}

const myCar = new Benz('Black');

참고
https://youtu.be/OIMPLNICzoc

profile
Web Frontend Developer

0개의 댓글