1. Types

Array

Basic Array

let name1: string[] = ['Lucy', 'Kim'];
let name2: Array<string> = ['Lucy', 'Kim'];

Union

let arr1: (string | number)[] = ['Kim', 23];
let arr2: Array<string | number> = ['Kim', 23];

Any

let arr: any[] = ['Kim', 23, true, {}];

읽기 전용 배열 (readOnly)

// readonly
let stringArr: readonly string[] = ['A', 'B'];
// readonlyArray
let numberArr: ReadonlyArray<number> = [1, 2];

---

Tuple

• 정해진 타입, 정해진 개수의 배열(Array)
• 단, push 메서드를 이용한 추가는 가능! (단, 없는 Type을 넣으면 에러)

let tuple = [string, number];
tuple = ['a', 1, 2]; // error

tuple = ['a', 1];
tuple.push(2); // OK
tuple.push(true) // error

---

Any, Unknown

• 둘 다 어떤 타입인지 알 수 없는 것
• 단, Unknown은 다른 변수의 값으로 할당해줄 수는 없음. (단, as 사용하여 타입 명시시 가능)

let unknown: unknown = false;
let string:boolean = unknown; // error
let string:boolean = unknown as boolean // OK

---

Object

• Object
• Array
• null
• new Date()

const obj: {id: number, name:string} = {
	id: 1,
  	name: 'Kim'
}

---

Function

Basic Function (arg, return type)

let func: (arg1:number, arg2:number) => number;
func = function(a, b) {
	return a + b
}

void (return x)

let func: () => void;
func = function () {
	console.log('hi');
}

---

Null, Undefined, Never

null, undefined

• void 타입에는 undefined 할당이 가능 (void 함수는 undefined를 반환하기 때문)
• 그 외에는 tsconfig 파일에서 strictNullChecks 옵션을 false로 해주지 않으면 에러 반환

never

• 에러를 반환하거나, 절대로 리턴값을 보내지 않는 경우(ex> 빠져나올 수 없는 루프 등)
• 그 외에 빈 배열에 아무것도 넣지 못하게 할 때 사용하기도 함

const never: [] = []
// never[]과 같음
never.push(1);  // error

---

2. Type Assertion(단언)/ Guard

Type Assertion

• as 키워드를 사용하여 타입을 단언해줌

let foo = {}  // 프로퍼티가 없는 {}로 가정함
foo.bar = 123;  // error

// ✅ 해결 방법 - type assertion
interface Foo {
  bar: number;
}

let foo = {} as Foo;
foo.bar = 123;  // OK

• 또 다른 방식 ! 추가 -> null이 아님 (not null)

const el = document.querySelector('body');
el.innerText = 'Hi'; // error - el이 null일 수 있음

// 방법 1 - 타입 단언
const el = document.querySelector('body') as HTMLBodyElement;

// 방법 2 - ! not null
el!.innerText = 'Hi'; // OK

// 방법 3 - 타입 가드
if (el) {
  el!.innerText = 'Hi'; // OK
}