본문 바로가기

IT/JavaScript & TypeScript49

[TypeScript] enum, const enum, as const enum, const enum 비교나는 상수를 선언할 때 습관적으로 enum을 사용했었는데, 타입스크립트에서 enum보다는 const enum을 사용하는 게 더 좋다는 글을 보았다. enum ColorType { RED, BLUE, GREEN}console.log(ColorType.RED); // 0const enum ColorType { RED, BLUE, GREEN}console.log(ColorType.RED); // 0 enum의 문제는런타임에 객체를 만들기 때문에 오버헤드가 발생한다.사용되지 않는 코드들도 번들에 포함되어 번들 용량이 증가한다. (즉, Tree Shaking이 안 된다.)  const enum을 사용하면 위의 문제들이 해결되지만, 제한이 있다.리버스 매핑이 안 .. 2025. 2. 10.
[IT] FE 레거시 코드 리팩토링 강의 정리 3 (feat. 데이터 분석) 원티드 프리온보딩 챌린지 "레거시 유지보수와 데이터 모으기" 4일차 강의 이번 강의는 사용자의 데이터를 수집하고 분석하는 방법에 대한 강의이다. 아무래도 현 직장이 상용 서비스를 운영하기보단 솔루션을 주로 만드는 회사다보니 잘 감이 오지 않았던 강의긴 한데, 새롭고 신기했다. 언젠간 쓸 일이 있을지도 모르니, 정리해둔다. 개요Data Driven: 데이터를 기반으로 의사결정을 내리는 것을 말한다.데이터를 수집하고 분석하여 그 다음엔 어떤 기능을 만들지, 뭘 더하고 뭘 뺄지 결정하는 전략을 수립한다.보통 마케팅팀이 기획하며, 여기서 프론트엔드 개발자가 할 일은 '데이터 수집' 이다.  데이터 수집 단계수집할 데이터 정의: 어떤 페이지에서 일어날 수 있는 행동 중 수집할 것들에 대해 정의한다. 예를 들면 어.. 2025. 1. 20.
[JavaScript/알고리즘] 체육복 (Greedy) 프로그래머스 Lv 1 - 체육복 Solved-Algorithm/JavaScript/프로그래머스/1/42862. 체육복 at main · ParkBible/Solved-AlgorithmThis is an auto push repository for Baekjoon Online Judge created with [BaekjoonHub](https://github.com/BaekjoonHub/BaekjoonHub). - ParkBible/Solved-Algorithmgithub.com 좀 많이 헤맸습니다. 이게 1레벨이라니...근데 작성된 코드를 보면 별거 없음... (그리디 특징인가?)function solution(n, lost, reserve) { const losts = lost.filter(l .. 2025. 1. 11.
[JavaScript/알고리즘] 게임 맵 최단거리 (BFS) 프로그래머스 Lv 2 - 게임 맵 최단거리 Solved-Algorithm/JavaScript/프로그래머스/2/1844. 게임 맵 최단거리 at main · ParkBible/Solved-AlgorithmThis is an auto push repository for Baekjoon Online Judge created with [BaekjoonHub](https://github.com/BaekjoonHub/BaekjoonHub). - ParkBible/Solved-Algorithmgithub.com 상하좌우로 움직일 수 있는 전형적인 BFS 문제입니다.function solution(maps) { const n = maps.length; const m = maps[0].length; co.. 2025. 1. 10.
[JavaScript/알고리즘] PermCheck Lesson 4 (Counting Elements) - PermCheck(Easy) Test results - CodilityA non-empty array A consisting of N integers is given. A permutation is a sequence containing each element from 1 to N once, and only once. For example, array A such that: A[0] = 4 A[1] = 1 A[2] = 3 A[3] = 2 is a permutation, but array A such that: A[0] =app.codility.com배열의 값들이 연속적인 값이면 1을, 그렇지 않다면 0을 출력하는 문제입니다. 시도1 (실패)funct.. 2025. 1. 8.
[JavaScript/알고리즘] PassingCars (누적값 문제) Lesson 5 (Prefix Sums) - PassingCars(Easy) Test results - CodilityA non-empty array A consisting of N integers is given. The consecutive elements of array A represent consecutive cars on a road. Array A contains only 0s and/or 1s: 0 represents a car traveling east, 1 represents a car traveling west. The goal is to countapp.codility.com점수: 40/100 도로와 차들이 있다. 차는 값이 0일때 동쪽, 1일때 서쪽으로 움직인다.위의 그림처럼 A[.. 2025. 1. 8.
[JavaScript/알고리즘] FrogRiverOne Lesson 4 (Counting Elements) - FrogRiverOne(Easy) Test results - CodilityA small frog wants to get to the other side of a river. The frog is initially located on one bank of the river (position 0) and wants to get to the opposite bank (position X+1). Leaves fall from a tree onto the surface of the river. You are given an arrayapp.codility.com 부끄러운 이야기지만 제 블로그니까 해봅니다.처음에 영어로 된 문제 이해 못해서 18점 받았습니다.. 2025. 1. 7.
[JavaScript/알고리즘] TapeEquilibrium (feat. 경계값 테스트) Lesson 3 (Time Complexity) - TapeEquilibrium(Easy) Test results - CodilityA non-empty array A consisting of N integers is given. Array A represents numbers on a tape. Any integer P, such that 0 app.codility.com점수: 84/100 배열을 두 부분으로 나눠서 각 부분의 합계를 구한 뒤 차이를 구하고, 그 차이의 최솟값을 구하는 문제입니다. 예를 들어서 [3, 1, 2, 4, 3] 이라는 배열이 있다면 3+1+2 / 4+3 으로 나눴을 때의 차이가 1로 가장 작기 때문에 답은 1입니다. 초기 코드function solution(A) { le.. 2025. 1. 5.
[JavaScript/알고리즘] PermMissingElem Lesson 3 (Time Complexity) - PermMissingElem(Easy) Test results - CodilityAn array A consisting of N different integers is given. The array contains integers in the range [1..(N + 1)], which means that exactly one element is missing. Your goal is to find that missing element. Write a function: function solution(A); that, given aapp.codility.com점수: 100/100 1부터 n까지의 수가 존재하는 배열(순서 무작위) 에서 빠진 수 하나를 .. 2025. 1. 5.
[JavaScript/알고리즘] FrogJmp Lesson 3 (Time Complexity) - FrogJmp(Easy) Test results - CodilityA small frog wants to get to the other side of the road. The frog is currently located at position X and wants to get to a position greater than or equal to Y. The small frog always jumps a fixed distance, D. Count the minimal number of jumps that the smalapp.codility.com X의 위치에 있는 개구리가 Y와 같거나 먼 위치로 이동하려고 하는데 한번에 D만큼만 이동할 수 있습니다. .. 2025. 1. 5.
[JavaScript/알고리즘] OddOccurrencesInArray (feat. Map) Lesson 2 (Arrays) - OddOccurrencesInArray(Easy) Test results - CodilityA non-empty array A consisting of N integers is given. The array contains an odd number of elements, and each element of the array can be paired with another element that has the same value, except for one element that is left unpaired. For example, in arrapp.codility.com점수: 55/100 홀수로만 이루어진 숫자 배열이 주어지고, 거기서 하나의 요소를 제외하면 전부 자.. 2025. 1. 4.
[JavaScript/알고리즘] CyclicRotation (feat. 테스트 케이스) Lesson 2 (Arrays) - CyuclicRotation(Easy) Test results - CodilityAn array A consisting of N integers is given. Rotation of the array means that each element is shifted right by one index, and the last element of the array is moved to the first place. For example, the rotation of array A = [3, 8, 9, 7, 6] is [6, 3, 8, 9,app.codility.com점수: 62/100 일단 코딜리티는 문제를 제출하면 코드 수정을 못하더군요.테스트 케이스를 추가하는 능력도 중.. 2025. 1. 4.
[JavaScript/알고리즘] BinaryGap 먼저 아래는 Codility의 데모 문제들을 풀어볼 수 있는 사이트입니다.  Developer Training | Test Coding Skills Online - CodilityFind longest sequence of zeros in binary representation of an integer.app.codility.com 사이트의 첫 번째 문제, BinaryGap (Easy) 입니다.Easy라고는 하는데 영문으로 된 문제는 처음 풀어봐서 좀 어지럽습니다. https://app.codility.com/demo/results/trainingFQ7EBE-YTU/ Test results - CodilityA binary gap within a positive integer N is any maxima.. 2025. 1. 3.
[JavaScript/알고리즘] K번째수 (feat. sort() 메소드) 프로그래머스 Lv.1 "K번째수" 문제입니다. Solved-Algorithm/JavaScript/프로그래머스/1/42748. K번째수 at main · ParkBible/Solved-AlgorithmThis is an auto push repository for Baekjoon Online Judge created with [BaekjoonHub](https://github.com/BaekjoonHub/BaekjoonHub). - ParkBible/Solved-Algorithmgithub.com??? : 어 겁나 쉽네   function solution(array, commands) { const results = []; for (command of commands) { c.. 2024. 12. 17.
[TypeScript] 유틸리티 타입 (Partial, Required, Record, Pick, Omit, Exclude) 소개유틸리티 타입(Utility Types)은 개발자의 편의를 위해 타입스크립트가 제공하는 특수한 타입들이다. 기존의 타입을 조작한 여러가지 유용한 타입을 만들 수 있다.  상황타입스크립트를 사용하면서 Interface로 타입을 정의하게 되는데, 어떤 변수를 정의할 때는 일부분의 필드만을 사용하고 싶다. 이런 상황이라면, 유틸리티 타입을 고려해볼 수 있다.  Documentation - Utility TypesTypes which are globally included in TypeScriptwww.typescriptlang.org   Partial, Requiredinterface User { name: string; age: number;}const user: Partial = { n.. 2024. 12. 12.