구름 아카데미 후기 - 5

Rivelog·2023년 9월 6일

회고록

목록 보기
9/19

구름 아카데미 후기 4-3

  • 오늘도 타입 스크립트 강의 수강을 했다.
  • 전에는 신경 안쓰고 넘어가면서 새로 알게된 부분들이 있었다.
  • 강의를 들으면서 중요하거나 머리에 바로 안들어 오는 부분을 메모 했다.
  • 강의를 들을 수록 타입스크립트는 자바스크립트를 Java나 C같이 정적 컴파일을 하게 만드는 장치인것 같다.

ts컴파일러는 전역 모듈로 판단해서 다른 파일에 있는 동일한 변수명을 중복으로 처리한다.
-> export/import 같은 모듈 키워드를 사용하면 독립된 블록으로 판단한다
또는 컴파일러 설정에서
"moduleDetection": "force”,
를 추가한다.-> js 변환시 모듈 시스템 키워드가 자동 생성됨

  • 이해하는데 도움이 되는 중요한 타입 계층도이다.(공식 사이트에는 벤다이어그램으로 표현됐다고 한다.)
    타입 계층도

업캐스팅은 가능하지만. 다운 캐스팅은 불가능하다.

//이게 타입스크립트의 이해에 도움이 핵심 규칙인 것 같다.
Ex)

let num1:number = 10; 	
	let num2:10=10;
	num2 = num1 (x)
	num1 = num2(o)

Unknown => 모든 타입의 슈퍼 타입

Any=> never를 제외한 모든 타입의 서브타입과 슈퍼타입이 될 수 있다.

대수타입
-> 여러 타입을 합성해서 만든 타입
->합집합과 교집합 타입이 있다.

  • 합집합

Ex)


type Dog = {
    name:string;
    color:string;
}
type Person = {
    name:string;
    language:string;
}
 type union1 = Dog|Person
//2가지 대수타입의 객체 키값을 가지고 있어야한다. 예를들면 name키 값만 가지고 있으면, union1 타입이 될 수 없다.
  • 교집합
    Ex)
let variable = number & string; (never type) 

객체에서 주로 사용됨
// 모든 키 값을 가지고 있어야한다

타입단언
A as B 형식이고, A가 B의 슈퍼타입이거나 서브타입이어야한다.

Ex)

let num1 = 10 as never(o);
	let num2 = 10 as string(x);
	let num3 = 10 as unknown as string;(o); //에러는 발생하지않지만, 좋은 방법은 아님
  • const 단언
let num4 = 10 as const; 상수로 선언한 것과 같아짐(readonly)
  • non null 단언
type Post = {
	title:string;
	author?:string;
}
```ts
``` ts
const len: number = post.author?.length;

(x)optional chain때문에 null이나 undefined 일때 에러

const len: number = post.author!.length; (o)

//단언 자체가 좋은 방법은 아님

함수 타입

const add =(a:number, b:number)=> a+b;
  • 함수 타입 표현식
type operation = (a:number,b:number)=>number;
 const add:Opertion=(a,b)=>a+b; 
  • 함수 타입 호환성
    다른 함수 타입으로 취급이 가능한지 판단!
  1. 반환값 타입 호환 여부
type A =()=> number;
type B =()=> 10;

let a:A=()=>10;
let b:B=()=>10;

a=b; (o)
b=a; (x)

다운 캐스팅이 되면 안되는 규칙!!

  1. 매개변수 타입 호환 여부
    다운 캐스팅 가능
    객체를 예시로 보면 슈퍼타입보다 서브타입이 키가 많은 경우를 보면 이해하기 쉽다.

함수 오버로딩 (타입 스크립트에서만 가능 js(x))

인터페이스는 퍼블릭으로만 선언가능

출처: 한 입 크기로 잘라먹는 타입스크립트

profile
Just Do It

0개의 댓글