#2. How Typescript Works

타입스크립트 : 프로그래밍 언어.

strolngly typed(강타입)

컴파일러를 통해 기계가 실행할 수 있는 다른  코드로 변환됨.

타입스크립트는 컴파일러에 의해 js로 변환됨. 브라우저는 타입스크립트가 아니라 js를 이해하기 때문.

typescript는 개발자가 실수하지 않도록 보호해줌.

=> 어떻게 보호해줄까?

 

 

불안정한 js언어를 돌려줌.

타입스크립트 코드가 실행되기 전에 보호장치가 작동함.

에러가 발생할것 같은 코드를 감지하면, 아예 컴파일 되지 않음.

변환된 자바스크립트 안에서 실수가 일어나지 않게 하기 위해. 

 

 

예시 #1)

const nico = { nickname : "nick" }

nico.hello()

// 빨간줄로 에러 발생해줌.

 

예시 #2)

[1,2,3,4] + false

// 타입 에러 발생.

 

예시 #3)

function divide(a, b) {

    return a/b

}

divide("hello")

// 인자 2개 필요, 타입 string 에러(숫자여야 함)

 

 

예시 #4) _ 타입추론!!

const player = {

    age:12

}

player.age = false

// 숫자에서 boolean으로 타입을 바꿀 수 없다는 에러 발생.

 

 

타입 시스템

모든것의 타입을 정해서 명시해줘서 컴파일러에게 알려줘야 함.

VS.

typescript가 타입을 추론해줌.

 

예시 #1)

let a = "hello"

// a 가 string이어야 한다는 것을 알고 있음.

a = "bye"

// string에서 string으로 바뀌었기때문에 불평하지 않음.

a = 1

// string에서 number으로 값을 바꾸려고 하기 때문에 오류 발생시킴..

 

예시 #2)

## 타입 명시하는 방법

let b : boolean = "x"

// 변수 b가 boolean이어야 한다. Type Checker 과 소통하는 법.

let b : boolean = false

let c = [1,2,3]

// number[]

c.put("2")

// array의 요소에 다른 타입을 섞지 않음.

 

let d = []

d.puch("1")

// number들의 array가 필요할 경우 명시적으로 표시해줘야함.

let d : number[] = []

d.push(1)

 

 

 

기본적인 타입 이외의 타입

 : 콜론 + 타입 으로 표시

 

let a : number = 1;

let b : string = "il";

let c : boolean[] = [true]

 

let a : number[] = [1,2];

let b : string[] = ["il", "1"];

let c : boolean[] = [true]

 

let a : number= [1,2];

let b : string = ["il", "1"];

let c : boolean = [true]

=> 가능한 Typescript로 추론하게 하는것이 좋음.

 

 

const player = {

    name:"nico"

}

player.name = 1