아이템20 - 다른 타입에는 다른 변수 사용하기 let id = "12-34-56" fetchProduct(id) // string 으로 사용 id = 123456; fetchProductBySerialNumber(id) //number 으로 사용 // '123456'형식은 'string' 형식에 할당할 수 없습니다. 타입스크립트는 '12-34-56' 값을 보고 string 으로 추론했기 때문에 number 형식은 할당할 수 없습니다. 여기서 '변수의 값은 바뀔 수 있지만 타입은 보통 바뀌지 않는다'는 중요한 관점을 알 수 있습니다. const id = '12-34-56' fetchProduct(id) const serial = 123456 // OK fetchProductBySerialNumber(se..
Item19 - 추론 가능한 타입을 사용해 장황한 코드 방지하기 타입스크립트에 익숙하지 않은 개발자는 모든 변수에 타입을 명시해야 한다고 생각합니다. 그러나 타입스크립트는 많은 타입 구문을 필요로 하지 않습니다. let x:number =12; let x =12; // 이렇게만 해도 충분 타입스크립트가 굳이 number를 명시하지 않았음에도 불구하고 자연스럽게 추론되어 있음을 확인할 수 있습니다. 이렇게 타입 추론이 된다면 명시적 타입 구문을 필요하지 않습니다. 오히려 코드 가독성을 해칠뿐입니다. 타입스크립트는 더욱 복잡한 객체도 추론 가능합니다. const person: { name: string born: { where: string when: string } died: { where: string ..
Item18 - 매핑된 타입을 사용하여 값을 동기화하기 산점도(Scatter plot)을 그리는 컴포넌터의 타입을 모델링 해보겠습니다. interface ScatterProps{ // Data xs:number[]; ys:number[]; // Display xRange:[number,number]; yRange:[number,number]; color:string; //Events onClick:(x:number,y:number,index:number) => void; } 데이터나 디스플레이가 변경되면 차트를 다시 그려야하지만 이벤트 핸들러가 변경된경우 그럴 필요가 없습니다. 따라서 최적화를 해야하는데 두가지 방법으로 해보겠습니다. function shouldUpdate( oldProps:Scatter..