FE PARADISE

Types 본문

프론트엔드/TypeScript

Types

PARADISE247 2025. 8. 18. 22:12
반응형

₊✩‧₊˚౨ৎ˚₊✩‧₊

내가 보려고 적은 타입 정리

Array

const prices: Array<number> = [1000, 2000, 3000];

let member: [string, number, number];
member = ['name', 1, 2];

 

Literal types

문자열 리터럴 타입 (String Literal Types)

type Name = "name";
type Position = 'up' | 'down' | 'left' | 'right';

숫자형 리터럴 타입 (Numberic Literal Types)

function getNumber(num: number): 1 | 2 | 3 | 4 | 5 | 6 | 7 {
	return num;
}

type Tile = {
	color: string;
	size: 64 | 128 | 200 | 400;
}

 

Alias

  type Member = {
    name: string;
    age: number;
  };
  const member: Member = {
    name: "Mark",
    age: 32,
  };

 

Union

OR

  type Shape = "square" | "triangle" | "circle" | "heptagon";
  function makeTile(shape: Shape) {
    console.log(`🀆 New Tile: ${shape} tile 🀆`);
  }
  console.log(makeTile("heptagon"));

 

Descriminated Union

type UserState = {
    type: "user";
    id: number;
  };

  type AdminState = {
    type: "admin";
    code: number;
  };

  type Person = UserState | AdminState;

  function getUserInfo(user: Person) {
    if (user.type === "user") {
      console.log("User");
    } else {
      console.log("Admin");
    }
  }

 

Intersecton Types

AND

  type Fruit = {
    name: string;
    sweetness: number;
  };

  type Food = {
    id: string;
    eat: () => void;
  };

  function eatFruit(fruit: Fruit & Food) {
    console.log(fruit.id, fruit.name);
  }

  eatFruit({
    id: "abc123",
    name: "Apple",
    sweetness: 50,
    eat: () => {
      console.log("eat");
    },
  });

 

Enum

enum DAYS {
    Sunday, // 0
    Monday, // 1
    Tuesday, // 2
    Wednesday, // 3
    Thursday, // 4
    Friday, // 5
    Saturday, // 6
  }
  
  enum Direction {
      Up = "UP",
      Down = "DOWN",
      Left = "LEFT",
      Right = "RIGHT"
  }

 

Type inference 타입 추론

let message = 'Hi'; // string 타입
function sum(a: number, b: number){ // number
	return a + b;
}
반응형