8월 13일 - 2차

은채·2022년 9월 1일
0
post-thumbnail

1. 타입스크립트를 사용하는 이유

안전성

1) 동적타입 언어 (= 자바스크립트)
=> 런타임에 실제 코드 값이 평가 될 시점에야 이 변수에 들어올 값과 타입을 알 수 있다. (코드에 있는 변수의 이름을 보고 추측해야함)

2) 정적타입 언어 (= 자바)
=> 컴파일 타임에 변수의 타입을 결정 (즉, 실제 코드를 실행해 보지 않아도 변수 값이 무슨 타입인지 빌드 시 알 수 있다)

<<<까봐야 아는 코드>>> 는 안전하지 않다

편리성

익숙해지고 나면 개발속도가 현저하게 빨라진다

자동완성기능

타입스크립트는 IDE에 타입 힌트를 줄 수 있는 도구에 더 가깝게 느껴짐
직접 모든 코드를 작성하지 않고, IDE가 추론해준 선택지들 사이에서 고르는 방식으로 개발이 가능
LSP(Language Server Protocol)에 의해 개발자가 작성된 코드의 타입이 실시간으로 체크

hihello에 타입을 부여하지 않았음에도 자동으로 string 타입이 추론

타입스크립트 연습장

주의!! as , ! 등의 타입 단언 시, 잘못 사용할 경우 자바스크립트 실행 시 런타임 에러가 발생할 수 있다. any나 불필용한 타입 단언을 사용하지 않도록 노력하기 (ㅠㅠ)

문서화

@types/라는 이름이 붙은 패키지들 : 타입 정보만을 모아놓은 라이브러리
리액트를 비롯한 라이브러리의 패키지들을 뜯어보며 어떤 느낌으로 추상화 되었는지 알아보면 좋음
=> 함수의 인자로 이벤트 객체를 받을 때 잘 사용할 수 있음

2. 심화 개념

제네릭

인자로 타입을 받는 함수

타입 좁히기 (타입 가드 & 타입 추론)

함수의 인자 하나가 2개 이상의 타입을 가질 수 있고, 타입에 따라 각기 다른 처리를 하는 법 => 분기 처리

const sayHello = (hello: string | string[]) => {
	if (Array.isArray(hello)) {
   hello.forEach((h) => console.log(h)) // (parameter) hello: string[]
   return;
	}
	return console.log(hello) // (parameter) hello: string
}

다른 예시

어!! 트라이캐치 에러!
타입스크립트에서 항상 빨간줄이 나오는 !!
이때 error에 마우스 올리면 unknown으로 타입 추론이 된다.

왜????
throw 문이 던질 수 있는 건 Error 객체 뿐만이 아니기 때문(throw문 - MDN)이라고 한다!!

더 읽어볼 자료

우와! 그동안 error가 왜 unknown인지, message에 왜 에러가 나는지 알아볼 생각을 못하고 그저 any => 나중에는 as Error로 타입 단언을 했었는데 이제 조금 알 것 같다 ㅎㅎ
프로젝트 타입 리팩토링 할 때, 이 부분을 조금 참고해서 수정해 보면 좋을 듯.

이렇게..

2회차 회고

타입스크립트도 정말 ㅈㅔ 대로 공부해야한다.
지금은 기초적으로 배운 내용을 가지고, 타입 추론해주는 것을 사용하는 정도?
추론으로도 안되는 부분만 검색해서 타입을 작성하고...
여전히 공부해야 할 게 많은게 확 느껴진다.
세션도 후반부에는 너무 어려웠다 ㅎㅎ후ㅜㅜㅜㅜㅜ

그래도 휴가에 까지 노트북 들구 가서 세션 들으려고 한 나를 칭찬하고
좋은 경치보면서 들으니까 색다른 느낌이었다.
이것이 디지털 노마드....?

ㅋㅋㅋㅋㅋ 세션 듣느라 엄마아빠가 너무 오래 기다려서 ㅜㅜ

profile
반반무마니

0개의 댓글