타입스크립트 TypeScript

자바스크립트 대용품
type 부분을 업그레이드
크기가 큰 프로젝트에서는 타입스크립트를 씀 (자바스크립트x)

 

자바스크립트는 dynamic typing을 가능하게 하는 언어라 문자를 숫자로 바꿔줌
편리한데 프로젝트 사이즈가 커지면 이렇게 자유도가 높은 것은 이게 단점이 됨

1. 그래서 타입스크립트를 사용하면 타입을 엄격하게 검사해줌
2. 에러 메세지 퀄리티가 높음

그래서 코드 에디터 부가기능 역할로 봐도 무방

 

TypeScript 설치

1. 최신 버전 nodejs 설치
2. 터미널 오픈 -> npm install -g typescript
3. 에디터 폴더 오픈
4. index.ts 타입스크립트 파일 생성
5. tsconfig.json 생성
5-1. 

{   
  "compilerOptions" : {     
    "target": "es5",     
    "module": "commonjs",  
  } 
}

6. index.ts 코드 짜기 (브라우저에서 못 읽음)
6-1. ts파일을 js로 변환해야 사용가능 tsc -w (코딩은 ts에, html에 꽂을땐 js)

 

문법

1. 변수 타입 지정 가능

let 이름 :string = 'kim'; //string 타입
let 이름 :string[] = ['kim', 'park']; //array 타입
let 이름 :{ name : 'string' } = { name : 'kim' } //object 타입
let 이름 :string[] | number = 'kim'  //다양한 타입 Union type

2. 변수 생성

type Name = string | number;
let 이름 :Name = 123;

3. 함수 생성 시 Type 지정 가능

function 함수 (x :number) :number {
	return x * 2
  }
함수('123')

 

4. array에 쓸 수 있는 tuple 타입 (array에 숫자만을 타입지정 가능)

type Member = [number, boolean];
let john:Member = [123, true];

5. object에 타입지정해야할 속성이 너무 많으면

type Member = {
	[key :string] string,
	
}
let john :Member = { name : 'kim', age : '123' }

6. class 타입 지정 가능

class User {
	name :string;
	constructor(name :string){
	  this.name = name;
	}
}

 

코딩애플 - 타입스크립트 참조

https://youtu.be/xkpcNolC270?si=RSP6X0yk83yuJfOq