TS type

배열을 정의 하는 2가지 방법

1) const fruits: string[] = ["가", "나"] 주로 사용함
2) const num: Array<number> = [1, 2, 3]

readonly 주어진 데이터를 읽기만 가능하고 업데이트 할 수 없다.

funcion printArray(fruits: readonly string[]) { }

Tuple

• 서로 다른 타입을 함께 가질 수 있는 배열이다. 한가지 타입만 허용할 수 있는 타입을 만들 수 있는데 tuple 을 사용하게 되면 서로 다른 데이터를 담을 수 있다.
• 고정된 사이즈에 서로 다른 타입이 있을 때 쓰일 수 있다.

let student:[string, number];

student = ["hyojin", 123]
값을 할당할 때 이렇게 할당할 수 있다.
student[0] // "hyojin"
student[1] // 123

❗️ tuple을 사용하는것을 권장하지 않는다.

1. 데이터에 접근할 때 인덱스처럼 접근하는게 가독성이 떨어진다.
2. 값을 출력하거나 정의된 곳으로 직접 가서 보지 않는 이상 0 안에 어떤 데이터가 들어가 있는지 알기 어렵다.
3. interface, type alias, class 로 대체해서 사용하는것이 좋다.

피할 수 있는 방법으로 
오브젝트 디스덕처링을 이용하면 된다.
원하는 변수를 선언한 뒤 student 를 할당하게 되면  

const [name, age] = student; 
배열의 첫번째 값이 name, 두번째 값이 age 이렇게 할당되게 된다.
student.name 
student.age

type alias

• 타입스크립트를 쓰는 가장 큰 이유는 type alias 가 가능하기 때문이다.
• type alias 는 새로운 타입 뿐 아니라 원시 타입, 오브젝트 타입도 정의 할 수 있다.

type Text = string;
const name:Text = "hyojin"
const address:Text = "korea"

type Num = number

type Student {
name: string;
age: number
} 

string Literal type

• 타입을 문자열로도 지정할 수 있다.
• 다양한 원시 타입, 오브젝트 타입 등 값 자체를 결정할 수 있다.
• name 이라는 타입은 동일한 name 이라는 문자열만 사용가능

type Name = "name"
let hyojinName : Name
hyojinName = "dfsf" X


type JSON = "json"
const json:JSON = "json"

type Boal = true

이것을 왜 쓰는걸까? 활용할 수 있는 예제

union type (or)

• 모든 가능한 케이스 중에 발생할 수 있는 딱 하나를 담을 수 있는 타입을 만들 수 있다.

type Dir = "right" | "left" | "up" | "down"

function move(dir : Dir) {
	console.log(dir)

	}
move("down"); // right, left, up, down 4가지 중 선택 가능.

type Size = 2 | 4 | 8 | 12
const s : Size = 4;

discriminated union

• 공통적인 프로퍼티를 써서 좀더 구분하기 쉽게 코드를 짜는게 좋다.
• 더 직관적인 코드 작성이 좋다.
• 로그인 시 실패/ 성공할 수 있는 코드를 작성했을 때 성공과 실패 type에 같은 이름의 result 에 이름을 저장한다. retrun 시 result 문자열도 같이 보내준다.

type SuccessState = {
 result : "success"
 response : { body: string } }

type FailState {
result : "faul"
reason :  string }

type LoginState = SuccessState | FailState

방법 1
function  login(id: string, password: string) : Promise<LoginState> { 
  return { 
    result : "success"
    response : { body: "login!" } } }
 
  
방법 2  
function printLoginState(state: LoginState){

if(state.result === "seccess") { 
  console.log(`🥳 ${state.response.body}`) 
} else {
	console.log(`😢 ${state.reason}`) }
}

Intersection Type : & (and 와 같은 개념)

• 유니언과 반대의 성격을 갖인 intersection
  유니언은 발생하는 모든 케이스 중에 한가지만 선택하고 인털섹션은 모든것을 다 합한 성격이다.

type Student = {

name : string
score : number 
}

type Worker = {

empolyeeId : number
work : () => void

}

function internWork(person : Student & Worker) {
console.log(person.name, person.score, 
			person.empolyeeId, person.work )

}



