Will find a way

[TS] 타입 어서션 / 타입 앨리어스 / 클래스 수정자 / 제네릭 본문

Language/Typescript

[TS] 타입 어서션 / 타입 앨리어스 / 클래스 수정자 / 제네릭

Jaka_Park 2024. 4. 29. 22:49

목차

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