사실 우리가 사용하는 웹 브라우저들은 TS 를 인식하지 못합니다.즉 우리가 TS로 작성을해도 JS로 변환을 해야지 웹 브라우저가 이를 알아먹을 수 있습니다..🙋 : 그러면 번거롭게 걍 JS 쓰면 안되나요?간단한 예시를 들어보도록 하겠습니다.만약 위 함수에서 add()
🔥 타입 스크립트 타입 종류
위와 같이 오브젝트 타입을 지정해두고 그값을 로그 값을 출력하는 과정에서 에러가 생기게 되는데요.. 에러 로그를 보면 오브젝트에는 name이 없다! 라고 나옵니다.이렇게 프로퍼티를 정해서 객체를 표현하고자 할때 인터페이스를 사용합니다!위의 예시를 인터페이스를 적용하면,
이번 포스팅에서는 TS 에서 함수를 정의하는 방법에 대해 알아보도록 하겠습니다!바로 시작하도록 하죠타입 스크립트에서는 모든 데이터에 타입을 정해줘야 합니다. 일반적인 변수 뿐만 아니라 파라미터, 객체 안의 데이트에도 각각 넣어줘야합니다. 물론 함수 에도 적용해 줘야합니
이번 포스팅에서는 리터럴 타입에 대해 알아보도록 하겠습니다!흔히 JS 에서 타입을 설정하면 const , let ,var 로 설정을 하고는 합니다. 이에 대한 각 타입에 대한 설명은 생략하도록 하고,리터럴 타입은 const처럼 정해진 값을 가지는 타입을 의미하게 됩니
React + JS 조합으로 개발을 이어나가던 어느날...인턴십을 하게 되면서 주변 개발자 분들에게 TS 영업을 당했다..인턴십이 끝난 지금을 기회삼아 Js에서 Ts로 넘어갈까 싶어 Ts로 가벼운 React 프로젝트를 하며 몰랐던 개념에 대해 정리해나가기로 했다...(
오늘은 callback 함수를 인자로 받기위한 타입을 설정해주는 과정에서 새로운 놈(?)을 발견했다!🧐 바로 이녀석. 이놈에 대해 한번 알아보고자 한다.기본적으로 react는 개별적인 이벤트 시스템을 가지고 있다. 그렇기 때문에 일반적으로 typical MouseE
오늘은 TS를 이용한 토이 프로젝트, Quiz open api를 받아서 간단한 quiz 프로젝트를 만들어봤다. 이전의 TS 탐방기 1,2 ( 보러가기👉 1, 2 ) 에서는 기능을 구현하면서 기존의 JS로 하는 코딩과는 다른 점이나 몰랐던 기능에 대해 정리를 해 보았다
React + TS의 조합에 조금 익숙해지기 위해 간단한 Todo List를 만들며 조금 더 알아보고 싶은 내용을 정리해 보도록 하겠다.yarn creat react-app todo --typescript를 통해 react 개발을 위한 환경을 만들어 주고, App.ts
handleTodo 함수를 통해서 선택을 하면 해당 항목의 comlete가 반전 되도록 함.함수를 새로 만들 때도 type을 지정해 줘야하기 때문에 HandleTodo 타입을 추가로 선언해줘야함.함수 타입의 값에 타입 표기를 붙이기 위해서는 화살표 함수 정의 문법과 비
input 을 통해 동적으로 Todo list의 새로운 항목을 만들 수 있도록 해야한다. 그래서 새로운 AddTodo 컴포넌트를 추가해주도록 하자.<input value={newTodo} onChange={handleChage}/>을 통해서 새로운 항목 text