The HamSter Developer

session을 예시로 작성한다.npm i @types/express-sessionsrc 안에 session.d.ts 파일 생성d는 declaration의 약자로 타입선언 파일을 의미한다. (.d.를 붙이지 않고, 안에 JS 코드가 없을 경우 Ts->Js 변환 과정에서 빈 파일로 인식되기 때문에 오류가 나니 꼭 .d를 붙여야한다.)import 'express-session';declare module 'express-session'{ interface SessionData { // 변경할 타입, SessionData는 express-session에서 제공하는 타입 중 하나이며, 거기에 userData를 추가하는 코드이다. userData: IUser; }}타입 스크립트가 해당 타입..

as란?타입 단언의 방식이다.가끔 TS로 코딩을 하다보면 내가 만든 함수가 두 타입중 하나를 return하게 되는데(예시로 string | number)오로지 string만 받는 함수를 사용할 경우 return 값이 string | number라며 오류가 난다.이럴 때 as를 사용하는데 이는 변수의 타입을 단언하여 사용할 수 있다.const a = func();stringFunc(a as string);이러면 a는 무조건 string으로 인식한다.다만, 타입 오류가 날 때 마다 as를 남발하게 된다면 TS를 쓰는 의미가 사라지고 오류가 터져도 잡기 힘드니 너무 막 사용하지 말자, 시간이 없을 때 사용하는 임시 방편이지 타입 오류를 고쳐주는 치트키가 아니다.keyofkeyof란 타입의 모든 키를 유니언 타..

함수의 매개변수와 인자처럼 타입 또한 사용할 수 있다.이를 제네릭, generic이라고 하며 사용법은 아래와 같다.interface IAny { //T는 타입의 이름이다. 마음대로 정해도 된다.list: T[];}const a : IAny //a.list는 number[]를 타입으로 가지게 된다.대표적인 사용 예시로 우리가 HTML에서 이벤트를 작성할 때 자주 사용된다.예: 대충 이벤트 함수 (a:ChangeEvent) => { //inputElement는 기본적으로 TS에서 제공해주는 Type이다. html Element를 뜻하며, :ChangeEvent는 input Element에서 Change이벤트가 발생했다는 것을 알려주어, a가 input의 체인지 이벤트 타입임을 알려준다. co..

JavaScript를 사용하다가, 최신 프레임워크는 전부 TypeScript로 돌아간다는 이야기를 듣고 TS를 배우게 되었다.TypeScript는 JavaScript에 정적 타입을 추가한 언어로서 JS의 확장판이라 생각하면 편하다.TS를 왜 사용하는가?일단 TS를 처음 배울 땐 굉장히 머리가 아픈데, 이해한 후에는 TS를 안쓰면 코딩하기 힘들어질 정도다.첫번째로 TS를 사용할 경우 코드의 안정성을 높으며 유지보수에 탁월한 성능을 보인다. (타입을 바꿔버리면 실행 단계에서 전부 오류가 터지니까.)특히, 팀 프로젝트에서 변수 타입을 미리 지정함으로써 협업 과정에서 오류를 줄일 수 있고, 코드 자동 완성 기능으로 개발 단계에서 굉장히 편해진다.어떻게 사용하는가?타입 지정말 그대로 타입을 지정해준다.내가 let..