겨리의 개발일기

함수 ✅ 타입스크립트로 함수를 작성한 코드 function hello(name: string,age?: number ) : string{ if(age !== undefined) return `Hello, ${name}. You are ${age}.`; else return `Hello, ${name}.`; } console.log(hello('gyeol',30)); // "Hello, gyeol. You are 30." 출력 🤔 만약 매개변수 age를 name보다 먼저 선언하고 싶다면? function hello(age?: number, name: string) : string{ if(age !== undefined) return `Hello, ${name}. You are ${age}.`; else r..

Programming/TypeScript 2023. 6. 20. 21:29

타입스크립트를 쓰는 이유 🤔 브라우저는 타입스크립트를 이해하지 못한다. 근데 왜 이걸 사용할까? ✅ JavaScript는 동적언어. 런타임에 타입이 결정되고 오류가 발견된다. → 만약 개발자가 실수를 하게되면 오류가 사용자에게 그대로 노출된다. ✅ Java, TypeScript는 정적언어. 컴파일시 타입이 결정되고 오류가 발견된다. 타입스크립트 기본타입 타입스크립트의 기본 타입에는 크게 열두가지가 있다. Boolean, Number, String, Object, Array, Tuple, Enum, any, void, null, undefined, never String, Number, Boolean, Array // number, string, boolean let age:number = 30; let ..

Programming/TypeScript 2023. 6. 20. 13:57

기존 React + JavaScript 를 사용하여 개발하던 프로젝트를 TypeScript로 변경하는 과정에서 에러가 발생했다. .js 파일을 .tsx 파일로 변경하고 타입을 잡아줬는데도 에러가 잡히지 않았다. 에러 사진 에러 내용 'React' refers to a UMD global, but the current file is a module. Consider adding an import instead. 대강 'React'는 UMD 전역을 뜻하지만 현재 파일은 모듈이니 가져오기를 추가하는 것이 낫다 라는 뜻이다. 해결 방법 🔨 첫 번째 방법 가장 간단한 해결 방법은 각 파일에 React를 import 하는 코드를 추가해주는 것! import React from 'react' 하지만 이 방법은 각 파..

Programming/TypeScript 2023. 5. 26. 15:29

리액트 공부하면서 prop-types 라이브러리에 대한 예제를 보고 실습 하던 중 갑자기 떠오른 생각 참고 : prop-types 란? 더보기 prop-types : 부모로부터 전달받은 prop의 데이터 타입을 검사한다. 자식 컴포넌트에서 명시해 놓은 데이터 타입과 부모로부터 넘겨받은 데이터 타입이 일치하지 않으면 콘솔에 에러 경고문이 뜬다. 🤔 "자바스크립트 사용하면서 라이브러리를 써서 타입을 일일이 설정해 주는 것보다 그냥 타입스크립트를 쓰면 해결되는 문제 아닌가?" 지금 vue.js + typeScipt 를 사용하는 프로젝트를 진행하고 있어서 그런지 문득 저런 생각이 들었다. 그래서 실습 하던 거 멈추고 검색을 좀 해봤는데 알아두면 좋을 것 같아서 기록한다. 일단 타입스크립트는 자바스크립트(동적 언..

Programming/TypeScript 2022. 9. 12. 02:20