ReturnType
·
TypeScript
useRef와 setInterval, clearInterval가 사용된 기능의 타입을 지정하던 중, 현재 ref에 대한 타입 에러가 발생했습니다. 이전 코드는 any로 작성되어있었지만 명확한 타입 설정에 대한 필요를 느꼈거든요. const exampleRef = useRef(); 문제 해결 시도 저의 경우엔 ref를 number로 사용하고 있었기에 number 타입을 설정해주었는데요. ref의 current가 타입 에러를 발생시키는 것을 확인할 수 있었습니다. const exampleRef = useRef(); 처음에는 ref가 number 타입만을 취급할 것이라 예상해 number | undefined 등의 여러 설정을 시도하다 아무래도 setInterval과 연관이 있겠다 생각해 구글링을 통해 서칭했..
[TypeSCript] event type
·
TypeScript
1. event type으로 any를 넣는다라.. TypeScript를 처음 접할 시 input이나 form event에 어떤 타입을 지정해야할 지 몰라 무지성 any를 지정할 때가 있었을 겁니다. // 코드 수정 전 const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); // e의 type으로 any를 설정 const handleSubmit = (e: any) => { console.log(e); // 다들 알고계시겠지만 form 제출 시 페이지 새로고침을 막기 위해 e.preventDefault()를 추가했습니다. e.preventDefault(); }; return( React Input Test! s..
TS - interface
·
TypeScript
인터페이스는 여러가지 타입을 갖는 프로퍼티로 이루어진 새로운 타입을 정의하는 것과 유사하다. 앞으로 개발해나갈 코드에 대한 부분에 대해 미리 타입을 지정한다는 의미이다. 1. 인터페이스의 기본 사용법 // 예제 코드 interface User { name: string; age: number; } // 변수에 사용하는 경우 const userInfo: User = { name: 'hi', age: 32 }; // 함수의 매개변수에 사용하는 경우 function getUser(user: User) { console.log(user); } getUser(userInfo); 또한 함수의 기본 구조에 대한 인터페이스도 구축이 가능하다. // 함수 구조에 사용하는 경우 interface SumCalc { (a:n..