// userName1 변수를 선언하고 "Bob" 문자열을 할당합니다.
const userName1 = "Bob";
// userName2 변수를 선언하고, 문자열 또는 숫자 타입을 가질 수 있도록 string | number 타입으로 지정합니다.
let userName2: string | number = "Tom";
// userName2 변수에 숫자 3을 할당합니다. 이는 userName2가 string | number 타입이므로 허용됩니다.
userName2 = 3;
// Job이라는 새로운 타입을 정의합니다. 이 타입은 "police", "developer", "teacher" 중 하나의 값을 가질 수 있습니다.
type Job = "police" | "developer" | "teacher";
// User 인터페이스를 정의합니다. 이 인터페이스는 name 속성과 job 속성을 가지며, job 속성의 값은 Job 타입으로 지정합니다.
interface User {
name: string;
job: Job;
}
// user 변수를 User 타입으로 지정하고, 값을 할당합니다.
const user: User = {
name: "Bob",
job: "developer",
};
// HighSchoolStudent 인터페이스를 정의합니다. 이 인터페이스는 name 속성과 grade 속성을 가지며, grade 속성의 값은 1, 2, 3 중 하나의 값을 가질 수 있습니다.
interface HighSchoolStudent {
name: number | string;
grade: 1 | 2 | 3;
}
해당 코드에서 리터럴 타입은 다음과 같습니다.
Job 타입
: "police", "developer", "teacher" 중 하나의 값을 가질 수 있습니다.- HighSchoolStudent 인터페이스의
grade 속성
: 1, 2, 3 중 하나의 값을 가질 수 있습니다.
리터럴 타입은 값의 종류를 제한하고, 특정 값만 허용하도록 강제할 수 있어 유용합니다.
// Car 인터페이스
interface Car {
name: "car";
color: string;
start(): void;
}
// Mobile 인터페이스
interface Mobile {
name: "mobile";
color: string;
call(): void;
}
// gift 매개변수는 Car 또는 Mobile 인터페이스 타입 중 하나를 받습니다.
function getGift(gift: Car | Mobile) {
console.log(gift.color); // gift의 color 속성 출력
if (gift.name === "car") { // gift의 name 속성이 "car"이면
gift.start(); // Car 인터페이스에 정의된 start 메서드 호출
} else { // 그 외에는
gift.call(); // Mobile 인터페이스에 정의된 call 메서드 호출
}
}
여기서
Car | Mobile
는유니온 타입
입니다. 유니온 타입은 | 기호를 이용해 두 개 이상의 타입을 합친 타입으로, Car와 Mobile 인터페이스 타입 중 하나를 선택적으로 받을 수 있습니다. getGift 함수의 매개변수 gift는 Car 인터페이스의 속성인 name, color, start 중 하나 또는 Mobile 인터페이스의 속성인 name, color, call 중 하나를 가질 수 있습니다.
interface Car {
name: string;
start(): void;
}
// Toy 인터페이스 정의
interface Toy {
name: string;
color: string;
price: number;
}
// Car와 Toy 인터페이스를 교차하여 toyCar 객체 정의
const toyCar: Toy & Car = {
name: "타요", // name은 string 타입으로 Toy와 Car 인터페이스에 모두 정의되어 있음
start() {}, // start 메서드는 void를 반환하는 Car 인터페이스에 정의되어 있음
color: "blue", // color와 price는 Toy 인터페이스에 정의되어 있음
price: 1000,
};
위 코드에서
교차 타입
은Toy & Car
부분입니다. 교차 타입은 & 연산자를 사용하여 두 개 이상의 타입을 하나로 합치는 타입입니다. 이 경우 toyCar 객체는 Car와 Toy 인터페이스의 모든 속성을 가지고 있어야 합니다. 즉, name과 start 속성은 Car 인터페이스에서, color와 price 속성은 Toy 인터페이스에서 가져온 것입니다.