Will find a way
[TS] 타입 어서션 / 타입 앨리어스 / 클래스 수정자 / 제네릭 본문
목차
1. 타입 어서션
2. 타입 앨리어스
3. 타입 클래스 수정자
4. 제네릭
1. 타입 어서션
구체적인 객체의 타입을 알려주고 명시한다.
변수명 = 값 as 타입
ex)
const input = document.querySelector("input");
// 자바스크립트 경우에서는 에러가 발생하지 않는다.
const input = documnet.querySelector("input") as HTMLinputElemnet
// typescript에서는 input에 as 타입을 지정해 주어야 에러가 발생하지 않는다
2. 타입 앨리어스
- 타입 지정에 별명을 붙여줄 때 사용합니다.
ininterface는 기능이나 사물의 객체의 구조를 정의할 때 사용하고
type은 데이터의 형태를 정의할 때 사용합니다.
type userLogin = {
uid : string,
upw : string
}
3. 타입 클래수정자
class User {
private name : string;
// private 은 객체를 생성하고 점표기법, 대괄호표기법으로 접근이 불가능하다. 직접 참조할 수 없게 만든다.
// 다른 작업자나 아니면 혹여나 의도치 않게 변경될 경우를 고려하여 직접 참조 혹은 수정이 불가능하다.
// 객체 안에서는 수정이 가능하다.
public age : number;
// public 은 객체도 참조 수정이 가능하고 점표기법, 대괄호표기법 접근이 가능하다.
// 유저를 관리하거나 하다 보면 값을 풀어야 하는 상황이 생기기도 한다. (객체지향적으로 프로그래밍을 하다가 어쩔 수 없을 때)
// get set
getName (){
// private 속성은 객체 안에서 메서드로 this를 참조하여 호출할 수 있다.
return this.name;
}
setName (_name){
// privatge 속성에 접근해서 name의 값을 수정
this.name = _name;
}
}
4. 제네릭 타입
호출시에 동적인 타입을 주고 싶은 경우에 사용
<T> : 제네릭 타입 문법
타입을 전달한다.
class User<A> {
private name : A[] =[];
}
const user = User<string>();
// 제네릭을 사용하는 목적은 코드의 재사용성을 높히기 위해서
const product = Product<number>();
const product = Product<string>();
// T : 타입의 축약어 , E : Error의 타입 , R : 변환타입
function name<T, R>(name : T):R{
return parseInt(name + 1);
}
name<string, number>();
const user = userLogin ={
uid,
upw
}
name<userLogin, boolean>(user)
'Language > Typescript' 카테고리의 다른 글
AxiosResponse<T> (Promise랑 뭐가 다른데?!) (0) | 2025.05.08 |
---|---|
[Record] 타입 정의 (React 프로젝트를 하면서) (0) | 2025.05.05 |
[TS] 전략패턴 (0) | 2024.05.02 |
[TS] interface & class (0) | 2024.04.24 |
[TS] Typescript 첫시작 (0) | 2024.04.23 |