[TypeScript] 특징 및 기본 타입 - void, never, enum

TypeScript를 사용하는 이유?

우리가 사용하는 브라우저들은 타입스크립트를 이해하지 못하며,

타입스크립트를 자바스크립트로 변환해서 로드해야 실행할 수 있다. 

출처 - Youtube 채널, <코딩앙마>

 

JavaScript Vs. TypeScript

---

Javascript (동적 언어)

런타임(코드가 실행될 때)에 타입이 결정되고, 오류를 발견한다.

그래서 개발자가 실수하게 되면, 사용자가 오류를 볼 수 있게 된다. ( 안정성 저해 )

 

Java, TypeScript (정적 언어)

컴파일 타임에 타입이 결정되고, 오류를 발견한다. (* 컴파일 : 어떤 언어의 코드 전체를 다른 언어로 바꿔주는 과정)

초기에 시간이 걸리더라도 한 번 작성해 두면 안정적이고 빠르게 작업을 진행할 수 있다.

 

📌 예제1. JavaScript  ▶ TypeScript

function add(num1, num2) {
  console.log(num1, num2);
}

add();
add(1);
add(1, 2);
add(3, 4, 5);
add("hello ", "world");

function add(num1:number, num2:number) {
  console.log(num1, num2);
}

// add();
// add(1);
add(1, 2);
// add(3, 4, 5);
// add("hello ", "world");

 

📌 예제2. JavaScript  ▶ TypeScript

function showItems(arr) {
  arr.forEach((item) => {
    console.log(item);
  })
}

showItems([1,2,3]);
showItems(1,2,3);

function showItems(arr:number[]) {
  arr.forEach((item) => {
    console.log(item);
  })
}

showItems([1,2,3]);
showItems(1,2,3);
showItems(["a", "b", "c"])

 

기본 타입

📌 string, number, boolean, Array(string, number)

let car:string = "bmw";
let age:number = 30;
let isAdult:boolean = true;

// Array
let a1:number[] = [1, 2, 3];
let a2:Array<number> = [1, 2, 3];

let week1:string[] = ["mon", "tue", "wed"];
let week2:Array<string> = ["mon", "tue", "wed"];

week1.push(3) // Error

📌 튜플(Tuple)

let b: [string, number];
// 첫번째 요소는 string, 두번째 요소는 number를 넣을 수 있다.

b = ["z", 1]
// b = [1, "z"] -> Error

b[0].toLowerCase();
// b[1].toLowerCase(); -> Error

 

📌 void, never

// void
function sayHello():void{
  console.log("hello");
  // 콘솔만 찍고, 아무것도 반환하지 않음
}

// never
function showError():never {
  throw new Error();
}

function infLoop():never {
  while(true) {
    //do Something
  }
}

항상 에러를 반환하거나, 영원히 끝나지 않는 함수의 타입으로 사용할 수 있다.

 

📌 enum

enum Os {
  Window=7,
  IOS=2,
  Android
}

console.log(Os[2]);

let myOs:Os;
// myOs의 타입은 Os이다.
// window, ios, android만 입력할 수 있게 된다.

myOs = Os.Window;
enum Os2 {
  Window = "win",
  IOS = "ios",
  Android = "and"
}

console.log(Os2["Window"]);

enum은 비슷한 값들끼리 묶어주는 일종의 그룹이다.
enum에 수동으로 값을 주지 않으면, 자동으로 0부터 1씩 증가하면서 할당한다. (배열 인덱스처럼)

 

✅ 특정값만 입력(그룹 내)할 수 있게 강제하고 싶을 때, 그 값들이 뭔가 공통점이 있을 때 enum을 사용한다.

 

📌 null, undefined

let a:null = null;
let b:undefined = undefined;

---

🚀 참고

• Typescript 강좌 , 코딩앙마 - #1 타입스크립트를 쓰는 이유를 알아보자
• Typescript 강좌 , 코딩앙마 - #2 기본 타입

 

➰ 더 공부할 것

• TypeScript Documentation - Get Started, Handbook : 읽고 실습하기