학원 끝! 타입스크립트 시작!

https://youtu.be/VJ8rvsw2j5w

 

타입스크립트는 자바스크립트를 사용하며 모든 기능을 포함하나

자바스크립트에 포함되지 않은 새로운 기능이 있다.

즉, 자바스크립트의 타입부분을 업그레이드한 것

- 변수 값에 데이터 타입 지정 가능

function add (a, b) {
	return a+b;
}
console.log(add('3', '5')); // 35

////////

function add (a: number, b:number) {
	return a+b;
}
console.log(add('3', '5')); // error

- 객체지향적 프로그래밍 지향

- 컴파일 타임 오류 발견 가능

 

타입스크립트는 프로그래밍 언어인 동시에 컴파일러인 것이다.

 

 

타입스크립트 개발 환경 설정

npm i -g typescript

 

기본적인 확장자는 .ts 이며, 해당 파일 안에서 자바스크립트도 작성 가능하다.

 

작성이 완료된 ts 파일을 tsc ts파일명 명령어를 사용하여 타입스크립트를 자바스크립트로 변환(js파일 생성)해주고,

만들어진 js 파일은 node js파일명 으로 실행해주는 순서이다.

다만, 매번 ts파일을 수정할 때마다 tsc 로 자바스크립트를 변환해주는 것은 번거롭기 때문에 tsc -w ts파일명을 사용하여 변경 사항을 자동으로 js로 변환시켜주게 된다(Watch Scss 와 비슷함)

 

***만약 js 파일을 만들었을 때 ts 파일 내에서 중복된 선언이라는 에러가 발생한다면 tsc --int 을 사용하여 타입스크립트 설정을 해주면 된다! 그럼 tsconfi.json 파일이 자동으로 생성된다!

 

 

Static Typing (정적 타이핑)

타입을 선언해줘야 하는 것!

 

타입 추론 Type Inference

타입스크립트는 따로 타입 표기가 없는 경우, 타입을 추론해준다. 즉, 선언해준 초기값을 보고 타입을 유추하는 것이다.

유추해준 타입과 다른 값을 넣어주면 에러가 발생한다!

 

타입 명시

변수를 선언할 때, 변수 값의 타입을 명시하여 변수 값의 데이터 타입을 지정하는 것

string / number / boolean / object / void / any ...

 

let 변수명 : 타입 = 값; 형태로 변수 선언

function 함수명(파라미터) : 리턴타입 { } 형태로 함수 선언 - void 는 변환되지 않을 때

// object 를 타입으로 지정해줄 때, 자세히 타입을 지정해줄 수 있다.
function 함수명(파라미터: 타입): {
	키: 타입;
    키: 타입; ...
} { }