TypeScript 객체 구조 정의하고 실습하기
이번 시간에는 타입스크립트로 객체 정의하고 객체와 관련된 타입 정의방법을 실습합니다.
객체의 구조를 타입을 이용해 직접 정의하는 방법을 안내합니다.
인터페이스 개념을 활용해 객체 구조를 미리 정의해서 타입을 지정하는 방법을 안내합니다.
D:\TypeScript\3-TS-Core 폴더내에 object.ts파일을 생성 합니다.
1) 객체 기반 타입 정의법 코딩하고 실행하기
-하기 코드와 같이 코딩을 진행합니다.
-자세한 내용은 주석을 참고바랍니다.
-object.ts
//객체 타입을 데이터 형식 객체로 정의
const user1: { id: number; name: string; email: string; telephone?: string } = {
id: 2,
name: "John2 Doe",
email: "john2.doe@example.com",
telephone: "010-1234-5678",
};
console.log(
`사용자1 ${user1.name}의 이메일은 ${user1.email} 전화번호는 ${user1.telephone}입니다.`
);
//객체 타입을 인터페이스로 정의-User인터페이스
interface User {
id: number;
name: string;
email: string;
telephone?: string; //선택적(옵셔널) 속성은 속성명?로 정의
}
//사용자 객체변수/타입 정의 및 값 할당
//선택적(옵셔널) 속성은 반드시 값을 할당하지 않아도 됨.
let user2: User = {
id: 1,
name: "John Doe",
email: "john.doe@example.com",
};
console.log(`사용자2${user2.name}의 이메일은 ${user2.email}입니다.`);
//tsc --strictNullChecks object.ts
//node object.js
-코딩을 모두 진행 저장하고 아래 명령어를 통해 터미널창에서 ts파일을 컴파일하고 컴파일 결과.js파일을 실행합니다.
D:\TypeScript\3-TS-Core
tsc --strictNullChecks object.ts
node object.js
2)코딩 핵심 내용 설명
- 인터페이스는 객체나 클래스의 구조(기능/속성)를 강제하는 수단을 제공합니다.
- 객체의 속성에도 선택적 속성을 속성명?:타입 지정할수 있습니다.
- 객체/데이터의 구조를 정의할때는 type alias 보다는 interface 를 주로 사용합니다.
수고하셨습니다.
다음 주제로 이동합니다.