타입스크립트 타입 별칭 (Type Aliases)

타입이 너무 길 때

다음과 같이 타입이 너무 길어서 보기 안좋을때가 있다.

let people : string|number|undefined = "june"

이땐 타입을 변수로 지정하자.

type PeopleType = string|number|undefined;//대문자로 시작하는건 그냥 국룰,
let people : PeopleType = "june"

 

readonly 사용

const 는 재할당이 불가능하다.

const name = "june"
name = "hee" // 재할당에러

하지만 object 내부는 const로 선언해도 변경이 가능하다.

const human = {
	name : "june"
}
human.name = "hee"

 

이때 object 내부의 속성을 바뀌지 않게 하고 싶다면 readonly를 사용할 수 있다.

 

type Human = {
	readonly name : string
}

let person : Human = {
	name : "june"
}
person.name = "hee"//readonly라서 에러난다.

 

type 키워드를 이용하여 재사용하기

import React, { useState } from "react";

type Name = string;
type Age = number;
type Person = Name | Age; //type합치기 union

type PositionX = { x: number };
type PositionY = { y: number };
type Position = PositionX & PositionY; // &연산자로 object타입 합치기, 개발자용어 : extend한다

//! type변수 재정의 불가능
// type Position = {}

function App() {
  //let 동물 =  string|number|undefined;
  let person: Person = "june";
  person = 25;

  let position: Position = { x: 10, y: 20 };

  return (
    <>
      {person}
      <br />
      {position.x}
      <br />
      {position.y}
    </>
  );
}

export default App;