Type Script - 3

Ts에서의 객체

user의 정보를 담고 있는 객체를 한 번 만들어 보자

let user:object = {
	id: 1,
  	name:'현',
}

이렇게 만들어 버리면 문제가 발생해버린다

'object'형식에 'id'속성이 없다

• 타입을 object로 정의를 하면 이 요소는 객체인것만 알려주고 더이상의 정보는 주어지지 않기 떄문이다.

let user: {
	id:number;
  	name:string;
} = {
	id:1,
  	name:'김동현',
}

위와 같은 방식을 객체리터럴 방식이라고 하며 이렇게 했을 시 객체에 요소에 접근할 수 있고 요소가 어떠한 타입을 가지는지 알 수가 있다.

선택적 프로퍼티(Optional)

만약 객체를 생성했고 어떠한 값을 받게 되는데 이 값이 있어도 되고 없어도 되는 상황이라면 어떻게 해야할까?

let user: {
	id?: number;
  	name: string;
} = {
	id:1,
  	name:'김동현',
}

• 이 말은 id는 있어도 되고 없어도 되지만, 만약 있게 된다면 number의 타입을 갖는 값이여야한다는 점이다.

읽기 전용 프로퍼티(readonly)

이 객체의 값에서 수정이 되면 안되는 값이 있다면??

let config = {
	readonly apiKey = string;
} = {
	apiKey: "MY API KEY",
}

• 이렇게 객체의 프로퍼티 값을 readonly 를 하게 되면 읽기 전용 속성이므로 어떠한 값을 할당 할 수 없다.

타입 별칭

유저의 정보에 대한 객체의 타입을 지정함에 있어서

let user1: {
  id: number;
  name: string;
  nickname: string;
} = {
  id: 1,
  name: '김동현',
  nickname: 'ddd',
};

let user2: {
  id: number;
  name: string;
  nickname: string;
} = {
  id: 2,
  name: '동현',
  nickname: 'hhh',
};

이렇게 되어버리면 중복되는 유저의 타입이 거슬릴 수 밖에 없다 이럴때엔 타입을 변수처럼 사용하여 중복된 타입을 줄일 수 있다.

type User = {
  id: number;
  name: string;
  nickname: string;
};

이 값을 마치 변수 처럼 타입 지정할 수 있게끔 할 수 있다.

인덱스 시그니처

객체의 타입을 지정하는데 그 객체의 value와 key값의 타입의 규칙을 통해 쉽게 타입을 정할 수 있다.

let 대한민국 = {
	서울: "특별시",
  	대전: "광역시",
  	부산: "광역시",
  	대구: "광역시",
  	독도: "우리땅",
}

위 대한민국 객체를 보면 value,key값 또한 string이기에 다음과 같이 타입을 정의할 수 있다.

type Korea = {
	[key: string] : string,
};

let 대한민국:Korea = {
	서울: "특별시",
  	대전: "광역시",
  	부산: "광역시",
  	대구: "광역시",
  	독도: "우리땅",
}