MOLLY

0. Map과 Set 딥 다이브 계기1. Set2. Map3. Set과 Map 차이4. Set과 Map, 일반 객체의 차이점5. 왜 일반 객체는 키가 문자열로 변환되는 거고, Map은 객체나 배열도 키로 저장되게끔 설계된 걸까?  0. Map과 Set 딥 다이브 계기 여느 때처럼 알고리즘 문제를 풀기 위해 돌아다니던 중, '캐시'라는 문제를 발견했다.기업에서 실제로 낸 코테 문제를 좋아하는 나는 어렵든 말든 일단 도전해봤다.  LRU랑 cache hit, cache miss가 뭔지 도통 전혀 모르겠어서 다른 분의 풀이를 보며 찬찬히 이해하기 시작했다. function solution(cacheSize, cities) { // DB 캐시를 적용할 때 캐시 크기에 따른 실행시간 측정 let answer..

0. TL;DR1. 타임라인 다이어그램 그리는 단계2. 더 빠르게 동작하는 타임라인3. 모든 병렬 콜백을 기다리는 Cut(컷)4. 멱등성*을 적용해, 여러 번 호출하더라도 한 번만 실행되도록5. 명시적 시간 모델6. 기타 | 어떠한 응답이 다른 응답보다 가끔 늦어지는 이유?  드디어 쏙쏙 들어오는 함수형 코딩 스터디 마지막이다!유익한 내용도 꽤 있었지만 설명이 좋지 않아서 이해하는 데 시간이 꽤 걸리기도 하였다. 다음에 읽을 땐 하이라이트 처리한 부분 위주로 읽어야겠다. 스터디 내용은 블로그와 개인 노션에 핵심 정리하며 읽었는데 확실히 큰 도움이 되었다.이해가 안 되는 부분이나 이해는 되었으나 필자가 제대로 설명하지 못해 헷갈리는 부분은 내 표현대로 다시 개념과 내용을 정립했다. 기억에 오래 남을 것 같..

0. TL;DR 1. 타임라인 다이어그램 | 기본 규칙 2. 타임라인 다이어그램 | 좋은 타임라인의 원칙 3. 타임라인 다이어그램 | 타임라인 단순화 4. 챕터 속 예제 에러 & 해결책 | 공유하는 자원 없애 해결 0. TL;DR 타임라인 다이어그램: 코드가 순서대로 실행되는지 or 동시에 실행되는지 알림 자원을 공유하는 부분: 버그 발생 확률이 높음 자원을 공유하지 않는 부분: 독립적으로 이해하고 실행 가능 타임라인 다이어그램의 기본 규칙 두 액션이 순서대로 나타나면 같은 타임라인에 넣음 동시에 실행되거나 순서를 예상할 수 없다면, 분리된 타임라인에 넣음 좋은 타임라인의 원칙 타임라인이 ‘적을수록’ 이해하기 쉬움 타임라인이 ‘짧을수록’ 이해하기 쉬움 공유하는 자원(e.g. 변수)이 적을수록..

[들어가며] 알아둬야 할 개념0. TL;DR1. 복잡한 반복문을 함수형 도구 체인으로 바꾸는 방법2. 반복문을 함수형 도구로 리팩토링3. 체이닝 디버깅을 위한 Tip    [들어가며] 알아둬야 할 개념시퀀스: 컴퓨터 과학 & 프로그래밍에서 ‘특정한 순서대로 내열된 데이터’를 표현하는 자료구조 or 데이터 유형데이터의 순서가 중요각 요소가 그 순서에 따라 접근할 수 있는 특성을 갖고 있음e.g. 자바스크립트에선 배열, 문자열이 해당항등 함수: 인자로 받은 값을 그대로 return 하는 함수아무 일도 하지 않지만, 아무것도 하지 않아야 할 때 유용하게 사용 가능  0. TL;DR체인: 여러 단계를 조합하는 것원하는 결과에 가까워지도록 데이터를 한 단계씩 변환기존에 있던 반복문을 함수형 도구 체인으로 리팩토링..

[들어가며] 알아둬야 할 개념0. TL;DR1. 카피-온-라이트 리팩토링2. 함수를 return 하는 함수   [들어가며] 알아둬야 할 개념일급 함수: 함수가 다른 데이터 타입(숫자, 문자열 등)과 동일하게 취급되는 것⇒ 함수를 변수에 할당하거나, 함수의 인자로 전달, 함수에서 반환할 수 있는 함수를 의미. 자바스크립트에서 함수는 일급 객체다.고차 함수: 함수를 인자로 받거나 함수를 반환하는 함수[차이점] 일급은 인자로 ‘전달’할 수 있음. 고차는 함수가 다른 함수를 인자로 ‘받을’ 수 있음  0. TL;DR고차 함수 사용 시, 장점패턴 or 원칙을 코드로 만들 수 있음 ⇒ 중복된 많은 코드를 없애줌 (사용하지 않으면 일일이 수작업 해야 함)함수를 리턴하는 함수를 만들 수 있음단점: 가독성이 안 좋을 수..

[들어가며] 알아둬야 할 개념0. TL;DR1. 추상화 벽2. 작은 인터페이스3. 편리한 계층4. 호출 그래프   [들어가며] 알아둬야 할 개념소프트웨어 설계(software design): 코드를 만들고, 테스트하고, 유지 및 보수하기 쉬운 프로그래밍 방법을 선택하기 위해 미적 감각을 사용하는 것계층형 설계(stratified design): 바로 아래 계층에 있는 함수로 현재 계층의 함수를 구현해, 소프트웨어 코드를 계층으로 구성하는 기술  0. TL;DR추상화 벽: 신경 쓰지 않아도 되는 부분을 나누고, 계층 간의 역할과 책임을 명확히 하는 것[효과] 팀 간 커뮤니케이션 비용을 줄이고, 복잡한 코드를 명확히 함작은 인터페이스: 추상화 벽에 있는 코드를 최소화하고, 새로운 기능은 추상화 벽 위 계층에..

0. [프로그래머스] Lv.2 피보나치 수1. 해결한 코드2. 피보나치 수열에 대한 설명  0. [프로그래머스] Lv.2 피보나치 수 요즘은 레벨 1, 2 위주로 프로그래머스 문제를 보고 있는데, 오늘은 프로그래머스 설명만으론 이해하기 어려운 '피보나치 수' 문제를 풀게 되었다. 문제 이해가 안 되니 코드 짜는 것도 도통 감이 안 와서 일단 정답을 봤다. 여러 풀이가 있었지만 가장 간단하면서 보기 좋은 코드를 선택해 코드 분석을 하였다. 그 내용은 아래와 같다.  1. 해결한 코드function solution(n) { let fib = [0, 1]; // 피보나치 수는 0과 1로 시작하므로 첫 두 항을 초기화 for (let i = 2; i  처음 보는 개념이 늘 바로 이해되면 좋겠지만, ..

1. replace() 메서드2. JWT | Access Token과 Refresh Token의 존재 이유3. JWT | Access Token과 Refresh Token의 개념과 관리 전략4. 쿠키, 세션, 토큰의 개념5. 유닛 테스트의 필요성6. 프론트엔드 에러 모니터링 및 로그 데이터 수집의 필요성  1. replace() 메서드: 문자열에서 특정 부분을 다른 문자열로 교체하는 데 사용원본 문자열을 변경하지 않고, 변경된 새로운 문자열을 반환함. replace()를 활용하면 문자열의 특정 부분을 효율적으로 대체할 수 있음  기본 사용법const str = "Hello, world!";const newStr = str.replace("world", "JavaScript");console.log(new..

0. TL;DR1. 방어적 복사는 원본이 바뀌는 걸 막아준다2. 방어적 복사 구현하는 법3. 방어적 복사를 사용하는 실제 사례4. 카피-온-라이트 & 방어적 복사 비교   Ch7 | 신뢰할 수 없는 코드를 쓰면서 불변성 지키기[들어가며] 이 챕터에서 배울 핵심 내용*레거시 코드나 신뢰할 수 없는 코드로부터 내 코드를 보호하기 위해 방어적 복사 만들기얕은 복사, 깊은 복사의 차이카피-온-라이트 & 방어적 복사를 언제 사용하면 좋을지 🍯 레거시 코드 (legacy code): 오래 전에 만든 것으로, 지금 당장 고칠 수 없어서 그대로 사용해야 하는 코드  0. TL;DR방어적 복사: 신뢰할 수 없는 코드 or 데이터가 안전한 코드로 들어오고 나갈 때마다 복사본을 만듦 → 들여보내거나 내보냄불변성을 구현하는..

0. TL;DR1. [원칙] 암묵적 입력과 출력은 적을수록 좋다.2. [원칙] 설계: 엉켜있는 코드를 푸는 것3. [적용] 함수를 분리해 더 좋은 설계 만들기   0. TL;DR암묵적 입력과 출력은 ‘인자’와 ‘리턴값’으로 바꿔 없애는 게 좋음암묵적 입력: 인자가 아닌 모든 입력암묵적 출력: 리턴값이 아닌 모든 출력‘설계’란 엉켜있는 코드를 푸는(분리하는) 것. 풀려있는 건 언제든 다시 합칠 수 있음코드를 분리해 각 함수가 하나의 일만 하면, 개념을 중심으로 쉽게 구성 가능  들어가기 전, 가벼운 Q&A를 살펴보자.Q1. 코드 라인 수가 적어야 좋은 코드인가?A. 코드 라인 수만으로 유지보수하기 좋은 코드인지 판별하기는 어렵다.측정할 수 있는 여러 가지 지표 중 하나는 ‘함수의 크기’다. 작은 함수는 이..