타입스크립트

- 타입스크립트는 자바스크립트로 컴파일 되는 언어 입니다.

- 자바스크립트는 컴파일되는 프로그램이 아니기 때문에 프로그램이 실행시에 에러가 났을때에야 잘못된 것을 알 수 있다.

- 타입스크립트는 자바스크립트에 타입을 추가한 언어.

 

타입스크립트의 이점

1.컴파일 시점에 에러를 확인할 수 있다.

2.타입이 있기 때문에 개발 툴에서 개발자에게 상대적으로 더 많은 도움을 줄 수 있다. -> 자동완성

 

타입 애너테이션

- 타입을 명시하는 방법

- var,let,const 이후에 <변수명>:<타입>형식으로 변수를 선언

 

let username:string = "hello";
let height:number = 200;
let isGood:boolean = true;

function printMessage(message: string):void {
	console.log(message);
}

let myInfo: {name:string; height:number, isGood:boolean} = {
	name:'tom',
    height:120,
    isGood:true,
}

 

기본타입 7종

- null,undefined,boolean,string,number,bigint,symbol

 

배열과 튜플

const numbers:number[] = [1,2,3];
const stringArray:Array<string> = ["a","b","c"];

 

- 배열은 크기가 고정이 아님

 

const myTuple:[string,number] = ["woo",3];

 

- 튜플은 원소개수 만큼 타입 정의가 필요

- 원소 개수가 고정

 

any,void,never

any: 타입을 모르거나 지정할 수 없을때

 

let anyValue:any = 5;

 

void와 never는 반환값에 지정하는 타입

void:함수의 결과값이 없을때

never: 예외를 발생

 

유니온 타입과 내로잉

- 유니온 타입을 사용하면 변수 하나를 여러가지 타입으로 지정

- | 기호로 타입을 구분

 

let anyValue:number|string|boolean = 10;

 

- 내로잉은 타입의 범위를 좁히는 것

- typeof,instanceof,in 사용

 

타입 별칭

- 자주 사용해야 하는 유니온 타입의 경우 타입 별칭을 사용

type nsb = number | string | boolean;

 

인터섹션 타입

- 타입 A가 있고 타입 B가 있다면 A이면서 B인 타입을 정의

- 기호도 AND를 뜻하는 & 를 사용하여 A&B 로 표현

 

리터럴 타입

- 기본 타입의 값들을 조합해서 한정적인 값들만 나타내는 타입을 만들수 있다.

 

type size = "small" | "medium" | "large"

 

 

함수 타입

- 자바스크립트와 타입스크립트에서는 함수를 값처럼 사용할 수 있다.

- 기존과 동일하게 type 타입명 = 타입 형태로 작성해주면 됩니다.

 

type FuncEcho3 = {
	(message:string):string;
}

const funcEcho3: FuncEcho3 = echo;

 

 

인터페이스와 클래스

 

type	interface
기존타입 또는 새 타입을 생성하는 데 사용	객체 타입의 구조를 정의하는데 사용
다른타입 또는 인터페이스를 상속하거나 구현할 수 없음	다른 인터페이스를 상속하거나 구현할 수 있음
리터럴 타입, 유니온 타입,인터섹션 타입을 사용할 수 있음	extends 키워드로 인터페이스 확장이 가능
간단한 타입 별칭을 생성할 때 적합	잘 정의된 구조의 객체 타입을 정의할 때 적합

 

 

선택적 속성과 읽기 전용 속성

- 속성에 ? 를 붙이면 선택적 속성

- 있어도 되고 없어도 된다는 뜻

- readonly를 붙이면 읽기 전용이란 뜻

 

 

인터페이스 확장하기

- 인터페이스는 확장이 가능

- extends 사용

 

인터페이스 병합

- 타입스크립트에서 같은 이름의 인터페이스가 있다고 해서 에러가 나지는 않는다

- 이름이 같은 인터페이스들이 각각 속성이 다르다면 인터페이스를 병합해 준다.

 

클래스의 메서드와 속성

- 클래스는 class <클래스명> 형식으로 선언

- 생성자 메서드는 constructor (매개변수: 타입 ...){}