TypeScript5 TypeScript - Generic 타입스크립트의 제네릭(Generic)은 코드 재사용성을 높이고 타입 안정성을 보장하는 기능이다. 제네릭을 사용하면 함수나 클래스를 작성할 때, 사용될 데이터의 타입을 미리 지정하지 않고, 이후에 함수나 클래스를 호출할 때 인자로 전달된 데이터의 타입에 따라 자동으로 타입을 추론하게 된다. 제네릭 function printLog(text: T): T { return text; } printLog 함수에 T라는 타입 변수를 추가했다. T는 유저가 준 파라미터의 타입을 캡쳐하고, 이 정보를 나중에 사용할 수 있게 한다. 여기에서는 T를 반환 타입으로 다시 사용하였다. 즉, 파라미터와 반환 타입이 같은 타입을 사용하고 있음을 알 수 있다. printLog 함수는 타입을 불문하고 동작하므로 제네릭이라 할 수 있다.. 2023. 6. 1. TypeScript - Type Aliases, Type Inference, Class Type Aliases(타입 별칭) Type Aliases는 타입의 새로운 이름을 만드는 것이다. 타입을 정의할 수 있는 모든 곳에는 타입 별칭을 쓸 수 있다. 복잡한 타입을 간략하게 표현하고, 타입 정의를 재사용하는 등 가독성을 높일 수 있다. type Person = { id: number; name: string; email: string; } //Commentary 인터페이스에서 Person 타입을 참조하고 있습니다. interface Commentary { id: number; content: string; user: Person; } //객체에서 Commentary 인터페이스를 참조하고 있습니다. let comment1: Commentary = { id: 1, content: "뭐예요?", u.. 2023. 5. 31. TypeScript - Enum, Interface Enum(열거형) JavaScript에서는 기본적으로 열거형을 지원하지 않지만, TypeScript에서는 문자형 열거형과 숫자형 열거형을 지원한다. 열거형은 숫자형과 문자열형, 혹은 이 둘의 조합으로 정의될 수 있다. 디폴트 값으로는 숫자형을 사용하며 각 값은 자동으로 0부터 시작하여 1씩 증가한다. 다음과 같이 수동으로 값을 지정할 수도 있다. enum Color { Red = 1, Green = 2, Blue = 4, } let c: Color = Color.Green; let greenValue: number = Color.Green; let blueValue: number = Color.Blue; console.log(c); // 출력: 2 console.log(greenValue); // 출력:.. 2023. 5. 31. TypeScript - 타입, 함수, 연산자 활용 타입 TypeSciprt? TypeScript는 마이크로소프트에서 개발한 JavaScript의 상위 집합 언어이다. JavaScript에 정적타입 검사와 클래스 기반 객체 지향 프로그래밍 등의 기능을 추가하여 개발된 언어로, JavaScript가 밟전하면서 생긴 단점을 보완하기 위해 등장하게 되었다. TypeScript는 정적타입 검사 기능을 제공하며, 코드의 가독성과 유지 보수성을 높여준다. 이를 통해 개발자는 런타임 에러를 최소화하고, 코드 작성 시간을 단축하며, 협업 시 코드의 가독성을 높일 수 있다. TypeScript의 타입 Boolean let isShow: boolean = true; let isDone: boolean = false; Number let number1: number = 5; le.. 2023. 5. 30. TypeScript 프로젝트 환경 구성하기 TypeScript 프로젝트 환경 구성하기 1. 프로젝트 폴더를 만든 후 `npm init -y`로 npm을 사용할 준비를 한다. 2. `npm install typescript --save-dev`로 TypeScript를 설치한다. 3. 프로젝트 루트 디렉토리에 tsconfig.json 파일을 생성한 후 밑의 내용을 붙여 넣는다. //tsconfig.json //compilerOptions 내의 속성은 자유롭게 커스텀 할 수 있습니다. { "compilerOptions": { "target": "es6", "module": "commonjs", "sourceMap": true, "outDir": "./dist" }, "include": [ "src/**/*" ] } TypeScript ESLint와 P.. 2023. 5. 30. 이전 1 다음
