Typescript

🪴 javascript+type = typescript

🌿 시작하기

• node.js 최신파일 설치하기

• npm install -g typescript 입력하기
  - 오류 발생시 >

  • 맥북일 경우에는 앞에 "sudo"라는 글자 붙여보기

• ~.ts 파일을 만들기

• "tsconfig.json" 만들기

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

tsconfig.json파일에 적어주기

• .ts 파일은 브라우저가 인식을 못하고 자바스크립트 파일만 인식할 수 있기 때문에 변환해줄 수 있도록 터미널에 "tsc-w"명령어를 입력해주면 자동으로 타입스크립트 파일을 자바스크립트로 변환해준다.
  -->자바스크립으로 변환해주는 것은 "compile" 이라고 함

🌿 간단한 typescript 문법

1. 변수 타입지정가능

let fruit: string = "apple";
// 이변수에는 string(문자) type만 들어올 수 있습니다.
// 다른 자료형을 넣으면 오류를 나타내 준다. 

• 타입에 들어갈 수 있는 것(자료형) : string, number, boolean, null, undefined, bigint, [], {}, 등

2. array 타입지정

let fruit: string[] = ["apple", "banana"];

== string[] : string이 담긴 배열만 올수 있다는 뜻 

3. object 타입지정

let object: { name: string } = { name: "kim" };
let object: { name?: string } = { name: "kim" };
-> 속성이 완벽하지 않을때 ? 를 써주면 오류가 나지 않는다 

4. union 타입 -> 다양한 타입이 들어올 수 있다.

let choice: string | number = 123 or "kim"

5. 타입은 변수에 담아 쓸 수 있다.

type MyType = string | number;
let choice: MyType = "kim";
->타입은 대문자로 많이 작성한다 

6. 함수

function f(x: number): number {
  return x * 2;
}

7. array에 쓸 수 있는 tuple 타입

type Member = [number, boolean];

let john:Member = [123,true]
// 무조건 첫번째에는 number, 두번째에는 boolena이 들어가야 한다. 

8.object 타입지정해야할 속성이 너무 많을 경우

type Member = {
  [key: string]: string;
};

let john: Member = { name: "kim" , age : "123"};
//[key : string] -> 모든 object 속성  : string,
// 글자로된 모든 object 속성의 타입은  string