Typescript D2

🐳ㅇㅡㄴㄱㅓ·2022년 10월 18일
0

사내스터디

목록 보기
3/7

tsc CLI Options

// default
$ tsc

// tsc watch 타입스크립트 파일을 지켜본다는 의미. 켜놓고 작업하면 저장할 때마다js파일 알아서 갱신됨. 
$ tsc -w

// tsconfig 파일 설정 상관없이 디폴트 설정으로만 실행
$ tsc index.ts

any, unknown

  • any는 타입스크립트 기능을 안 쓰는 타입
  • unknown도 any처럼 다 입력할 수 있지만 any보다는 조금 더 안전함
    - any와는 다르게 알 수 없는 타입이라고 컴파일러가 한번 체크를 하기 때문에 문제되는 코드 미리 예방 가능

Narrowing

  • type이 확실하지 않을 때 생기는 부작용을 막기위한 장치
  1. 방법
    1. typeof
    2. 속성명 in 오브젝트 자료형
    3. instanceof 부모
  2. assertion 문법
    1. 공식 가이드에서는 뭔가 중요한것처럼 보여서 여러번 봤었는데 굳이굳이 쓸 일 없는 내용
    2. 어떤 타입이 들어올 지 정말 확실하게 알고 있는데 컴파일러 오류가 날 때 잠시 타입체크를 막아놓고 확인하기 위한 용도로 사용

Generic

function 함수<Type>(x :Type[]) :Type {
	
}

  interface lengthCheck {
    length: number
  }

  function 함수H<T extends lengthCheck> (x :T) :number {
    return x.length;
  }

  console.log(함수H<string>('hel'))
  console.log(함수H<string[]>(['kin', 'pack']))
  • <> 형태로 Type을 파라미터로 입력할 수 있음.
  • 사용자가 입력하는 값이 타입이 되기 때문에 narrowing 을 써서 타입을 제한해야되는 경우가 있을 수 있는데 Type extends string 과 같이 extends 써서 타입파라미터부터 제한을 걸어줄 수도 있음.

Tuple & rest parameter

// rest 파라미터를 쓰는 경우 파라미터가 몇개 들어올 지 모른다는 뜻으로 사용하지만
// tuple과 같이 사용하면 rest 파라미터만 쓰고 array로 타입지정하는 것 보단 엄격하게 제한할 수 있음.
function 함수J(...rest :[string, boolean, ...(number|string)[]]) {

}

외부 파일 import 하는 경우 Typescript 문제

  • declare 키워드로 재정의하기
// data.js
var a = 10;
var b = { name : 'kim' };
declare let a :number;
console.log(a + 1);
  • js 파일의 변수를 가져다 쓰는데 타입에러나 변수 못 찾는 에러 방지할 때 타입에 대한 힌트를 주는 용도로 사용
  • declare 붙은 코드들은 js로 컴파일되지 않음. 단순 힌트를 주는 역할의 코드기 때문에

d.ts 파일

  • 타입만 정의해놓은 파일
  • 자바스크립트로 컴파일 되지 않음.
  • 보통 타입정의만 따로 해놓고 import 해서 쓰거나 프로젝트에서 사용하는 타입을 쭉 정리해놓는 레퍼런스 용도
  • d.ts 파일에 정의해둔 타입은 다 export 해서 사용해야함. ( d.ts 파일은 글로벌 모듈이 아니라서 export / import 해서 사용 가능)
    - ambient module : typescript에서는 import, export 없이도 타입을 같은 폴더 내 다른 파일에서 가져다 쓸 수 있음. ts 파일에 입력한 변수와 타입들이 전부 global 변수 취급받기 때문
  • Definitely Typed
    주로 쓰이는 라이브러리들의 d.ts 모아놓은 repository
  • TypeSearch
    타입정의 된 npm 패키지 검색 가능

GitHub - ein214/typescript_prac: typescript study

회고

  • 공식문서만 스터디하는 것보다 직접 해보고 강의 과제 통해 익혀나가는 게 확실히 머리에 더 잘들어옴
  • 공식문서의 모든 것이 실무에서 다 잘 쓰일 것 같지는 않다
  • api 작업하다보면 실무작업 할 때는 어떤 것들이 더 잘 쓰이는지 파악이 가능할 것 같다.
  • 내가 담당할 쪽에도 외부라이브러리가 한두개가 아닌데 어떻게 접목시킬지 벌써 깝깝함.
profile
재활훈련 중

0개의 댓글