🎃 일단 설치

1. npm install -g typescript
   
   

2. .ts파일 생성
   
   

3. tsconfig.json 생성 후 밑에 내용 작성

자세한 사항은 https://codingapple.com/unit/typescript-tsconfig-json/ 참고하자

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

4. tsc -w 터미널에 입력
   ts파일이 저장될때마다 자동으로 js로 변환됩니다!
   <script src="변환된파일.js"></script>
   이거쓰면댐.

🤠 기본 문법 - type 지정

타입스크립트는 타입지정이 원래 자동으로 됩니다.

let 이름 = 'park'
let 이름 :string = 'park'
한거랑 똑같습니다

그래도 자세히 한번 알아봅시다

변수 타입

let name :string = 'kim'; 
let something :string | number = 2000;


//타입을 변수에 지정하자
type StrOrNum = string | number;
let school :StrOrNum ='esa';

함수 타입 - void

void도 알아보자!

						👇어떤 type이 return될지 정의
function 함수(x :number) :number{
  	         👆파라미터로 number가 들어가야해요
  return x+2
}

👀 void란?
//return할 자료가 없는 함수를 명시할때 !!
function fun(x? :number) :void {
  console.log('hzi');
}
fun();
-->만약 x옆에 물음표가없다면, fun(3) 이렇게 해야한다.

array의 tuple 타입

let name :string[] =['kim','jung'];
//이 변수에는 string 담긴 array 만 들어올수있어요

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

Object 타입

//object 타입 지정 ==> ex. age속성에는 숫자만 들어오게!
let age :{age:number} = {age:25}
let hobby :{ hobby? : string } = {hobby:'reading'} //hobby 속성은 옵션

//object의 key를 싸잡아서 지정해보자
type Member = {
  [key :string] : string,
}

class 타입

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

😇 매우쉬운 연습문제

내가 좋아하는 가수

let fav :{ name : string, title: string }
= {name:'IVE',title:'I AM'} 

다음과 같이 생긴 자료의 타입지정을 해보자

let project = {
	member: ['kim','park'],
  	days: 30,
  	started:true,
}

👇👇👇

let project :{
	member: string[],
  	days : number,
  	started: boolean
} = {
	member: ['kim','park'],
  	days: 30,
  	started:true,
}

물음표 자세히 알아보자🤔

만약 , 파라미터가 옵션일경우, (있어도되고 없어도됨)
타입스크립트에선 미리 "이 파라미터는 옵션임" 이렇게 정의를 해주셔야 에러가 나지 않습니다.
==> ? 물음표를 이용

function 내함수(x? :number) { 

}
내함수(); //가능
내함수(2); //가능

🌟 물음표는 사실 x : number | undefined 이거랑 똑같 🌟

파라미터가 정의가 안되면 자동으로 undefined가 됩니다요