JSTS

[TS] 2. 인터페이스

Jaaaay 2022. 6. 29. 00:45
interface User {
  age: number;
  name: string;
}

// 변수에 활용한 인터페이스 활용
var seho: User = {
  age: 24,
  name: "세호",
};

// 함수에 인터페이스 활용
function getUser(user: User) {
  console.log(user);
}

const capt = {
  name: "캡틴",
  age: 100,
};

getUser(capt);

// 함수의 스펙(구조)에 인터페이스를 활용
interface SumFunction {
  (a: number, b: number): number;
}

var sum: SumFunction;
sum = function (a: number, b: number): number {
  return a + b;
};

// 인덱싱
interface StringArray {
  [index: number]: string;
}

var arr: StringArray = ["a", "b", "c"];

// 딕셔너리 패턴
interface StringRegexDictionary {
  [key: string]: RegExp;
}

var obj: StringRegexDictionary = {
  // sth: /abc/,
  cssFile: /\\.css$/,
  jsFile: /\\.js$/,
};

obj["cssFile"] = "a"; // error

Object.keys(obj).forEach(function (value) {});

// 인터페이스 확장
interface Person {
  name: string;
  age: number;
}

interface Developer extends Person {
  language: string;
}

var cap: Developer = {
  name: "kim",
  age: 20,
  language: "ts",
};