타입 명시

let a = "hello"; // 타입 추론으로 형 명시
let b : boolean = false; // 타입을 명시적으로 명시, 비추
let c : number[] = []; // 숫자형 배열 선언, 이런식으로 추론 불가일때 명시 표현

타입

모든 객체가 name요소 존재, 몇 명만 age요소가 존재할 때

// 객체의 형 명시
const player : {
  name:string,
  age?:number   // ?를 붙이면 undefined일 수도 있음 명시 	
} = {
  name:"Honey"
}

if(player.age && player.age < 10) { //age가 undefined일수도 있기 때문에 보호장치

}

더 나은 코드, 별칭 생성

type Player = { //첫 글자는 대문자
  name:string,
  age?:number
}

const honey : Player = {
  name:"Honey"
}
const bee : Player = {
  name:"bee",
  age:12
}

//타입에도 별칭 사용 가능
type Age = number; // number대신 Age 사용 가능, 과한 사용 비추

함수 객체 반환

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

function playerMaker(name:string) : Player {  // 매개변수 형 지정, 리턴형 지정(Player 타입)
	return {
    name // == name:name, 매개변수 와 같은 이름이면 :name 생략 가능
	}
}

const honey = playerMaker("honey");
honey.age = 12;

// 화살표 함수
const playerMaker = (name:string) : Player => ({name})

객체

object는 원시 타입이 아닌 타입을 나타냅니다. 예를 들어, number, string, boolean, bigint, symbol, null, 또는 undefined 가 아닌 나머지를 의미

declare function create(o: object | null): void;

create({ prop: 0 }); // 성공
create(null); // 성공

create(42); // 오류
create("string"); // 오류
create(false); // 오류
create(undefined); // 오류

readonly 앞선언

readonly로 선언하면 값 변경 불가

type Player = {
  readonly name : string, // name을 readonly로
	age ?: number
}

const playerMaker(name:string) : Player => ({name}) //return하는 값이 Player라고 전달

const honey = plyaerMaker("niko");
honey.name = "eee"; // Error

const numbers : readonly number[] = [1, 2, 3, 4];
numbers.push(1); // Error : push라는 것이 readonly number[]타입에 존재X

키 값 형식 지정

type Word = {
  [key: number]: string
}

let words = {
  "string" : "hello", //Ok
  1 : "by" // Error, (원래 에러 였으나 1을 스트링 형으로 처리하는 거 같음)
}

Tuple

정해진 개수와 순서에 따라 배열 선언

const player:[string, number, boolean] = ["honey", 1, true];
player[0] = 1; //Error

const player2: readonly[string, number, boolean] = ["honey", 1, true];
player2[0] = "honey"; //Error

열거(Enum)

enum Color {Red, Green, Blue} //자동 0,1,2
enum Color {Red = 1, Green, Blue} //직접 번호 매기기1,2,3
enum Color {Red = 1, Green = 2, Blue = 4} //모두 수동 1,2,4

let c: Color = Color.Green; 

let colorName: string = Color[2];
console.log(colorName); // 값이 2인 'Green'이 출력

undefined, null, any

undefined, null

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

any = Javascript

• Typescreipt로 부터 벗어날수 있음
• 가급적 사용 자제
• 모든 형이 들어갈 수 있음

const a : any[] = [1, 2, 3, 4];
const b : any = true;
a + b; // OK

void <=> any

• 아무것도 return 하지 않는 함수에서 반환 자료형
• 사용 빈도 적음
• 명시할 필요 없음

function hello() : void { // 생략 가능
  console.log('x');
}

function hello() : void { // :void 생략 가능
  console.log('x');
}

const a = hello();
a.toUpperCase(); //Error : void는 toUpperCase를 지원하지 않는다.

unknown

• 형식을 알지 못할 때 사용
• API에서 리턴 형을 모를 때 등
• if문을 통해 형 유추가 가능하게 코딩해야함

let a : unknown;

if (typeof a === 'number') {
  let b = a + 1;
}
if (typeof a === 'string') {
  let b = a.toUpperCase();
}

let b = a + 1; // Error

never

• 함수가 절대 return 하지 않을 때 발생
  • 예외 처리
  • 함수 리턴형이 여러개 일 때
• 사용 빈도가 매우 적음

// Exception
function hello():never {
	throw new Error("xxxx"); // return하지 않고 오류를 발생
}

// 리턴형 여러개
function hello(name:string|number) {
	if(typeof name === "string") {
		name; // string
	} else if (typeof name === "number") {
		name; // number
	} else {
		name; // never
	}
}

특정 값 지정

type Team = "red" | "blue" | "yellow"
type Health = 1 | 3 | 5

type Player = {
	nickname: string,
  team: Team,
  health: Health
{

const honey: Player = {
	nickname: "hon2yb22",
  team: "blue", // red, blue, yellow 중 하나만 가능
  health: 5 // 1, 3, 5 중 가능
}

타입 단언

컴파일러에게 신뢰를 주는 방법

angle-bracket

let someValue: any = "this is a string";

let strLength: number = (<string>someValue).length;

as

jsx와 함께 사용될 경우는 as만 허용

let someValue: any = "this is a string";

let strLength: number = (someValue as string).length;