인덱스 시그니처가 정의된 타입에서 Omit 유틸리티 타입을 사용하면?
인덱스 시그니처, Exclude, Omit 타입 유틸리티에 대한 이해
다음과 같이 인덱스 시그니처가 정의되어 있는 타입이 있다. TypeWithIndexSignature에서 c라는 속성을 제거하고 싶어 Omit 유틸리티를 사용했을 때 원하는 타입을 얻을 수 있을까? 내가 원하는 타입의 형태는 아래와 같다. 하지만 아래와 같이 엉뚱한 타입을 얻게된다. 왜 그럴까? 이유를 알기 위해서는 Omit 유틸리티에 사용되는 Exclude 유틸리티와, Omit 유틸리티 타입에 대해서 이해해야 한다. Exclude 타입에 대해…
2023-03-15
표현 가능한 이진트리
재귀, 구현
문제 링크 해결 전략 문제에 접근법은 처음에 구상한 게 맞았으나, 구현에서 조금 애를 먹었다. 알고리즘 풀 때는 타입스크립트가 아닌 자바스크립트를 사용해서 그런가 자잘한 타이핑 오류가 있었다. 우리에게는 십진수가 주어진다. 완전이진트리를 사용하여 이진법을 제작했을 때, 해당 십진수를 이진법으로 표현할 수 있는지 문제이다. 우리가 해결해야 할 문제는 이진법으로 표현할 수 있는지, 즉 완전이진트리모양을 만족시킬 수 있는지이다. 부모 노드 아래 더…
2023-03-11
미로탈출명령어
그리디
문제 링크 해결 전략 격자 미로에서 출발지와 도착지를 가는 길 중 문자열이 사전 순서에서 가장 작은 길을 구해야한다. 격자 미로: 격자 미로일 경우 우리는 어느 한 지점에서, 다른 지점까지의 최단 거리를 매우 쉽게 알 수 있다. 예시로 (a1,b1), (a2,b2) 두 좌표일 때 최단 거리는 |a1-a2|+|b1-b2| 이다. 사전 순서에서 가장 작은 길: 방향을 문자열로 치환하였을 때, 사전 순으로 나열하면 d, l, r, u이다. 단어를 …
2023-03-10
이모티콘 할인행사
중복 순열, 완전 탐색
문제 링크 해결 전략 우리는 문제에 주어진 우선순위에 맞게 최대 이모티콘 서비스 가입자수와 판매액을 구해야한다. 이 문제는 완전 탐색으로 해결할 수 있는 문제이다. 우리는 이모티콘별 적정 할인률을 구해야하는데, 이모티콘의 할인률은 10%,20%,30%,40% 중 하나이다. emoticons의 최대 길이는 7로 최대의 시간 복잡도를 계산해보면, 100 * (4 ** 7)로 충분하다. (n=100, emoticons의 길이 7) 완전 탐색 알고리…
2023-02-09
택배 배달과 수거하기
그리디
문제 링크 해결 전략 우리가 구해야 하는 것은 트럭의 최소 이동 거리이다. 트럭이 최소의 거리로 모든 상자를 배달하고 수거하기 위해서는, 출발지로부터 가장 거리가 먼 집부터 처리해야한다. 출발지로부터 가장 거리가 먼 집부터 처리하는 이유는, 짧은 거리는 긴 거리에 포함이 되기 때문에 짧은 거리에 있는 집을 먼저 처리해도 긴 거리에 있는 집을 가기 위해서는 동일한 루트를 반복해서 가야한다. 하지만 긴 거리에 있는 집부터 처리하면 반복해서 가야하…
2023-02-09
cdn
cdn의 개념과 원리
cdn이란? cdn이란 content delivery network의 약어로 빠른 콘텐츠 전달을 목적으로 고안되었다. 엔드 유저와 서버 사이의 물리적인 거리를 줄여서 콘텐츠 로딩에 소요되는 시간을 최소화한다. 전세계에 캐시 서버를 분산 배치하여 엔드 유저의 요청에 오리진 서버가 아닌 엔드 유저에 근접한 캐시 서버가 콘텐츠를 전송한다. 거리가 먼 오리진 서버가 아닌, 가까운 캐시 서버에서 콘텐츠를 받아오기 때문에 로딩에 소요되는 시간을 획기적으…
2022-12-16
이펙티브 타입스크립트 6장
타입 선언과 @types
devDependencies에 typescript와 @types 추가하기 devDependencies에는 프로젝트를 개발하고 테스트하는 데 사용되지만, 런타임에는 필요 없는 라이브러리가 포함된다. typescript와 @types는 런타임에서 사용되지 않기 때문에 devDependencies에 설치되어야한다. 타입스크립트 프로젝트 의존성 타입스크립트 자체 의존성 팀원들 모두가 항상 동일한 버전을 설치한다는 보장이 없다. 프로젝트를 셋업할 때 …
2022-12-09
package manager
Yarn Berry는 왜 사용하는걸까?
패키지 매니저 공부 배경 위투디 프로젝트에서 사용했던 기술을 바탕으로 2개의 프로젝트를 진행해보려고 한다. 2개의 프로젝트 모두 웹에서 디자인 할 수 있는 canvas api를 사용하기 때문에 두 프로젝트가 컴포넌트를 공유하여 사용할 수 있도록 제작하려 한다. 물론 버튼이나, 레이아웃 등의 기타 컴포넌트도 공통적으로 관리하여 개발 생산성을 높일 것이다. 이런 공통적인 기능을 어떻게 유지할까 고민해봤다. 패키지로 만들어서 관리하는 방식. 모노레…
2022-12-07
이펙티브 타입스크립트 5장
any 다루기
처음에 타입스크립트를 사용했을 때 잘몰라서 any 키워드를 가끔 사용하곤 했다. any는 타입 시스템을 뭉개버리기 때문에 최소한으로 사용을 해야한다. any 키워드로 정의된 변수는 프로젝트 내에서 전염병처럼 퍼져나갈 수 있다... any를 잘 다루는 방법에 대해서 알아보도록 하자. any 타입은 가능한 좁은 범위에서만 사용하기 any를 사용해서 타입 시스템의 오류를 피하고자 아래와 같은 두가지 방식으로 처리하였다. 어떤 것이 더 좋은 해결책일…
2022-12-02
이펙티브 타입스크립트 4장
타입 설계
유효한 상태만 표현하는 타입을 지향하기 유효한 상태만 표현한다는 것의 의미가 무엇일까. 유효하지 않은 상태가 있음으로써 버그가 생기는 것이라고 할 수 있을 것 같다. 예시를 통해서 이해해보도록 하자. api를 호출하고 비동기적으로 데이터를 받아옴으로써 페이지의 상태를 다음과 같이 표현할 수 있다. 위와 같은 상태 설계는 유효하지 않은 상태가 존재함으로 버그가 생길 수 있다. 유효하지 않은 상태는 isLoading이 true이고, error 값…
2022-12-01
부대복귀
다익스트라 알고리즘
문제 링크 해결 전략 위 문제는 한 노드에서 다른 노드의 최단거리 찾기 문제이다. 즉 다익스트라 알고리즘을 사용하면 문제를 해결할 수 있다. 다익스트라 알고리즘은 그리디 알고리즘의 일종인데 방문한 노드에서 최단거리를 가지는 노드를 찾는 알고리즘에서 시간 복잡도 차이가 발생한다. 노드의 방문 여부를 통해 최단거리를 찾는 알고리즘의 경우 모든 노드를 순회해야하므로 O(n^2)의 시간 복잡도를 가진다. 하지만 문제의 경우 n이 100,000으로 O…
2022-11-22
이펙티브 타입스크립트 3장
타입 추론
타입 추론 타입스크립트는 타입 추론을 적극적으로 수행한다. 타입 구문의 수를 엄청나게 줄여주기에 코드의 전체적인 안정성이 향상된다. 숙련된 타입스크립트 개발자는 비교적 적은 수의 구문을 사용한다. 추론 가능한 타입을 사용해 장황한 코드 방지하기 위의 예시에서 a에 굳이 number라는 타입을 명시해줄 필요가 없다. 타입스크립트에서 자동으로 추론해주기 때문이다. 객체의 경우 객체의 경우에도, 타입 추론이 의도한 타입과 동일하다면 굳이 타입을 명…
2022-11-01
Node.js, Express, MongoDB
Node.js, Express, MongoDB란?
Node.js란 Node.js는 Chrome의 V8 엔진으로 빌드된 자바스크립트 런타임이다. 기존에 자바스크립트는 브라우저에서만 구동 가능한 언어였다. 구글이 매우 빠른 자바스크립트 엔진인 V8을 출시하자 이를 바탕으로 브라우저 외 환경에서 자바스크립트 런타임을 구축하기 시작했다. 이벤트 기반 이벤트 기반이란 이벤트가 발생할 때 미리 지정해둔 작업을 수행하는 방식을 의미한다. 예시로 클릭이나 네트워크 요청 등이 있을 수 있다. 논 블로킹 논 …
2022-10-19
이펙티브 타입스크립트 2장
타입스크립트의 타입 시스템
편집기를 사용하여 타입 시스템 탐색하기 많은 개발자들이 vscode를 이용하는데 typescript를 제작한 ms에서 만든 것이다. 따라서 vscode를 사용하면 typescript의 언어 서비스를 잘 활용할 수 있다. 편집기를 통해서 어떻게 타입 시스템이 동작하는지, 타입스크립트가 어떻게 타입을 추론하는지 개념을 잡을 수 있다. Go to Definition 기능을 통해서 타입 선언 파일로 이동할 수 있고, 타입 선언 파일을 보면서 어떻게 …
2022-10-18
React의 전역 상태 관리
전역 상태 관리는 왜 필요하고, 어떤 도구들이 있나
React에서 전역 상태 관리는 왜 필요할까? 리액트는 단방향 데이터 바인딩이라는 특징을 가진다. 단방향 데이터 바인딩 특징은 어플리케이션이 예측 가능하다는 장점이 있지만, 뷰를 업데이트 해주는 부분을 매번 작성해주어야 한다는 단점이 있다. 리액트의 경우 뷰가 state에 따라서 자동으로 갱신되어 뷰를 업데이트 해주는 코드를 작성할 필요는 없지만, 이 state를 어플리케이션 구조에 맞게 잘 전달해주는 과정이 필요하다. 만일 컴포넌트 구조가 …
2022-10-17
이펙티브 타입스크립트 1장
타입스크립트 알아보기
타입스크립트와 자바스크립트의 관계 타입스크립트는 자바스크립트의 상위 집합이다. 즉 모든 자바스크립트 프로그램은 타입스크립트 프로그램이다. 하지만 타입스크립트의 경우 타입 선언 등 별도의 문법을 가지고 있기 때문에 유효한 자바스크립트 프로그램이라고는 할 수 없다. 자바스크립트가 타입스크립트 프로그램이기에 마이그레이션 하는데 큰 이점을 가진다. 타입 시스템 타입스크립트는 자바스크립트에 타입 시스템을 더한 것이다. 타입 시스템의 목표 중 하나는 런…
2022-10-17
스타수열
백트래킹
문제 링크 해결 전략 처음에 이 문제를 완전탐색 형태로 해결하고자 하였다. a의 부분 수열을 모두 만들고, 스타 수열인지 확인하는 방식으로 알고리즘을 짰다. 하지만 이 방식은, a의 길이가 최대 500,000이므로 절대 만족할 수 없다. 조합의 경우 O(2^n)의 시간 복잡도를 가지기 때문이다. 그렇다면 반대로 생각해봐야 한다. 모든 부분 수열을 만들어보고 스타 수열인지 검증하는 대신, 주어진 배열을 활용해서 직접 스타 수열을 만들어보면 된다…
2022-10-13
기지국 설치
투포인터
문제 링크 해결 전략 이 문제는 아이디어로 푸는 문제이다. 우리가 구하고자 하는 값은 추가적으로 설치된 기지국의 개수이다. 즉, 기지국이 어디에 설치되는지는 알 필요가 없다는 의미이다. 작은 예시를 통해서 설치해야 할 기지국 개수를 알아본다. 만일 기지국이 전혀 없는 4개의 아파트가 있다고 가정하고, 전파 도달 거리가 1이라면 몇 개의 기지국 설치가 필요할까? 1개의 기지국이 차지하는 영역은 본인의 자리 + 앞 뒤로 w 만큼이다. 즉 2*w+…
2022-10-12
섬 연결하기
크루스칼 알고리즘
문제 링크 해결 전략 최소의 비용으로 모든 섬이 통행 가능하도록 만들 때, 필요한 최소 비용을 구하라는 문제이다. 모든 섬이 통행 가능하도록 이란 의미는 신장 트리를 만족해야 하고, 최소 비용을 구해야 하기 때문에 최소 신장 트리 구조를 만족해야 한다. 크루스칼 알고리즘은 최소 신장트리를 만족하면서 최소 거리를 구할 수 있는 알고리즘이다. 정답 코드
2022-10-09
여행 경로
DFS/BFS
문제 링크 해결 전략 우리는 주어진 항공권을 모두 이용해야한다. 즉 항공권을 모두 사용하는 케이스를 탐색해야한다. 만일 가능한 경로가 2개 이상 있을 때, 알파벳 순서가 앞서는 경로를 리턴해야 하므로 BFS로 탐색하고 만족하는 값을 찾으면 탐색을 중지하도록 하겠다. 탐색하는 방법은 간단하다. 티켓 중에서 시작점이 마지막에 방문한 도시와 일치하는 티켓들을 찾고 알파벳 순서로 정렬 후 방문한다. 이 과정을 모든 티켓을 사용(방문)할 떄 까지 반복…
2022-10-06
이중우선순위큐
힙, 정렬
문제 링크 해결 전략 이 문제의 operation은 최대 1,000,000이다. 따라서 최댓값, 최솟값을 제거해주기 위해서 굳이 힙을 사용하지 않고도 정렬을 사용해도 좋다. sort 메소드를 사용한다면 O(NlogN)으로 문제를 해결할 수 있다. shift 메소드의 경우 O(N)의 시간이 소모되므로, 매번 정렬을 수행하는 것보 다 shift 메소드를 사용하는 것이 더 빠르다. 따라서 작성한 알고리즘은 아래와 같다. 전체 코드 추가 문제의 이름이…
2022-10-06
숫자 게임
그리디
문제 링크 해결 전략 우리는 B의 순서를 조정할 수 있다. 따라서 A의 순서를 바꿔도 상관없다. 순서가 변경된 A에 맞춰서 B의 순서를 변경하면 되기 때문이다. 우리는 근소한 차이로 이길 때, 최대한 많이 이길 수 있다. 예시로 1을 이기는데 9를 낼 필요는 없다는 것이다. 내가 2를 보유하고 있다면 2를 내는 것이 이득이다. 나중에 7과 같은 큰 수를 만나면 그 때 9를 내야한다. 위의 두 생각을 바탕으로 나는 A와 B를 내림차순으로 정렬하…
2022-10-05
야근지수
최대힙
문제 링크 해결 전략 초기에는 완전 탐색으로 접근해보았다. 하지만 n을 works에 분배하는 과정에서 무조건 시간 초과가 발생할 수 밖에 없다. 따라서 문제의 특성을 이용한 다른 접근 방법이 필요하다. 우리는 배열 내 요소의 제곱의 합의 최솟값을 구해야한다. 제곱의 그래프는 우측으로 이동할수록 급격히 증가하는 그래 프 형태를 띄게 된다. 반대로 말하자면 좌측으로 이동할수록 급격히 감소한다는 의미이다. 우리는 최솟값을 구해야 하므로 감소하는 폭을…
2022-10-04
스티커 모으기
다이나믹 프로그래밍
문제 링크 다이나믹 프로그래밍인 이유 문제의 해결 전략이 다이나믹 프로그래밍으로 도출되어야 하는 이유는 2가지이다. 시간 복잡도를 줄여야 한다. 작은 문제의 해답이 그것을 포함하는 큰 문제에서도 동일하다. 1. 시간 복잡도 스티커의 최대 길이는 100,000개이다. 만일 완전 탐색으로 어떤 스티커를 뜯었는지, 안뜯었는지 고려하여 구한다면 시간 복잡도는 최대 O(2^50000)으로 불가능하다. 2. 작은 문제의 해답이.. 스티커 전체 배열이 […
2022-09-30