[TypeScript] 유틸리티 타입 정리
·
프로그래밍 언어/TypeScript
출처 : 이정환의 한 입 크기로 잘라먹는 TypeScript TypeScript 에서 자주 사용되는 유틸리티 타입을 정리해보겠습니다... 허허 유틸리티 타입이란 : 제네릭, 맵드 타입, 조건부 타입 등의 타입 조작 기능을 이용해 (실무에서) 자주 사용되는 타입을 미리 만들어 놓은 것.맵드(mapped) 타입 기반조건부 타입 기반Partial ExcludePick ExtractRequiredReturnTypeOmit Readonly Record  맵드 타입 기반 1. Partial - 부분적인 타입 만들기특정 객체 타입의 모든 프로퍼티를 선택적(`optional`) 로 바꿔주는 타입interface Post { title: string; tags: string[]; content: string; t..
[TypeScript] 조건부 타입 , 타입 추론 (infer)
·
프로그래밍 언어/TypeScript
출처 : 이정환의 한 입 크기로 잘라먹는 타입 스크립트1. 조건부 타입의 기본 개념조건부 타입 (Conditional Types) 는 `T extends U ? X : Y` 형태로,`T`가 `U`를 상속하는지 여부에 따라 다른 타입을 반환한다. type A = number extends string ? string : number; // number위에서 `number` 는 `string` 집합과 연관이 없으므로 `number` 가 결과로 나오게 됨. 2. 객체 타입을 활용한 조건부 타입객체 타입에서 특정 속성이 있는지 여부를 판단할 수 있다!type ObjA = { a: number;};type ObjB = { a: number; b: number;};type B = ObjB extends Obj..
[TypeScript] 클래스와 인터페이스 그리고 접근 제어자.
·
프로그래밍 언어/TypeScript
출처 : 이정환의 한 입 크기로 잘라먹는 타입스크립트1. TypeScript의 클래스 (Class) TypeScript에서 클래스는 객체를 생성하는 템플릿 역할을 한다. JavaScript 는 객체 리터럴을 사용해서 객체를 생성할 수 있는데 이런 방식은 같은 구조의 객체를 여러 개 만들 때 불편함. 따라서 클래스를 활용하면 동일한 구조의 객체를 쉽게 생성할 수 있다.class Employee {// 필드 ( 속성 ) name: string; age: number; position: string; // 생성자 ( constructor ) constructor( name: string, age: number, position: string) { this.name = name; ..
[TypeScript] 타입스크립트의 원시타입과 리터럴타입
·
프로그래밍 언어/TypeScript
출처 : 이정환의 한 입 크기로 잘라먹는 타입 스크립트  TypeScript는  ` : Type`(Type주석 Type Annotation) 이런 형태로 표기하여 내가 정의할 타입을 지정할 수 있다  원시타입 (Primitive Type) : 하나의 값만 저장하는 타입1. number// numberlet num1: number = 123;let num2: number = -123;let num3: number = 0.123;let num4: number = -0.123;let num5: number = Infinity;let num6: number = -Infinity;let num7: number = NaN; 2.string// stringlet str1: string ="hello";let str2..
[TypeScript] 컴파일러 옵션 설정하기
·
프로그래밍 언어/TypeScript
터미널에서 `tsc --init` 입력... 그러면 tsconfig.json 파일이 나오게 되는데  해당 파일은 TypeScript 프로젝트에서 컴파일러 옵션과 설정을 정의하는 파일임.  이제부터 우리가 해당 컴파일러 옵션을 설정해 보자. 1. include{  "include": ["src"]} 이렇게 설정해주면 src안에 있는 모든 파일을 동시에 컴파일 해줌. 이후 `tsc` 명령어만 입력하면 include안에 입력된 경로의 모든 파일을 컴파일해준다. 2. compilerOptions > target  "compilerOptions": {    "target": "ES5"  }, 이렇게 설정하면 컴파일되는 과정에서 js가 ES5로 설정이 됨. 즉 컴파일의 버전을 선택해서 사용할 수 있다. `ESNex..
[TypeScript] 타입스크립트는 어떤 언어일까?
·
프로그래밍 언어/TypeScript
출처 : 이정환의 한 입 크기로 잘라먹는 타입스크립트  우선 해당 기술을 사용하기위해,node.js 와 visual Studio Code 를 사용함.  타입스크립트의 창시자는 C#의 창시자로도 알려진 (앤더스 하일스버그) 손에서 탄생함.     //javaScriptlet a = 1;let b = 2;console.log(a + b); // TypeScriptlet a:number = 1;let b:number = 2;console.log(a + b); 타입을 직접 지정하는 기능이 추가된걸 볼 수 있다.  자바스크립트의 확장판이라고 얘기할 수 있다. 왜??? 타입스크립트를 배워야할까?자바스크립트가 너무 잘나갔기 때문에!! 자바스크립트는 원래 간단한 상호작용을 위해 만들어진 언어였는데, 그래서 그런지 유연..