[TypeScript] 인터페이스(interface)

let user: object;

user = {
  name: "xx",
  age: 30,
};

console.log(user.name); // Property 'name' does not exist on type 'object' -err

object의 경우 특정 속성값을 나타내지 못한다.

---

interface의 사용

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

let user: User = {
  name: "xx",
  age: 30,
  birthYear: 2000,
  1: "A",
  2: "B",
};

user.age = 10;
user.gender = "male";
user.birthYear = 1990; // Cannot assign to 'birthYear' because it is a read-only property

console.log(user.age); // 30
console.log(user.gender); // male

---

?

---

gender는 입력을 해도되고 안해도 되는 optional한 property.

---

readonly

---

readonly를 key 값 앞에 붙이면 수정 불가능.

---

index signature(인덱스 서명)

---

[grade:number] : string;

number을 key로 하고 string을 value로 하는 property를 여러개 만들 수 있다.

---

Literal Type

---

문자열과 숫자 사용 가능.

type Score = 'A' | 'B' | 'C' | 'F',

interface User {
    [grade:number] : Score;
}

number을 key로 하고 Score을 value로 하는 property.

---

함수

---

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 > 10;
};

---

class

implements

---

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 b = new Bmw("green");
console.log(b);
// Bmw: {
// "wheels": 4,
// "color": "green"
// }
b.start(); // "go..."

---

extends

---

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

class Benz extends Car {
	door: number;
	stop(): void;
}

const benz : Benz = {
	door: 5,
	wheels : 4;
	color : "black"
	start(){
		console.log('go...')
	}
	stop(){
		console.log('stop!')
	}

}

interface Car {
  color: string;
  wheels: number;
}

interface Toy {
  name: string;
}

interface ToyCar extends Car, Toy {
  price: number;
}