TypeScript 시작하기_1

1. typescript 설치

npm i -g typescript

2. tsconfig.json 셋팅

{
  "compilerOptions": {
    "target": "es5", // 'es3', 'es5', 'es2015', 'es2016', 'es2017','es2018', 'esnext' 가능
    "module": "commonjs", //무슨 import 문법 쓸건지 'commonjs', 'amd', 'es2015', 'esnext'
  }
}

3. 타입스크립스 실행

tsc -w

---

Type Script 변수 만들기

let 이름 = "Kim" //기존 JS 변수 만들기

let 이름: string = "Kim" //TS 변수 만들기

기존에 JS는 엄격하지 않았다면 TS의 경우 엄격하게 타입을 지정해 줄 수 있다. 나머지도 마찬가지로 다른 타입들도 지정해보겠다.

let 나이:number = 50; //number

let 공부했니:boolean = true; //boolean

let 회원들 : string[] =["kim","park"] //array

let member:  
{
  member1:string,
  member2:string
} 
= {
	member1:"kim",
  	member2:"park",
} //object

---

타입을 미리 정하기 애매할 때

let member = [1,'2',3]
let object = { a:string } = { a: 123 }

타입이 숫자안에 문자들이 들어가게 되면? 애매할 땐 어떻게 해야할까?

let member:(number | string)[] = [1,'2',3]
let object = { a: string | number } = { a: 123 }

1. Union Type

let 회원2: number | string = 123;
let 오브젝트: { a: string | number } = { a: "123" };

2. Any Type

모든 할당에 에러가 안난다.

let 이름: any = ?
이름 = 123;
이름 = [];

3. unknown vs Any

동일하게 모든 할당에 에러가 안난다.
조금 더 안전한 타입은 unknown > Any unknown 조금 더 안전하다.
이유는 ? any타입은 모든~정말 모든 엄격함이 풀린상태이다.
unknown은 간단한 수학 연산도 타입이 맞아야한다.

---

함수에 Type 지정하는 법

function 함수(x){
	return x *2
}

-함수에 파라미터가 지정되어있고, 파라미터에 타입지정까지 되어있다면 타입지정된 파라미터는 필수다.

함수에서만 쓸 수 있는 void
return 실수로 하는걸 사전에 막을 수 있음
'아무것도 없이 공허함'을 뜻하는 타입인데
return할 자료가 없는 함수의 타입으로 사용가능합니다.

타입 확정하기 Narrowing

아직 파라미터의 x의 타입이 확실하지 않으나 타입을 확정지어야 할 떄 사용,
하나의 타입으로 Narrowing할 때 쓸 때 쓴다.

function 내함수1(x:number|string){
  if(typeof x === 'string'){
    return x + '1'
  } else {
    return x + 1
  }
}

function 내함수(x:number|string){
  let array:number[]=[];
  if(typeof x === 'number'){
    array[0] = x;
  }
}

타입 확정하기 Assertion

Assertion 용도는 하나의 타입으로 Narrowing할 때 쓸 때 쓴다.
무슨 타입이 들어올지 100% 확실할 때 쓰자. 평소에는 X

// 타입 확정하기 Assertion
function 내함수2(x:number|string){
  let array:number[]=[];
  array[0] = x as number; //타잎 덮어쓰기
}
내함수2(123)