whenever purple

1. 인터페이스 및 초기값 설정 

type Score = 'A' | 'B' | 'C' | 'D' | 'F'  


// 1. Interface
interface User {
    name : string;     // 필수
    age : number;      // 필수
    gender? : string;  // 옵션
    readonly birthYear : number;  // 읽기 전용 (수정X)
    [grade : number] : Score;  // 키:number, 값:Score 인 프로퍼티를 여러개 받을 수 있음
}


// 2. Interface 기준으로 초기값 설정
let user : User = {  
    name : 'xx',
    age: 30,
    birthYear : 2000,
    1 : 'A',
    2 : 'B',
}

console.log(user.age) // 30

2. 인터페이스로 함수 정의

// 1. Interface
interface Add {
  (num1: number, num2: number): number;

}

// 2. Interface를 이용해서 함수 생성
const add : Add = (x,y) => {
  return x + y
}

console.log(add(3,5))  // 8

3. 인터페이스로 클래스 정의

// 1. Interface
interface Car {
  color: string;
  wheels: number;
  start(): void;
}

// 2. Interface 이용해서 클래스 생성
class Bmw implements Car {
  color;
  wheels = 4;
  constructor(c:string) {  // 생성될때 color를 입력받기
    this.color = c;
  }
  start(){
    console.log('go..')
  }
}

const b = new Bmw('green')
console.log(b) // Bmw: { 'wheels': 4, 'color': 'green'}
b.start() //  "go.."

3-1. 인터페이스 확장

// 1. Interface
interface Car {
  color: string;
  wheels: number;
  start(): void;
}

// 1-2. Interface 확장
interface Benz extends Car {
  door: number;
  stop(): void;
}

// 1-3. Interface 기준으로 초기값 작성
const benz : Benz = {
  door : 5,
  color : 'black',
  wheels : 4,
  stop(){
    console.log('stop')
  },
  start(){
    console.log('go..')
  }
}

3-2. 인터페이스 확장

// 1. Car Interface
interface Car {
  color: string;
  wheels: number;
  start(): void;
}

// 2. Toy Interface
interface Toy {
  name: string;
}

// 3. Car와 Toy의 인터페이스 확장
interface ToyCar extends Car, Toy {
  price : number;
}

1. 문자

let color = 'purple';  // 'purple'을 자동적으로 string으로 인식 (다른 타입도 마찬가지)
let color:string = 'purple'

2. 숫자

let age:number = 30

3. 불리언

let isAdult:boolean = true;

4. 숫자/ 문자열 배열

let arr:number[] = [1,2,3]  //숫자 배열

let arr:string[] = ['a','b','c']  //문자열 배열1
let arr:Array<string> = ['a','b','c']  //문자열 배열2

5. 튜플

let b:[string, number] // 첫번째 인자: 문자 , 두번째 인자: 숫자

b = ['a',1]

6. void / never

void : 함수에서 아무것도 반환하지 않을 때 사용함

const sayHello = ():void =>{
	console.log('hello')
}

sayHello()

naver : 항상 에러를 반환하거나 끝나지않는 함수 타입으로 사용함

const showError = ():never => {
	throw new Error()
}

const infLoop = ():never => {
	while(true) {
    	// do something
    }
}

7. enum 

enum : 비슷한 값을 묶어 주는, 열거형 데이터

enum Os {
    Window = 3, // 기본적으로 0부터 순차적으로 할당됨 (3으로 작성시 3으로 할당, 3부터 순차적으로 할당됨)
    Ios, 
    Android
}

console.log(Os[3])  // Window
console.log(Os['Window'])  // 3

let myOs:Os  // Os의 값만 넣을 수 있다

myOs = Os.Window

8. null / undefined

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

Node.js를 주로 사용하지만, 타입스크립트의 요구가 늘어나는 것같아 배워보고자 한다.

Javascript는 동적언어라, 런타임에 타입이 결정되고 오류를 발생시킨다. 

코드상에는 오류가 발생하지 않았지만, 의도하지 않은 결과가 나타난다.

하지만, typescript(나 Java)는 정적언어라 컴파일 타임에 타입이 결정되고 오류를 발생시킨다.

아래처럼 아직 실행시키지도 않았는데, 오류들이 나타난다.

typescript 사용할때에는 type을 설정해줘야한다.

의도한 대로 사용하지 않으면 오류를 보여준다.