hwlink

고정 헤더 영역

글 제목

메뉴 레이어

hwlink

메뉴 리스트

  • 홈
  • 태그
  • 방명록
  • 분류 전체보기
    • Memo
    • Library
    • Coding
      • Svelte,Sveltekit
      • React
      • JS
      • CSS
      • 알고리즘
      • Error
      • TypeScript
      • WEB
      • Network
    • Git
    • Code
    • 마우스버리기
    • Project
      • Weasly(화장품결제구독서비스)
      • Hines(리빙쇼핑몰)
      • 기업협업
    • book

검색 레이어

hwlink

검색 영역

컨텐츠 검색

Coding/TypeScript

  • [TypeScript] unknown any 차이

    2022.05.10 by hwlink

  • [TypeScript] The left-hand side of an arithmetic operation must be of type ‘any’ ‘number’ or an enum type (TS2363)

    2022.05.03 by hwlink

  • [TypeScript] interface extends

    2022.04.29 by hwlink

  • [TypeScript] setStateAction typing

    2022.04.27 by hwlink

  • [React, TypeScript] CRA React TypeScript 절대경로 설정하기

    2022.02.01 by hwlink

[TypeScript] unknown any 차이

any Typescript에서 any는 어떤 타입이든 허용하는 타입이다. 타입을 지정하려고 Typescript를 사용하는데 any를 쓴다면 사실 Typescript를 쓰는 의미가 없는셈입니다. any 타입은 타입검사를 하지 않기 때문에 개발 당시에는 코스트가 발생하지 않지만 실제 애플리케이션 구동 과정에서 사용자가 에러를 맞을 수 있기 때문에 사용을 지양해야합니다. unknown TypeScript 3.0에서 업데이트 any 타입과 동일하게 모든 타입 값을 허용하지만, 할당된 값의 타입을 모르기 때문에 연산 할 수 없습니다. 마무리 any 모든 타입 허용 타입 검사 느슨하게 하므로 개발시에는 에러가 없을지 모르나 사용자가 에러를 맞을 수 있다. == 치명적 unknown 모든 타입 허용 연산을 하는 경우..

Coding/TypeScript 2022. 5. 10. 23:56

[TypeScript] The left-hand side of an arithmetic operation must be of type ‘any’ ‘number’ or an enum type (TS2363)

에러 해당 오류는 주로 타입스크립트에서 숫자가 아닌 것을 연산하는 과정에서 발생하게 됩니다. 자바스크립트 코드에서는 문제없지만 타입스크립트에선 에러를 표시합니다. for (let i = 0; i < contentsData.length - 1; i++) { beforeChartValue.push({ name: contentsData[i].menuName, value: Math.floor( contentsData[i].refStdKcal * contentsData[i].beforeAmount ), per: Math.floor( (contentsData[i].refStdKcal * contentsData[i].beforeAmount * 100) / RECOMMEND_KCAL_VALUE ), })위의 코드는 c..

Coding/TypeScript 2022. 5. 3. 23:47

[TypeScript] interface extends

Extending Interfaces 클래스처럼, 인터페이스들도 확장(extend)이 가능합니다. 이는 한 인터페이스의 멤버를 다른 인터페이스에 복사하는 것을 가능하게 해주는데, 인터페이스를 재사용성 높은 컴포넌트로 쪼갤 때, 유연함을 제공해줍니다. interface Pet { name: string; age: number; } interface Tory extends Pet { breed: string; } interface Plants extends Pet { type: string; } const value: Plants = { name: 'trav', age: 2, type: 'cactus', }; 인터페이스는 아래 코드처럼 여러 인터페이스를 확장할 수 있어, 모든 인터페이스의 조합을 만들어낼 수..

Coding/TypeScript 2022. 4. 29. 00:49

[TypeScript] setStateAction typing

Typescript에서 setState의 값을 자식 컴포넌트에 props로 넘겨주고 Typing을 해주어야한다. 해당 typing을 따로 해주는 것이 아닌 부모에서 내려줄 props에 마우스를 올리면 자식컴포넌트 props에 typing 해줄 alias를 알려준다.

Coding/TypeScript 2022. 4. 27. 00:10

[React, TypeScript] CRA React TypeScript 절대경로 설정하기

CRA, TypeScript 기준으로 작성된 글임을 참고해주길 바랍니다, 프로젝트가 커짐에 따라 상대경로로 프로젝트를 진행하게 되면 import 상대경로가 ../../../ 너무 더러워지고 많은 코스트가 발생하기 때문에 절대경로로 설정해주는 것이 이롭다. 해당 글에서는 Crago로 절대경로를 설정하였다. Crago? Craco는 Create React App Configuration Override의 약자로, Create-React-App 즉 CRA를 쉽게 설정하기 위해 만들어졌다. 1. Crago Module, Crago alias 설치 yarn add @craco/craco yarn add --dev craco-alias //or npm install @craco/craco --save npm ins..

Coding/TypeScript 2022. 2. 1. 23:48

추가 정보

인기글

최신글

페이징

이전
1
다음
TISTORY
hwlink © Magazine Lab
페이스북 트위터 인스타그램 유투브 메일

티스토리툴바