일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- dp
- Level3
- 리트코드
- 웹프로그래밍
- sql
- CS
- 프로그래밍
- 동적계획법
- LeetCode
- 카카오
- 고득점Kit
- 백준
- 코테연습
- OS
- 리액트
- Doitvue.js입문
- Level2
- 프로그래머스
- VUE
- javascript
- C++
- react
- 자바스크립트
- web
- python
- 파이썬
- typescript
- Level1
- Medium
- 배열
- Today
- Total
목록Web/TypeScript (8)
3장 타입 추론-1 타입스크립트는 타입 추론을 적극적으로 수행합니다. 타입 추론은 수동으로 명시해야하는 타입 구문의 수를 엄청나게 줄여주기 때문에, 코드의 전체적인 안정성이 향상됩니다. item 19 : 추론 가능한 타입을 사용해 장황한 코드 방지하기 타입스크립트가 타입을 추론할 수 있다면 명시적 타입 구문을 작성하지 않는 게 좋습니다. let x: number = 12; // 비생산적이며 형편없는 스타일 let x = 12; // 이렇게만 해도 충분 편집기에서 x에 마우스를 올려보면 타입이 number로 이미 추론되어 있음을 확인할 수 있습니다. 만약 타입을 확신하지 못한다면 편집기를 통해 체크하면 됩니다. 더 복잡한 객체도 가능합니다. // 거추장스러움 const person: { number: st..
제네릭 내장 제네릭 & 제네릭이란? 제네릭 타입이란 타입스크립트에 내장된 타입이며 다른 타입과 연결된다. 제네릭 타입을 사용하면 보다 나은 타입 안정성을 확보할 수 있다. const names: Array = []; //string[] names[0].split(' '); const promise = new Promise((resolve, reject) => { setTimeout(() => { resolve(10); }, 2000); }); promise.then(data => { data.split(' '); // error : Property 'split' does not exist on type 'number'. }) Generic Functions 제네릭 함수를 직접 만들어보자. 두 개의 객체를..
고급 타입 intersection Types 두 가지 타입을 교차해서 사용할 때 사용한다. type Admin = { name: string; privileges: string[]; }; type Employee { name: string; startDate: Date; } type ElevatedEmployee = Admin & Employee; const e1: ElevatedEmployee = { name: 'Max', privileges: ['create-server'], startDate: new Date() } Type Guards 유니언 타입을 도와 특정 타입을 발라내는 역할을 한다. 유연성을 가지는 건 좋지만 런타임 시 정확히 어떤 타입을 얻게 될지 알아야하는 경우가 많기 때문이다. typ..
인터페이스 인터페이스 인터페이스는 객체의 구조를 정의할 수 있게 해준다. 따라서 해당 구조를 가져야하는 객체에 대한 타입을 확인하는 용으로 사용할 수 있다. interface Person { name: string; age: number; greet(pharse: string): void; } let user1: Person; user1 = { name: 'Max', age: 30, greet(pharse: string) { console.log(`${pharse} + ' ' + ${this.name}`); } }; user1.greet('Hi'); 왜 사용할까? 인터페이스와 사용자 정의 타입은 완전히 같지 않다. 인퍼테이스는 객체의 구조를 설명하기 위해서만 사용한다. 인터페이스를 자주 사용하는 이유는 ..
클래스 OOP? Work with (real-life) Entities in your code Class & Instnaces Objects : The things you work with in code (Instance of classes) Classes : blueprints for objects 객체를 정의 다수의 객체를 생성 Class 생성하기 class Department { //class field name:string; //생성자 함수 constructor(n: string) { this.name = n; } } const accounting = new Department('Accounting'); console.log(accounting); 자바스크립트로 컴파일하기 "use strict";..
TypeScript 컴파일러 wath 변경 사항이 잦을 때 watch 모드를 사용하면 변경사항이 생길 때마다 자동으로 컴파일 할 수 있다. tsc app.ts --w 전체 프로젝트 컴파일 / 다수의 파일 타입스크립트에게 프로젝트 단위로 컴파일해야한다고 알려줄 수 있다. 아래 커맨드를 통해 tsconfig 파일을 생성한다. tsc --init 한꺼번에 컴파일을 할 수 있다. tsc 특정 파일 제외시키기 tsconfig.ts 에서 exclude 설정을 통해 특정 파일을 컴파일 시 제외할 수 있다. "exclude": [ "analytics.ts", ] 아무 것도 설정하지 않으면 자동으로 node_modules이 제외된다. 패턴으로 제외시키기 "exclude": [ "*.dev.ts", //dev.ts가 포함..
Literal Type 특정한 값을 변수의 타입으로 지정하는 것을 리터럴 타입이라고 한다. const foo:string; string , number 외에 특정한 값을 타입으로 지정할 수도 있으며 union 타입과도 같이 사용할 수 있다. resultConversion: 'as-number' | 'as-text' Type alias 사용하고자 하는 타입을 별칭으로 지정하여 재사용할 수 있다. type ConversionDescriptor = 'as-number' | 'as-text'; 타입 객체를 생성하는 것도 가능하다. type User = {name: string; age: number}; function greet(user:User) { console.log(`Hi I'm ${user.name}`..
Enum 사용자 지정 타입 원하는 범위 내의 유효한 값만 받고 싶을 경우에 사용할 수 있다. TypeScrpit enum Role { Admin, READ_ONLY, ATHOR, }; 자바스크립트에서는 아래처럼 컴파일된다. Javascript var Role; (function (Role) { Role[Role["Admin"] = 0] = "Admin"; Role[Role["READ_ONLY"] = 1] = "READ_ONLY"; Role[Role["ATHOR"] = 2] = "ATHOR"; })(Role || (Role = {})); ; Any 타입에 구애받지 않고 모든 타입을 저장할 수 있다. 하지만 타입스크립트의 장점을 상쇄시켜 바닐라 자바스크립트를 쓰는 것과 같기 때문에 잘 쓰지 않는다. any ..