객체

Haz·2024년 2월 14일
0

개발여행기

목록 보기
20/24
post-thumbnail

객체 타입 정의하기

1. Object로 정의

let user: object = {
	id: 1,
	name: "Muzi",
};

→ 그러나 이런 방식에서는 user.id 처럼 점 표기법으로 특정 프로퍼티에 접근할 경우 오류가 발생하며, “’object’ 타입에 ‘id’ 프로퍼티가 없다”는 메시지가 뜬다.

✅ 타입스크립트의 object 타입은 단순 값이 객체임을 표현하는 것 이외에 아무런 정보도 제공하지 않아 프로퍼티에 대한 정보는 가지고 있지 않다. 따라서 프로퍼티에 접근하려고 하면 문제 발생!

2. 객체 리터럴 타입

let user: {id: number, name: string} = {
	id: 1,
	name: "Muzi",
};

객체 리터럴 타입으로 객체를 정의하면 타입 내에 정의된 프로퍼티에도 문제 없이 접근이 가능해진다. 따라서 이 방법을 애용하도록 하자.

💡 구조적 타입 시스템
타입스크립트는 기존의 정적 타입 시스템을 따르는 언어인 C나 Java와는 달리 객체의 타입을 정의할 때 프로퍼티를 기준으로 객체의 구조를 정의하 듯이 타입을 정의한다.

선택적 프로퍼티

JS에서 객체를 다루다보면 자주 특정 프로퍼티는 무의미해지는 상황이 존재

let user: {
  id: number;
  name: string;
} = {
  id: 1,
  name: "무지",
};

user = {
  name: "라이언", // 오류 발생!
};

user 객체에 name 프로퍼티만 있게 된다면 오류가 발생한다. 타입 선언은 id까지 했기 때문에 프로퍼티가 부족하기 때문이다. 따라서 이럴 경우 선택적 프로퍼티로 만들어주어야한다.

let user: {
  // 선택적 프로퍼티로 만들기 위해 '?:'로 타입 선언
  id?: number; 
  name: string;
} = {
  id: 1,
  name: "라이언",
};

물음표는 해당 프로퍼티가 Optional 프로퍼티라는 의미로 붙여준다.

읽기 전용 프로퍼티

let user: {
  id?: number;
  readonly name: string; // name은 이제 Readonly 프로퍼티가 되었음
} = {
  id: 1,
  name: "무지",
};

user.name = "라이언"; // 오류!

읽기 전용 프로퍼티는 프로퍼티 값 수정이 불가능하므로 의도치 않은 수정을 방지할 때 사용한다.

profile
나도 재밌고, 남들도 재밌는 서비스 만들어보고 싶다😎

0개의 댓글