TypeScript 기본 사용법

🔗 참고자료

📌 TypeScript

🏷️ 특징

• 자바스크립트보다 훨씬 엄격한 문법의 문서이다.
• 확장자명 .ts
• 브라우저가 읽지를 못한다. 그래서 자바스크립트로 꼭 컴파일 해줘야한다.

📌 설치

npm i -g typescript

📌 자바스크립트로 컴파일 하기

tsconpig.json 파일에 컴파일할 옵션 정하기

→ 명령어를 입력하면 자동으로 자바스크립트 파일 생성

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

• 명령어 tsc -w
• 나가기 Ctrl + c

📌 타입스크립트 문법

• 일반 변수랑 차별화 주기 위해 타입변수 이름의 첫글자는 대문자로 선언한다.

• 변수에 타입 지정하기

  let 변수이름:string = '벨로그’

  이 변수에는 문자값만 올 수 있다.

  let 변수이름:string[] = ['벨로그’, ‘깃허브’]

  이 변수에는 문자값을 가지고 있는 배열만 올 수 있다.

  let 변수이름: { age: number } = { age: 20 }

  이 변수에는 객체가 들어올 수 잇는데 age라는 key값에 value 값은 number 타입만 들어올 수 있다.

  let 변수이름 : string | number = ‘벨로그’

  let 변수이름 : string | number = 123;

  여러 개의 타입을 지정해 줄 수 있다.
  

• 타입 변수 선언

  • type 이름 = 타입 지정;
  • let 변수이름 : 타입변수이름 = 123;

• 함수 선언

function 함수이름(파라미터 :타입지정) : 리턴값타입지정{
	return
}

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

• 배열 타입 선언(튜플 타입)

type 배열 = [타입1, 타입2];

만약, 타입1의 값이 number이면 첫번째는 숫자값만 들어올 수 있고
타입2의 값이 boolean이면 두번째는 true,false만 올수있다.
-> **Tuple 타입**

let 변수이름:배열변수 = [123, true]