Typescript①

TYPE SCRIPT

strongly typed programming language = 강형언어
모든 변수의 타입이 컴파일 시에 결정되는 언어로 자료형에 대한 오류를 컴파일 시 검출 가능

typescript 강점

⭐ type-safety : 버그, 런타임 에러가 줄어듦 -> 생산성 高

JS의 이상한 허용 : 불안정한 언어

자바스크립트는 Dynamic Typing이 가능하기에 이상한 허용이 발생한다
ex) 5 - '3' //error가 아닌 2결과 도출

(1)

[1,2,3,4] + false
-> '1,2,3,4false' : string

참으로 정신 나간 코드...

(2)

function divide(a, b) {
	return a/b
}

divide('xxxx') -> NaN

(3)

• javascript

let a = 'hello'
a = 'bye' (O)
a = 1 (O)

• typescript

let a = 'hello'
a = 'bye' (O)
a = 1 (X)

코드를 보호해줄 수 있는 이유?!

자바스크립트
런타임 에러 발생, (실행화면에서 에러가 발생 -> 사용자가 에러 발견 가능성)

타입스크립트
JS로 변환되기 이전에 발생 (= 런타임 이전)
에러 발생 코드 감지 -> 컴파일되지 않음

컴파일
: 주어진 language로 작성된 컴퓨터 프로그램을 다른 언어의 동등한 프로그램으로 변환하는 프로세스

typescript -> javascript

Type system

2가지 접근방식

1. 데이터와 변수의 타입을 명시적 정의

2. 기존 JS와 같이 변수만 생성
   : typescript가 타입을 추론해준다~!

   
   
   

데이터 타입

Optional type : ?

const playerNico : {
    name: string,
    age?: number
} = {
    name: 'nico'
}

Alias(별칭) type : 첫글자는 대문자로 지정

타입을 변수에 담아서 사용할 수 있다

type Name = string;
type Age = number;
type Player = {
    name : Name,
    age? : Age
}

const nico : Player = {
    name: 'nico'
}

const jay : Player = {
    name: 'jay',
    age: 10
}

함수 return 값의 타입을 지정하는 방법

• function (parameter : 매개변수 타입) : 함수 리턴값의 타입 {}
• const variable = (parameter : 매개변수 타입) : 함수 리턴값의 타입 => {}

type Player = {
    name : string,
    age? : number
}

const playerMaker = (name : string) : Player => ({name})

const nico = playerMaker('nico');
nico.age = 12