Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
Tags
- 아이오닉 스크롤 이벤트
- angular modal
- 검색
- angular route
- formgroup
- angular animation
- ApexChart
- modal
- 스크롤 이벤트 감지
- TAILWIND
- 앵귤러 모달
- 앵귤러 애니메이션
- Angular Router
- 호버
- Ionic modal
- prisma
- angular button
- summary
- ajax 사용 예시
- 스크롤 이벤트
- Router
- flex-1
- 셀렉트박스 커스텀
- mysql if
- Oracle LISTAGG 사용 예시
- scroll
- egov spring ajax 사용 예시
- 모달
- 옵저버블
- route
Archives
- Today
- Total
깜놀하는 해므찌로
typescript literal type / 리터널 타입 / intersection type / 교차 타입 / |, & 본문
IT
typescript literal type / 리터널 타입 / intersection type / 교차 타입 / |, &
agnusdei1207 2023. 5. 22. 12:32반응형
SMALL
// Literal type
const userName1 = "Bob"; // 상수
let userName2: string | number = "jane"; // 변수
userName2 = 3;
type Job = "police" | "developer" | "doctor"; // 사용자 정의 타입
interface User{
name : string;
job : Job; // Job 타입
}
let user:User = {
name : "이름",
job : "police"
}
// | : Union type
interface Student{
name : string | number;
grade : 1 | 2 | 3; // 1,2,3 만 입력 가능
}
interface Car{
name : "car";
color : string;
start(): void; // 출발 기능
}
interface Mobile{
name : "mobile";
color : string;
call(): void; // 전화 기능
}
function getGift(gift:Car | Mobile){
console.log(gift.color); // 둘 다 color 속성을 가지고 있어 사용 가능
if(gift.name === "car"){ // name 을 통해 interface 구분
gift.start();
}else{
gift.call();
}
}
/** intersection type 교차 타입 */
interface Bot{
name : string;
start():void;
}
interface Toy{
name : string;
color : string;
price : number;
}
let botToy : Bot & Toy = {
name : "로봇장난감",
start(){},
color : "black",
price : 1000
}
반응형
LIST
'IT' 카테고리의 다른 글
Tailwind 버튼 클릭 효과 / 버튼 클릭 시 커졌다 작아지는 효과 (0) | 2023.05.22 |
---|---|
Angular route config 가져와서 사용하기 예시 (0) | 2023.05.22 |
typescript 복수 타입 인자, 복수 리턴 타입, 함수 오버로드, typescript function overload (0) | 2023.05.21 |
typescript this 활용 예시 (0) | 2023.05.20 |
Uncaught (in promise): InvalidCharacterError: Failed to execute 'setAttribute' on 'Element' 에러 해결 (0) | 2023.05.19 |