Do it! 타입스크립트 프로그래밍 - 객체와 타입

03 객체와 타입

03-1 타입스크립트 변수 선언문

• let과 const 키워드
  • let으로 선언한 변수는 코드에서 그 값이 수시로 변경될 수 있음을 암시
  • const 변수는 코드에서 변숫값이 절대 변하지 않는다는 것을 암시
  • ESNext는 var 키워드를 사용하지 말라고 권고
• 타입 주석(type annotation)
  

  01: let n: number = 1
  02: let b: boolean = true
  03: let s: string = 'hello'
  04: let o: object = {}

• 타입 추론(type inference)
  • 자바스크립트와 호환성을 위해 타입 주석 부분을 생략할 수 있음
  • 타입스크립트 컴파일러는 대입 연산자 = 오른쪽 값에 따라 변수의 타입을 지정
    

    01: let n = 1        // n의 타입을 number로 판단
    02: let b = true     // b의 타입을 boolean으로 판단
    03: let s = 'hello'  // s의 타입을 string으로 판단
    04: let o = {}       // o의 타입을 object로 판단

• any 타입
  • 자바스크립트와 호환을 위해 any라는 이름의 타입을 제공
  • 값의 타입과 무관하게 어떤 종류의 값도 저장할 수 있음
• undefined 타입
  • 타입스크립트에서 undefined는 타입이기도 하고 값이기도 함
  • 자바스크립트에서 undefined는 값 (변수를 초기화하지 않으면 undefined 값을 가짐)
• 템플릿 문자열(template string)
  • 역 따옴표(backtick) `로 문자열을 감싸고, 변수를 ${ } 기호로 감싸는 형태
    

    01: let count = 10, message = 'Your count'
    02: let result = `${message} is ${count}`
    03: console.log(result)  // Your count is 10

03-2 객체와 인터페이스

• object 타입은 인터페이스와 클래스의 상위 타입
• number, boolean, string 타입의 값을 가질 순 없지만 속성 이름이 다른 객체를 자유롭게 담을 수 있음
• 인터페이스 선언문
  
  • 객체의 타입을 정의할 수 있게 하는 interface 키워드 제공
  • 객체를 의미하는 중괄호 { }로 속성과 속성의 타입 주석을 나열하는 형태로 사용
• 선택 속성(optional property) 구문 : 속성 이름 뒤에 물음표 기호를 붙임
  

  01: interface IPerson {
  02:   name: string   // 필수 속성
  03:   age: number    // 필수 속성
  04:   etc?: boolean  // 선택 속성
  05: }
  06: let good1: IPerson = {name: 'Jack', age: 32}
  07: let good2: IPerson = {name: 'Jack', age: 32, etc: true}

• 익명 인터페이스(anonymous interface)
  • interface 키워드를 사용하지 않고 인터페이스의 이름도 없는 인터페이스
  • 주로 다음처럼 함수를 구현할 때 사용
    

    01: let ai: {
    02:   name: string
    03:   age: number
    04:   etc?: boolean
    05: } = {name: 'Jack', age: 32}
    06: function printMe(me: {name: string, age: number, etc?: boolean}) {
    07:   console.log(
    08:     me.etc ?
    09:       `${me.name} ${me.age} ${me.etc}` :
    10:       `${me.name} ${me.age}`
    11:   )
    12: }
    13: printMe(ai)  // Jack 32

 

 

03-3 객체와 클래스

• 객체지향 언어에서 흔히 볼 수 있는 class, private, public, protected, implements, extend 키워드 제공
• 문법적인 차이만 약간 있을 뿐 사실상 그 의미는 다른 언어와 같음
• public, private, protected와 같은 접근 제한자(access modifier)를 생략하면 public으로 간주
• 타입스크립트 클래스는 생성자(constructor)로 클래스의 속성을 선언할 수 있음
  

  01: class Person {
  02:   constructor(public name: string, public age?: number) {}
  03: }
  04: let jack: Person = new Person('Jack', 32)
  05: console.log(jack)  // Person { name: 'Jack', age: 32 }

• 인터페이스를 구현할 때 implements 키워드를 사용
• abstract 키워드를 사용해 추상 클래스를 만들 수 있음
• extends 키워드를 사용해 상속 클래스를 만듦

03-4 객체의 비구조화 할당문

• 구조화(structuring) : 인터페이스나 클래스를 사용해 관련된 정보를 묶어 새로운 타입으로 표현하는 것
• 비구조화(destructuring) : 구조화된 데이터를 분해하는 것
• 잔여 연산자(rest operator)
  

  01: let address: any = {
  02:   country: 'Korea',
  03:   city: 'Seoul',
  04:   address1: 'Gangnam-gu',
  05:   address2: 'Sinsa-dong 123-456',
  06:   address3: '789 street, 2 Floor ABC building'
  07: }
  08: const {country, city, ...detail} = address
  09: console.log(detail)

• 전개 연산자(spread operator)
  

  01: let part1 = {name: 'Jane'}, part2 = {age: 22}, part3 = {city: 'Seoul', country: 'Kr'}
  02: let merged = {...part1, ...part2, ...part3}
  03: console.log(merged)

03-5 객체의 타입 변환

• 타입 변환(type conversion) : 특정 타입의 변숫값을 다른 타입의 값으로 변환할 수 있는 기능
  • 타입스크립트는 타입 변환이 아닌 타입 단언(type assertion)이라는 용어를 사용

출처 : Do it! 타입스크립트 프로그래밍

Do it! 타입스크립트 프로그래밍