TypeScript
-
[면접 예상질문] React, Recoil, React Query, TypeScriptCS 2023. 10. 24. 14:49
**React에 관한 질문과 답안:** 1. **React의 주요 특징은 무엇이며, 어떻게 동작하는지 설명해보세요.** - React는 사용자 인터페이스를 구축하는 라이브러리로, 가상 DOM을 사용하여 성능을 최적화합니다. React 컴포넌트는 상태(state)와 속성(props)을 통해 데이터를 관리하며, 컴포넌트 계층 구조를 구성하여 UI를 효과적으로 업데이트합니다. 2. **React Hooks은 무엇이며 어떤 상황에서 사용하나요?** - React Hooks는 함수 컴포넌트에서 상태와 생명주기 기능을 사용할 수 있게 해줍니다. 예를 들어, `useState`는 상태를 관리하고, `useEffect`는 부수 효과를 다루며, 이를 통해 클래스 컴포넌트 대신 함수 컴포넌트를 사용할 수 있습니다. 3. ..
-
[이펙티브 타입스크립트] 3장 타입 추론 (1)웹/JavaScript 2023. 6. 12. 10:00
3장 타입 추론 타입 스크립트는 타입 추론을 적극적으로 수행한다. 아이템 19. 추론 가능한 타입을 사용해 장황한 코드 방지하기 코드의 모든 변수에 타입을 선언하는 것은 비생산적이며 형편없는 스타일로 여겨진다. 타입 추론이 된다면 명시적 타입 구문은 필요하지 않다. 방해만 될 뿐이다. 함수 매개변수에 타입 구문을 생략하는 경우도 간혹 있다. 예를 들어 기본값이 있는 경우를 예로 들자. TypeScript에서 함수 매개변수의 타입 구문을 생략하는 경우, 타입 추론을 통해 매개변수의 타입을 유추하도록 할 수 있습니다. 이를 "타입 추론"이라고 합니다. 타입 추론은 변수의 할당값이나 함수의 반환값을 기반으로 해당 변수 또는 매개변수의 타입을 추론하는 TypeScript의 기능입니다. 예를 들어, 다음과 같이 ..
-
[이펙티브 타입스크립트] 1장. 타입 스크립트 알아보기웹/TypeScript 2023. 5. 12. 15:56
Typescrit 타입스크립트란? 성숙하고 효율적으로 변모한 자바스크립트의 완성도를 채워줄 마지막 퍼즐 아이템 1 . 타입 스크립트와 자바스크립트의 관계 이해하기 타입 스크립트는 자바스크립트의 상위집합(superset)이다 타입 체커를 통과하면서도 런타임 오류를 발생시키는 코드는 충분히 존재할 수 있다. 즉, 타입 검사는 런타임에서 발생하는 동적인 문제들을 모두 해결해주지는 않습니다. 예시) const name = ['aaaa', 'bbbb']; // 런타임에러 console.log(name[1].toUppercase()); // 메소드 오타 console.log(name[2].toUpperCase()); // name[2] undefined // 정상작동 console.log(name[1].toUppe..
-
[TypeScript] useStrict을 사용해야 하나요? + readonly, 추론 가능한 타입, as const 단언문웹/TypeScript 2023. 3. 22. 12:34
TypeScript useStrict을 사용해야 하나요? 결론을 먼저 말씀드리면 "아니요" 입니다. 그 이유는 Ts의 안전성 검사가 usestrict 보다 훨씬 엄격한 체크를 하기 때문입니다. useStrict "엄격한 사용" 또는 "엄격한 모드"는 ECMAScript 5(ES5)의 JavaScript에 도입된 기능으로 개발자가 더 엄격하고 안전한 언어 버전을 선택할 수 있습니다. JavaScript 파일 또는 함수의 맨 위에 "use strict"가 추가되면 이전 버전의 JavaScript에서 허용되었던 특정 작업을 제한하는 일련의 규칙이 활성화됩니다. 이러한 제한 사항은 다음과 같습니다. 철자 오류를 포착하고 글로벌 네임스페이스 오염을 방지하는 데 도움이 되는 선언되지 않은 변수의 사용을 허용하지 않..
-
[TypeScript] type과 interface 차이,타입 집합웹/TypeScript 2023. 3. 22. 12:21
TypeScript type과 interface 차이 하나의 프로젝트에서 type과 interface 중 한가지 일관된 스타일을 확립하는 것이 좋다. interface type 재선언 O (선언적 확장) 재선언 X 객체만 가능 모든 타입 가능 computedValue 가능 ex) [ k in list ] : string interface의 경우 extends를 이용해서 타입을 확장한다. type의 경우 & 연산자를 이용해서 타입을 확장한다. type 집합 - & interface Person { name : string } interface Lifespan { birth : Date, death : Date, } type personSpan = Person & Lifespan // type의 경우 & 연..
-
[TypeScript] 타입스크립트 책 추천웹/TypeScript 2023. 3. 22. 11:45
What is TypeScript? JavaScript and More TypeScript adds additional syntax to JavaScript to support a tighter integration with your editor. Catch errors early in your editor. TypeScript는 JavaScript에 추가 구문을 추가하여 편집기와의 긴밀한 통합을 지원합니다 . 편집기에서 초기에 오류를 포착하십시오. A Result You Can Trust TypeScript code converts to JavaScript, which runs anywhere JavaScript runs: In a browser, on Node.js or Deno and in your..
-
[5주차] TypeScript로 객체 배열 중복 제거 구현하기Vue.js/Way Home 2022. 10. 11. 16:06
문제점 : 카테고리 첫 번째 select문에서 같은 데이터값이 나열되고 있다. 해결 방법 : const removeDuplicates = (array: Array, key: string) => { return array.reduce((arr, item) => { const removed = arr.filter((i: any) => i[key] !== item[key]); return [...removed, item]; }, []); }; const high: highway[] = removeDuplicates(highwayList, 'routeNm'); routeNm 값이 중복되면 객체 value를 제거하게 작성했다. 참고 사이트 : https://ko.code-paper.com/javascript/ex..
-
[TypeScript 기초] 실행 방법, 주요 타입, 열거타입(enum), 제네릭(Generic)웹/TypeScript 2022. 9. 18. 11:02
1. ts파일을 js파일로 변환 방법 터미널에 tsc main(파일명)을 입력합니다. 2. 주요 타입 string - 문자열 boolean - T/F number - 숫자 symbol - symbol 생성자를 호출해 생성된 고윳값 any - 모든 타입을 허용하는 타입. 코드를 쓰는 동안 정해지지 않은 변수를 지정할 수 있음 unknown - any와 비슷하나 먼저 타입을 지정하거나 좁히지 않으면 조작이 허용되지 않음 never - 도달할 수 없는 코드 boid - 값이 없음 3. 열거타입(enum) 일정 수의 상수로 구성된 집합을 만든다. 월요일을 1로 초기화했고, 나머지 값은 자동으로 1씩 증가된 값이 할당된다. 기본적으로 열거 타입은 0부터 시작한다. 예시는 아래와 같다. enum Weekdays {..