타입정리

타입을 왜 제대로 알아야 하는지

• 변수에 저장되는 데이터는 여러가지 타입이 있을 수 있음
• 타입을 이해하고 올바르게 사용시 코드의 가독성과 안정성이 향상

잘못된 타입을 사용할 경우

• 잘못된 타입을 사용하거나 예상치 못한 타입이 사용될 경우 오류가 발생할 수 있음
• 이러한 오류는 컴파일 타임이 아니라 실행시간에 발생
• 코드가 복잡해질수록 오류를 찾기 어려워짐

올바르게 타입을 사용한 경우

• 타입을 제대로 이해할 경우 이런 오류들을 미리 방지 가능

타입 안정성은 예상한 타입대로 동작함을 보장하는것
타입 안정성이 높을수록 코드 품질이 좋아지며, 실행시간에 발생할 수 있는 오류를 줄일 수 있음
타입을 제대로 이해하고 활용시 코드의 안정성이 향상되며, 테스트와 디버깅 시간을 줄일 수 있음
타입을 명확하게 명시하고 사용하면 코드의 가독성이 높아지며, 원할한 협업이 가능해짐

기본타입 훑어보기

boolean

• 참, 거짓을 나타냄
• 조건문, 비교연산등에서 사용
• 2가지의 상태(커짐/꺼짐, 유효함/유효하지않음)일경우 boolean사용, 3가지 이상의 상태를 표헌할 경우 enum이나 string 사용

number

• number타입은 Typescript에서 사용하는 모든 숫자를 나타냄
• 보통 일반적인 프로그래밍언어에서는 각숫자의 유효타입이 존재
• TypeScript에서는 number 타입이 정수, 실수뿐아니라 2,8,16진수까지 표현가능
• 모든 수치 연산에 사용되는 값은 number 타입으로 명시

string

• 텍스트 데이터를 나타냄
• 따옴표, 큰 따옴표를 사용하여 문자열로 표헌. 백쿼트로 템플릿 리터럴을 사용할때 사용
• string 타입은 텍스트를 조작하거나 출력할때 사용

배열

• 기본타입에 []가 붙은 형태의 타입

const testScore:number[] = [1,2,3,4]

튜플

• 서로다은 타입의 원소를 순서에 맞게 가질수있는 특수한 형태의 배열
• 배열은 같은 타입의 원소만 가능, 튜플은 어떤타입의 원소를 허용할 것인지 정의

const persion:[string, number, boolean] = ['name',10,true]
const persion2:[string, number, boolean] = [25, 'name',false] // 오류

• 튜플에 정의된 갯수외에 추가적으로 데이터를 저장하는건 오류를 발생하는건 아니지만, 원칙적으로는 데이터를 더 저장하는건 타입 안정성에 위배가 되는 행위
• 튜플사용시 정의된 데이터 타입의 개수와 순서에 맞춰 저장을 하는것이 필수!
• 억지로 데이터를 넣으면 튜플 구조가 내부적으로 변경이 되니 좋은 선택이 아님

enum

• 열거형 데이터 타입
• 다양한 상수를 보다더 이해하기 쉬운 문자열 이름으로 접근하고 사용할수 있게 하는 타입
• enum안에 있는 각 요소에 값이 설정되어있지 않으면 기본적으로 0으로 시작
• enum안에있는 요소에는 number 혹은 string 타입의 값만 할당가능

const UserRole {
	ADMIN = 'ADMIN',
	EDITOR = 'EDITOR',
	USER = "USER"
}

const UserLevel = {
	NOT_OPERATOR, //0
	OPERATOR //1
}

• enum은 명확하게 관련된 상수값들을 그룹화하고자 할때 사용하는게 좋음
• 값의수가 많지않고, 값들 사이의 관계가 뚜렷하지 않으면 사용하지 않는게 나음

const그리고 readonly

let

• let을 선언하면 변수가 됨
• 변수는 값을 변경할 수 있음

const

• const를 선언하면 상수가됨
• 상수는 값을 변경할수 없음

readonly

• readonly는 TypeScript에서 등장한 키워드
• readonly는 Typscript에서 객체의 속성을 불변으로 만드는데 사용되는 키워드
• 클래스의 속성이나 인터페이스의 속성을 변경할수 없음

class person {
	readonly name:string;
	readonly age:nunber;
	
	constructor(name:string, age:number){
		this.name = name;
		this.age = age
	}
	
	const person = new Person('Name', 20)
	
	console.log(person.name) //Name
	console.log(person.age) //20
	
	person.name = 'Jane' //오류
	person.age = 25 //오류
}

불변성의 중요성

• const, readonly를 사용하면 변수와 객체속성의 불변성이 보장
• 이를 통해 코드의 안정성을 높이고 버그를 줄일수 있음

any, unknown, union

• 어쩔수 없이 가변젹인 타입의 데이터를 저장하고 싶다면 any보다는 unknown을 사용하는게 좋음. 가변젹인 타입을 일일이 정의할수 없다면 union타입 사용이 나음

any

• TypeScript에서 any 타입은 모든타입의 슈퍼타입
• 어떤타입이든 값으로 저장할 수 있다는 의미
• Javascript의 object타입과 같은 최상위 타입

TypeScript에서 any를 쓰는게 맞는지?

• TypeScript를 사용하는 주된 이유 중하나는 프로그램의 타입 안정성을 확보하기 위한것
• 그런데 any는 이런 믿음을 저해할수 있음. 가급적으로 사용하지 않는게 좋음

unknown

• unknown은 any타입과 비슷한 역할을 하지만 더 안전한 방식으로 동작
• unknown 타입의 변수에도 모든 타입의 값을 저장가능
• 하지만 그 값을 다은 타입 변수에 할당하려면 명시적으로 타입을 확인해야함

let unknownValue: unknown = '나는 문자열'

let stringValue: string
stringValue = unknownValue //오류 발생. unknownValue가 string임이 보장되지 않아서
stringValue = unknownValue as string;
console.log(stringValue) //나는 문자역

stringValue = unknownValue as string; --> 타입단언
unknown타압의 변수를 다은 곳에서 사용하려면 타입단언을 통해 타입보장을 하여 사용가능

• typeof 키워드를 이용하여 타입체크를 미리한 후 unknown 타입의 변수를 string 타입의 변수에 할당가능

union

• unknown타입이 그나마 재할당을 할ㅇ때 타입체크가 되어서 안전함을 보장
• 하지만 unknown타입도 결국 재할당이 일어나지 않으면 타입안정성이 보장되지 않음
• 이럴때를 위해 union타입을 사용
• union타입은 여러타입중 하나를 가질수 있는 변수를 선언할때 사용
• union타입은 | 연산자를 사용하여 여러타입을 결합하여 표현

type StringOrNumber = string | number; // 원한다면 | boolean 이런식으로 타입 추가가 가능해요!

function processValue(value: StringOrNumber) {
  if (typeof value === 'string') {
    // value는 여기서 string 타입으로 간주됩니다.
    console.log('String value:', value);
  } else if (typeof value === 'number') {
    // value는 여기서 number 타입으로 간주되구요!
    console.log('Number value:', value);
  }
}

processValue('Hello');
processValue(42);

TypeScript를 쓰면서 여러타입을 하나의 변수로 해결하겠다는 생각은 지양
이런 사쇼한 습관들이 코드 안정성을 높이고 유지 보수성을 개선할 수 있음