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 | 29 | 30 |
Tags
- children vs childrenNodes
- https://lo-victoria.com/introduction-to-redux-toolkit-for-beginners
- 내장고차함수
- 자바스크립트#JS#var#let#const#undefined#null
- variable#function
- for~in/for~of
- JS#3일차달리자#초반인데#시간금방~
- react
- CSS
- https://www.daleseo.com/js-array-slice-splice/
- Beesbeesbees
- https://developer-talk.tistory.com/299
- cmarket
- removeCookie
- 자바스크립트
- 헷갈린다~
- dom
- js
- 자바스크립트#조건문#문자열
- UI
- 자바스크립트#JS#slice#splice
- ㄷㅌ
- @redux-toolkit
- slice/splice/split
- toString#String
- UX
- 노드교과서
- User Flow
- redux상태유지
- https://dasima.xyz/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%A0%9C%EA%B3%B1-math-pow-%EA%B3%84%EC%82%B0/
Archives
- Today
- Total
Daily Front_Minhhk
[TS] 타입 알리어스(type-aliases) 본문
타입 별칭을 통해 지정할 타입을 변수화 해준다.
타입 지정 시
더 복잡한 타입 정의를 원하거나,
불필요한 반복을 피하고 타입을 중심에서 관리할 수 있으며,
코드의 지저분함 방지와 재사용 능력 UP
type Combinable = number | string;
type ConversionDescriptor = 'as-number' | 'as-text';
리터럴 타입도 타입 알리어스로 지정가능!
리터럴 타입의 '스트링'은 'as-number' | 'as-text' 이외에는 에러가 뜬다.
더 확실한 검증 장치? 라고 할 수 있는데
지정한 스트링은 기억하고 까먹으면 찾아봐야하는 단점이 있다.
>> 예시
type Combinable = number | string;
type ConversionDescriptor = 'as-number' | 'as-text';
function combine(
input1: Combinable,
input2: Combinable,
resultConversion: ConversionDescriptor
) {
let result;
if (typeof input1 === 'number' && typeof input2 === 'number' || resultConversion === 'as-number') {
result = +input1 + +input2;
} else {
result = input1.toString() + input2.toString();
}
return result;
}
function greet(user: { name: string; age: number }) {
console.log('Hi, I am ' + user.name);
}
function isOlder(user: { name: string; age: number }, checkAge: number) {
return checkAge > user.age;
}
타입 알리어스 지정 후
type User = { name: string; age: number };
function greet(user: User) {
console.log('Hi, I am ' + user.name);
}
function isOlder(user: User, checkAge: number) {
return checkAge > user.age;
}
더 깔끔 하다!
'Study > Typescript' 카테고리의 다른 글
[TS] tsc --init > tsc -w (자동컴파일), tsconfig.js 속성 (0) | 2023.05.08 |
---|---|
[TS] 함수 반환 타입 + unknown (0) | 2023.05.08 |
[TS] 객체, 배열, 튜플, 열거형(enum), Any, 조합 (0) | 2023.05.05 |
[TS] 셋팅 + 기초 맛보기 (0) | 2023.05.05 |