TypeScirpt 개념 복습하기

hodu·2023년 2월 25일
0

자바스크립트에 이어 타입스크립트 개념을 다시 복습하고 싶어서 정리하였다.

https://www.youtube.com/watch?v=prfgfj03_VA&list=PLZKTXPmaJk8KhKQ_BILr1JKCJbR0EGlx0&index=4
위 영상의 내용들을 정리했다.

설명을 잘해주셔서 금방 이해가 되었고, 프로젝트를 할 때는 그때 당시 오류를 해결하기위해 급급했는데, 여유롭게 개념들을 익히니 자신감이 생겼다.


JavaScirpt (동적 언어):
런타임에 타입 결정 / 오류 발견

java, TypeScript (정적 언어):
컴파일 타임에 타입 결정 / 오류 발견

정적언어로 로직을 짜면 시간은 오래 걸리겠지만
안정적이고 빠르게 작업을 진행할 수 있다.


let a: Array=[1,2,3];
Array로 선언해서 number 넣는 것을 몰랐었다.
평소에는 number[]로 작성했었다.

에러를 발생하거나 영원히 반복되는 함수에게는 return 값을 never로 줄 수 있다.


객체를 선언할 때 각 키값에 맞춰서 타입을 적어야한다.
키값에 ? 붙히면 처음에는 없다가 나중에 생겨도 문제가 없다.
readonly 같은 경우는 한번 값을 할당해주면 이후에 수정할 수가 없다.
읽기 전용이어서 그다음부터는 수정이 안된다.

1?:string;
2?:string;
3?:string;
4?:string;

1:"A"
2:"B"
3:"C"
4:"D"

타입을 선언하면 번거롭다. 이런 경우 심플하게 작성할 수 있는데

[grade:number]: string; 이렇게 단축하여서 쓸 수 있다.
grade는 어떠한 문자가 와도 상관 없다.

그리고 string으로 적었는데 string의 범위는 포괄적이다.
문자열 리터럴 타입을 할당해줘서 범위를 줄여준다.

type Score = 'A' | 'B' | 'C' | 'D';

선언하고

[grade:number]: Score로 할당해줄 수 있다.

이제 grade에는 문자열 안에 있는 타입 외에는 할당해줄 수 없다.
예시로 다른 영어나 소문자를 넣으면 오류가 뜬다.



함수정의는 이런 식으로 해준다.

parameter의 타입을 먼저 정의해주고 리턴 값의 타입을 정의해준다.


class 정의 하는 법
implements

constructor을 선언해서 사용하면
기존의 값을 밖에다가 선언하고 할당해주는 식으로 써줘야한다.

extends를 사용하여 기존의 속성들을 전달할 수 있다.


기존의 갖고 있던 값들을 넘겨준다.


함수 타입 정의

인터페이스처럼 함수로 옵셔널하게 타입을 정의할 수 있다.

이런 경우 좀 더 명시적으로 알려줄 필요가 있다.

자바스크립트의 특성을 이용해


디폴트 값을 제공하는 방법도 있다.
두가지 방법으로 쓸 수 있다.

선택적 매개변수가 필수 매개변수보다 앞에 오면 오류가 뜬다.

그럼에도 사용하고 싶다면 undefined를 활용하여 사용할 수 있다.


나머지 매개변수를 사용할 경우 갯수가 매번 다를 수 있다.
배열로 선언할 수 있다.


this를 사용할 경우에도 미리 타입을 명시해줘야한다.


전달받은 인자가 숫자인지 글자인지에 따라서 리턴값이 달라진다.
이런 조건부인 경우에는 오버로드를 사용한다.
함수 오버로드는 전달받은 매개변수에 의해 다르게 행동하게 하는 것을 의미한다.

오류가 뜬다.

오버로드를 사용하여 오류를 해결하였다.

마무리

타입스크립트에 관해서 좀 더 공부하고 싶었지만,, 취업을 위해서 공부해야하고 할게 있어서 멈추었다.. 취업은 단순히 특정 언어를 잘하는 것도 중요하겠지만, 프로젝트 cs개념 외에 다양한게 공부할 내용들이 있어서 아쉬움을 남기고 다른 것으로 넘어가야겠다.

profile
잘부탁드립니다.

0개의 댓글