본문 바로가기

부트캠프교육중/TypeScript22

[TS] 타입 단언 타입을 지정해주는거다? 타입 단언은 dom API를 조작할때 가장 많이 사용한다. let div = document.querySelector('div') ; 이렇게 사용하면 div는 null일수도 있고 HTMLDivElement일수도 있다. 그래서 이렇게 if문을 이용해서 표현해야 한다. let div = document.querySelector('div') ; if(div){ div.innerText } 이걸 타입 단언을 사용하게 되면 if문을 사용하지 않아도 된다. let div = document.querySelector('div') as HTMLDivElement; div.innerText; 2023. 8. 18.
[TS] 타입 추론 interface Dropdown3 { value: T; title: string; } let shoppingItem: Dropdown3 = { value: 'abc', title: 'hello' } interface Dropdown3 { value: T; title: string; } interface DetailedDropdown extends Dropdown3{ description: string; tag: K; } let detailedItem: DetailedDropdown ={ description: 'ab', tag: 'a', value: 'a', title: 'gg', } 2023. 8. 17.
[TS] Promise에서의 제네릭 제네릭은 api호출해와서 api응답에 규격을 정의할때 가장 많이 쓰인다. function fetchItems(): string[] { let items = ['a', 'b', 'c']; return items; } //동기적인 코드에 대해서는 TS가 추론을 한다. function fetchItems2() { let items = ['a', 'b', 'c']; return new Promise(function (resolve) { resolve(items); }) } //비동기 코드에서 이렇게 하면 Promise이 뜬다. 그래서 Promise의 반환타입을 지정해줘야한다. function fetchItems2(): Promise { let items = ['a', 'b', 'c']; return new Pr.. 2023. 8. 17.
[TS] 제네릭의 타입에 제한을 두는 경우 function lonTextLength(text: T): T { console.log(text.length); return text; } 이렇게만 하면 length부분에서 오류가 발생한다. 여기서 제네릭의 타입에도 제한을 두게 되면 이런식으로 function lonTextLength(text: T[]): T[] { console.log(text.length); return text; } 이렇게 하면 오류가 발생하지 않는다. lonTextLength(['hi', 'abc']); interface LengthType { length: number; } function lonTextLength2(text: T): T { text.length; return text; } 이렇게 하는건 제네릭은 LengthTy.. 2023. 8. 16.