TIL - 타입스크립트 객체와 타입

MinWoo Park·2021년 2월 8일
0

TIL

목록 보기
3/49
post-thumbnail

Today I Learned

매일 배운 것을 정리하며 기록합니다. TypeScript 객체와 타입에 대해 공부하고 있습니다.


타입스크립트 기본 타입

자바스크립트 타입과 달리 '소문자'

  • 수 타입 : number
  • 불리언 타입 : boolean
  • 문자열 타입 : string
  • 객체 타입 : object

타입 주석 (type annotation)

변수 선언문을 확장하여 타입을 명시

  • let 변수 이름: 타입 [=초깃값]

  • const 변수 이름: 타입 =초깃값

  • ex)

let n : number = 1
let b: boolean = true 
let s : string = 'good'
let o : object = {}

재할당

지정한 타입에 해당하는 값으로만 바꿀 수 있음.

  • ex)
n = 'a' // error
b = 1  // error
s = false  // error
o = {name :'Jack', age:32} // good

타입 추론(type inference)

  • 타입 생략시 타입스크립트 컴파일러가 대입 연산자의 오른쪽 값을 분석해 왼쪽 변수의 타입을 결정
  • 자바스크립트와 호환성을 위함.
  • 재할당 시 초깃값에 해당하는 타입의 값만 지정 가능

any 타입

마찬가지로 자바스크립트와 호환성을 위함.
어떤 타입의 값도 할당 가능

  • ex)
let a: any = 0  
a = 'hello' 
a = true
a = {}

undefined 타입

  • 자바스크립트에서 undefined는 falsy한 값
  • 타입스크립트 undefined는 타입이면서
  • undefined는 최하위 타입이므로 undefined를 제외한 다른 타입의 값을 할당할 수 없음.

타입 계층
any

any -> number, boolean, string
any -> object

any-> object-> interface, class...

undefined

  • any 타입에서 number, boolean, string 과 object 두 개의 타입이 파생
  • object 타입에서 interface, class .. 파생
  • 최하위 계층에 undefined 존재

인터페이스 선언문

  • interface 키워드를 통해 객체의 타입 정의

  • 객체의 타입 범위를 좁히기 위함

  • 중괄호속성과 속성의 타입 주석을 나열하는 형태로 사용
    interface 인터페이스 이름 {
    속성 이름[?]: 속성 타입[,...]
    }

  • ex)

interface IPerson {
  name: string
  age: number
}

선택 속성 구문 (optional property)

  • optional한 속성이 있는 인터페이스 설계
  • 속성 이름 뒤 물음표 기호를 붙여 만듦
  • ex)
interface IPerson2 {
  name: string 
  age: number
  etc?: boolean
}

let good1: IPerson2 = {name: 'Jack', age: 32}
let good2: IPerson2 = {name: 'Jack', age: 32, etc: true}

익명 인터페이스 (anonymous interface)

  • interface 키워드 사용하지 않고 이름도 없는 인터페이스
  • 주로 함수를 구현할 때 사용
  • ex)
let ai: {
  name: string
  age: number
  etc?: boolean
} = {name: 'Jack', age:32}

function printMe(me: {name: string, age: number, etc?: boolean}) {
  console.log(
    me.etc ?
      `${me.name} ${me.age} ${me.etc}` :
      `${me.name} ${me.age}`
  )
}
printMe(ai) // Jack 32

Reference : 전예홍, 『Do it! 타입스크립트 프로그래밍』, 이지스퍼블리싱(2020), p58-65.

profile
물음표를 느낌표로 바꾸는 순간을 사랑하는 개발자입니다.

0개의 댓글