[Typescript] 타입스크립트로 블록체인 만들기 강의 학습 #2

자바스크립트 문제점

자바스크립트는 기본적으로 타입을 명시하지 않고, 존재하지 않는 함수를 호출하는 경우에도 컴파일 전에 오류를 발생시키지 않는다.

아래와 같이 자바스크립트 오류 발생 예시

function sum(a, b){
	return a+b;
}

sum("javascript"); // sum의 매개변수는 2개, 호출 인자는 1개지만 javscript에서 오류로 인식하지 않음.

sum2(1, 3); // sum2 라는 이름의 함수가 정의되지 않았지만 실행 전에 오류로 인식하지 않아 런타임 에러가 발생한다.

[1, 2, 3, 4] + false // 에러가 발생하지 않고 문자열로 인식하여 1,2,3,4false로 출력됨

타입스크립트란

타입스크립트는 자바스크립트 언어에 타입을 명시할 수 있도록 하는 언어이다.
타입스크립트는 컴파일 후 자바스크립트로 변환되어 실행되는데, 이 때 타입스크립트 컴파일러가 자바스크립트에서 발생하는 문제점들을 미리 방지한다.
따라서, 자바스크립트는 런타임 에러를 통해 예기치 못한 에러가 발생할 수 있지만 타입스크립트는 프로그램 소스코드를 작성 중에 오류를 인식하여 개발자의 실수를 줄일 수 있다.

타입

타입스크립트도 자바스크립트와 동일하게 타입을 명시하지 않고도 작성할 수 있다.

• 타입추론 (Type Inference)

let name = "jeonghun"
name = 1; // error

타입스크립트는 타입 추론을 통해 자료형을 명시하지 않아도 자바스크립트처럼 변수를 초기화 할 수 있다. 하지만, 이후에 다른 타입의 값을 저장하는 것은 불가능

• 타입명시 (Type Anotations)

let name: string = "jeonghun"

명시적 표현은 코드의 가독성을 해칠 수 있기 때문에 최소화하여 사용하는 것이 권장된다.

const player: {
	name: string,
    age?: number       // optional parameter
} = {
	name= "jeonghun"   // optional parameter로 인해 age를 선언하지 않아도 에러가 발생하지 않음
}
if(player && player.age < 10)

• Alias Type

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

오브젝트 타입과 같이 중복되는 코드를 줄이기 위해 사전에 선언하고 해당 alias 타입을 타입으로 사용할 수 있다.

type Player = {
	name: string,
    age?: number
}
function playerMaker(name: string): Player{
	return {
 		name;   
    }
 }
const jh = playerMaker("jeonghun");
jh.age = 10; //playerMaker return가 Player이므로 타입 추론을 통해 jh가 Player 오브젝트 타입으로 인식

• Type in Arrow Function

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

Readonly (불변성, Immutable)

타입스크립트는 readonly를 통해 해당 요소를 읽기 전용으로 만들 수 있다. readonly는 타입스크립트에만 있는데 javascript로 어떻게 변환해서 읽기 전용을 유지하는지?

type Player = {
	readonly name,
    age
}
const jh: Player = playerMaker("jhcha");
jh.name = "jeonghun"; // 불가능

Tuple

tuple은 타입스크립트에서만 지원한다. tuple은 배열을 생성할 수 있게 하고, 최소 크기를 지정해야 하며, 특정 위치에 특정 타입을 정의해야 한다.

const player: [string, number, boolean] = ["jh", 1, true]

Any Type

any 타입은 타입에 제약을 받지 않는다. 따라서, 타입스크립트의 타입 보호장치로부터 벗어나 자바스크립트 사용과 동일한 영향을 갖는다.

void

function hello(){  // :void 아무것도 리턴하지 않는다.
	console.log('x');
}

never

function hello(name: string | number){
	if(typeof name === "string"){
    	name
    } else if (typeof name === "number"){
    	name
    } else {  // 절대 실행되지 않아야 하는 코드 never 
    	name
    }
}

unknown

타입스크립트에 타입을 모를 때 명시할 수 있는 타입

let a: unknown;
if(typeof a === 'number'){
  let b = a+1; // 이 안에서는 a의 자료형이 number로 취급
}