선호:하다

any 아무 타입이나 될 수 있다는 뜻으로 타입의 보호를 받지 않기를 원할 때 사용 비어있는 값을 쓰면 기본적으로 any가 됨 자주 사용하는 것은 권장되지 않음 let a = [] // a는 any 타입 const a: any[] = [1, 2, 3] const b: any = true a + b // 오류가 나지 않는다. unknown 변수의 타입을 미리 알지 못할 때 사용 어떠한 작업을 할 경우 해당 변수의 타입을 먼저 확인한 뒤 사용해야함 let a: unknown let b = a + 1 // 에러 발생 (타입확인 필요하다.) // 사용할 때 마다 변수 타입을 지정해야한다. if(typeof a === 'number'){ let b = a + 1 } if(typeof a === 'string'){..

타입스크립트를 사용해서 객체 프로퍼티의 타입을 지정할 때 쓸 수 있는 특이한 기능들에 대해 알아보자. ? (Optional) ?는 선택적인 프로퍼티의 타입을 정의하는 단축어로 해당 타입이거나 undefined라고 해주는 것과 동일한 의미이다. type Player = { name: string, age?: number, } const jieun : Player = { name: ‘jieun’, } const coll : Player = { name: ‘coll’, age: 20, }​ age?: number는 age: number | undefined와 같은 의미이며 따라서 위와 같이 age 값을 갖지 않는 객체를 만들 수 있는 것이다. readonly readonly는 요소들을 읽기 전용으로 만들 때 ..

styled-component와 antd로 회원가입 기능을 구현하던 중 input 태그의 onChange 속성에서 타입 오류가 발생하였다. 타입이 안맞아서 생기는 오류인것 같았지만 해결책을 찾을 수 없어 몇 시간 동안이나 구글링을 하며 삽질을 했다. 그러다 결국 에러메세지를 자세히 보고 해결 방법을 알게되었다. onChange 함수의 타입을 새롭게 정의해주기 위해 위와 같이 InputProps라는 타입을 만들고 onChange의 타입을 에러메세지에 나온대로 정의해주었다. 그리고 그것을 CustomInput의 props로 전달해주었다. 그 결과 에러가 해결되었다.

Why Typescript? 타입스크립트는 자바스크립트에 타입을 부여한 언어로 다음 두 가지 관점에서 자바스크립트 코드를 개선하고 개발 생산성을 높일 수 있다. 에러의 사전 방지 코드 가이드 및 자동 완성 const sum = (a,b) => a+b; 위의 자바스크립트 코드는 a와 b를 입력받아 a + b의 값을 구하는 함수이지만, a와 b에 숫자가 아닌 문자열 등을 넘기더라도 오류를 띄우거나 하지 않고 심지어 존재하지 않는 프로퍼티를 읽더라도 undefined를 주고 넘어가는 등 에러의 사전 방지에 취약한 모습을 보인다. const sum = (a:number, b:number) => a+b; sum(1,2); 위와 같이 :를 이용하여 타입을 정의하는 방식을 Type Annotation이라고 한다. 이..