타입스크립트(TS, TypeScript) 공부 3

12. class 형 타입지정

class Person {
  name: string;
  data: number = 0;
  constructor(a: string) {
    this.name = a;
  }
  함수(a: string):void {
    console.log("안녕" + a);
  }
}

- 클래스 내부 변수 타입 지정 및 초기화 가능

- 초기값 지정은 constructor 를 이용하여 새로운 클래스 생성시 변수값 지정

- method 지정도 함수처럼 값 지정 가능

 

13. interface 문법

- 오브젝트 선언시 type방식이 아닌 interface를 통해 타입을 보다 편리하게 지정 가능

interface Square { 
  color :string, 
  width :number, 
} 

let 네모 :Square = { color : 'red', width : 100 }

- interface를 통해 대문자로 작명하고  { } 안에 타입을 명시하는 방식으로 사용

 

* interface 상속

interface Student {
  name :string,
}
interface Teacher {
  name :string,
  age :number,
}

- 다음과 같이 name이라는 키 값이 겹치는 오브젝트 일시 extends문법을 이용하여 길이를 줄일 수 있음

 

interface Student {
  name :string,
}
interface Teacher extends Student {
  age :number
}

- 객체지향적 프로그래밍 설계에 유리함

- interface로 동일 이름 중복 선언 시 허용되며 extends 한 것과 동일하게 동작

- override하는 것에 유리

- 외부 라이브러리 사용에 type지정에 편리

- 동일 키 값이 extends 되었을 때 에러처

 

* type alias의 경우 extends는 안되고 &연산자를 이용한 타입 결합 가능

type Student = {
  name :string,
}

type Teacher = Student & { age :number }

- 중복 선언 불가

- &연산 시에 동일 key 값이 존재할 때 에러처리 x (다른타입이었을 때는 에러가 나나 같은 타입이면 에러 x)

 

14. rest parameter

function 전부더하기(...a:number[]):void{
  console.log(a)
}

전부더하기(1,2,3,4,5)

- 파라미터를 풀어서 갯수가 지정되지않는 형식의 정의 용의

- 파라미터 타입지정은 배열형식으로 지정해주면 완료

 

* 비슷한 예제 Spread operator

let arr = [3,4,5];
let arr2 = [1,2, ...arr]
console.log(arr2)

- array 혹은 object 괄호 벗기고 싶을 때 왼쪽에 사용

- 괄호벗겨주는 ...spread는 array, object 자료 왼쪽에,

- 여러개의 파라미터를 의미하는 ...rest는 함수선언할 때 소괄호 안에 출몰합니다. 

 

* Destructuring 문법

let { student, age } = { student : true, age : 20 }

let [a, b] = ['안녕', 100]

- 다음과 같이 오브젝트 키 값, 배열의 값을 변수로 빼서 선언 가능

- 함수의 파라미터로도 동일하게 적용 가능