Today I Learned_230325

TypeScript

인프런 타입스크립트 강의 수강

섹션 5. 인터페이스

인터페이스는 반복되는 타입에 대해 정의한 것

항상 이 규칙으로 쓰겠다고 약속. 상호간의 약속

// 함수에 인터페이스 활용
function getUser(user: User) {
    console.log(user);
}
// 규칙에 맞다면 이렇게 넣을 수도 있다.
const capt = {
    name: 'captin',
    age: 100
}

getUser(capt);

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

var sum: SumFumction;
// sum = function () { //이 상태로는 넣을 수 없음
//
// }
// 함수의 모습까지 인터페이스로 정의
sum = function (a:number, b:number): number {
    return a + b;
}

// 인덱싱 방식에도 인터페이스 적용 - 딕셔너리 패턴에 사용
// 속성을 그때그때 부여해가면서 사용
interface StringArray {
    [index: number]: string;
}

var arr = ['a', 'b', 'c'];
arr[0]; //'a'.  배열의 숫자는 항상 인덱스다
// arr[0] = 10; // 불가능

// 딕셔너리 패턴
interface StringRegexDictionary {
    // 객체로 들어오는 이름을 key로 정의
    // 들어오는 타입을 string으로
    [key: string]: RegExp;
}

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

Object.keys(obj).forEach(function (value) {
    // value들이 타입이 string임이 추론됨
    console.log(value); //cssFile, jsFile
})

// 인터페이스 확장
// OOP의 상속이나 자바스크립트의 프로토타입
interface Person {
    name: string;
    age: number;
}

interface Developer extends Person{
    // 상속받은 요소들
    // name: string;
    // age: number;
    language: string;
}

var hee: Developer = {
    name: 'heejung',
    age: 29,
    language: 'java'
}

타입 별칭

특정 타입이나 인터페이스를 참조할 수 있는 타입 변수

primitive type, interface level, 제네릭 등 사용 가능

interface와 type은 IDE상에서 뜨는 것이 다르다.

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

var seho: Person = {
    name: 'seho',
    age: 30
}

// primitive type 정의 가능
type MyString = string;
var str: MyString = 'hello';

type Todo = {id: string; title: string; done: boolean}
function getTodo(todo: Todo) {

}

타입 별칭은 새로운 타입을 생성하는 것이 아니라 정의한 타입에 대해 나중에 쉽게 참고할 수 있게 이름을 부여하는 것

타입은 확장이 되지 않는다.