internWork({
name : "hyojin",
score : 1,
empolyeeId : 222,
work : () => {}

})

• 다양한 타입들을 하나로 묶어서 선언할 수 있지만 모든 데이터를 입력해줘야 에러가 발생하지 않는다.

enum Type

• 사용하지 않는것이 좋음.
• enum 으로 타입이 지정된 변수에 다른 어떠한 숫자도 할당할 수 있기 때문 타입이 정확하게 보장하지 않는다.
• 여러가지에 관련된 상수 값들을 한곳에 모아서 정의할 수 있게 도와주는 타입.
  (js 에서는 제공 X, ts 에서 자체적으로 제공하는 함수이다.)
• 여러가지 상수의 값들을 한곳에 모아서 타입이 보장되고 타입의 값이 변하지 않아 안전하게 사용할 수 있다.

union type 추가함.
 type DaysOfWeek = "Monday" | "Tuesday" | "Wednesday" | "Thursday" | "Friday" | "Saturday" | "Sunday";

 enum Days {   
        Monday,
        Tuesday,
        Wednesday,
        Thursday,
        Friday,
        Saturday,
        Sunday,
    }

    console.log(Days.Monday);
    let day: Days = Days.Saturday;
    day = Days.Thursday;
    day = 3;  // 컨파일 에러가 발생하지 않음.
    console.log(day);

- 문제는 다른 것을 할당해도 컴파일 에러가 발생하지 않는다.
- enum type 을 사용했을 때 타입은 보장되지 않지만 union type 으로 대체하면타입이 보장된다.
  
   
let dayOfWeek: DaysOfWeek ="Saturday"
    
    dayOfWeek = "hyojin" X
    dayOfWeek = 2 X 

Type Inference (타입추론)

• 간다한 코드나 원시 타입일 경우 알아서 타입 추론을 명시 해줄 수 있지만 함수일 경우
  안에 여러 코드가 있기 때문에 작성하는 습관을 들이는것이 좋다.

let text = "hello" 
text = "hi" O
text = 1 X

- 선언함과 동시에 문자열을 할당했기 때문에 타입스크립트에서 자동으로 string 으로 타입 추론을 했다.

function page(message) {
  console.log(message)
}

page("hello") O
page(1 ) O

- 여기서 message의 type은 any type으로 추론했기 때문에 여기선 string, number type 다 가능하다. 그러나 정확히 인자가 어떤 타입을 예상하고 있는지 명시해서 작성하는 것이 좋다.

function page(message: string) {
  console.log(message)
}

page("hello") O
page(1 ) X


Function add(num1: number, num2: number){
 return x + y  
}
const result = add(1, 2)

- return 값도 result도 number 라고 타입 추론 가능.

Type Assertion

• 타입을 확인할 때 타입을 강요할 때가 있다.
• 좋은 건 아님.

가정> 타입은 any 지만 string을 return 하는 함수 

function jsStrfunc() : any {
return "hello"

}

const result = jsStrfunc()
result.length X //문자열의 길이를 구하는 length 를 사용하려 했으나 에러! 

• TS 에서는 return type이 any 라서 string type 에서 이용 가능한 apl를 사용할 수 없다. 이때 return type이 string type인거 확신하는데!! 이때 type
  Assertion 을 사용할 수 있다.

function jsStrfunc() : any {
return "hello"

}

const result = jsStrfunc()
(result as string).length  //5  문자열에서 가능한 apl를 사용할 수 있다.

• (result as string) result라는 변수가 string type 인것을 알고 문자- 열처럼 사용한다는 캐스팅을 사용할 수 있다.!

• 만약 return type이 number 라면 type error 는 발생하지 않지만 실행할때 에러가 발생한다.

• 내가 100% 장담할때 사용해야한다.

(result as string).length
(<string>result).length

function findNumbers(): number[] | undefied {
	return undefinde
}
const numbers = findNumbers();
numbers.push(2) // 에러발생 undefinde 일수 도 있고 숫자배열 일수 도 있기 때문

여기서 무조건 null이 아니고 값이 있어! 옵션이 아니라고 할 수 있음
optional parameter 와 반대 표현

1) 
const numbers = findNumbers()!; 
numbers.push(2) 

2)
const numbers = findNumbers(); 
numbers!.push(2)