구조분해할당 Destructuring Assignment

타입스크립트에서의 구조분해할당.

타입스크립트에서는 각 변수마다 어떤 데이터형식의 값이 들어갈 것인지 미리 지정해 줘야한다.

이를 구조분해할당이라고 하는데 이를 활용함으로써 에러의 확률을 상당히 줄일 수 있다고 한다.


예를들어 변수 aaa:String = 'helloWorld'; 일때
이 변수에는 이제 문자열 말고는 들어가지 못하는 것이다.

각 변수,함수,객체,배열 등에서의 사용법

export default function TypescriptPage() {
    //타입 추론
    let aaa = '안녕하세요'
    aaa = 132
    //타입 명시
    let bbb:string = "반갑습니다."

    bbb = 12313131

    //문자타입
    let ccc:string
    ccc = "반가워요"

    //숫자타입
    let ddd:number
    ddd = 1231

    //블린타입
    let eee:boolean = true
    eee = "false" //자주 발생하는 실수 (빈문자열이 아니라 true로 동작한다 타입스크립트에서는 이를 막아준다.)
    
    //배열 (숫자가 들어가는 배열, 문자가들어가는 배열, 등ㄷ으)

    let fff:number[] = [1,2,3,4,5,6,1,6,12,43,2]
    let ggg:string [] = ["철수", "영희" , "훈이" , 10] 
    // 명시를하지않으면 10이 들어간다. (문자string 또는 숫자number 가 들어갈 수 있는 배열이라고 판단함)
    let ooo = ["철수", "영희" , "훈이" , 10]

    //객체 (타입이 없고 사용자가 직접 만들어야함.)
    //타입이 없더라도 타입추론은 가능하다.
    interface IProfile {
        name:string,
        age:number | string, // 추론으로 만들면 이런방식을 사용하지 못함.
        school:string
    }

    const profile: IProfile = {
        name: "철수",
        age: 8,
        school: "다람쥐초등학교"
    }
    profile.age="8살" //추론으로 만들면 age가 넘버로 추론되어 문자열 입력이 되지 않는다.

    //함수타입
    const add = (money1:number , money2:number , unit:string):string => {
        return money1 + money2 + unit
    }

    const result = add(1000,2000,"won")
    console.log(result)



    return <div> 타입스크립트 연습하기 </div>
}