Map은 키/값 쌍(Key/Value pair)을 저장하며, 모든 유형의 값(객체, 원시값 등)을 키나 값으로 사용할 수 있습니다.각 키는 컬렉션 내에서 유일하게 존재합니다.키의 중복 여부는 SameValueZero 알고리즘을 통해 판단합니다. 명세에 따르면, Map은 구현 시 평균적으로 선형 미만의 접근 시간을 제공하는 메커니즘을 사용해야 합니다. SameValueZero 비교 알고리즘Map과 Set의 키 비교, 그리고 Array.prototype.includes 메서드 등에서 "값이 같은지"를 판단할 때 사용되는 알고리즘입니다.NaN과 NaN을 같은 값으로 간주합니다.+0과 -0을 같은 값으로 간주합니다. (부호를 무시)// 이해를 위한 코드function sameValueZero(x: any, y:..

코딩테스트 연습 - 택배 상자 꺼내기 | 프로그래머스 스쿨 프로그래머스SW개발자를 위한 평가, 교육의 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 풀이n: 택배 상자의 개수w: 가로로 놓는 상자의 개수num: 꺼내려는 택배 상자의 번호 필요한 기능getTopBoxPosition(): 파라미터로 전달받은 박스 위치 위에 존재하는 박스 번호를 반환하는 함수더 이상 위에 존재하는 박스가 없을 때 까지 getTopBoxPosition()를 재귀적으로 호출하는 로직getTopBoxPosition() 함수가 호출된 횟수를 저장해두는 변수 getTopBoxPosition() 구현 규칙N층 상자 번호와 N+1층의 상자 번호 숫자의 합은 동일하다N층 상자 번호와 N+..

DOM을 자주 조작하는 웹 애플리케이션에서는 작은 차이가 곧 성능 차이로 이어집니다.특히 요소를 삭제하고 다시 만드는 방식보다는, 이미 존재하는 요소를 숨기고 다시 보여주는 방식이 훨씬 효율적입니다.아래에서 그 이유와 함께 다양한 성능 최적화 기법을 정리했습니다. 1. 새로운 요소 생성보다 "숨기기/표시"를 우선하자요소를 삭제하고 다시 생성하는 대신, 이미 있는 요소를 숨기거나(show/hide) 표시하는 방식은 DOM 변경을 최소화할 수 있어 성능상 유리합니다. display: none 방식의 장점렌더링 비용이 낮다display: none 처리가 된 요소는 DOM 트리에는 존재하지만 렌더 트리에는 포함되지 않기에 브라우저가 화면에 그릴 필요가 없고, Layout이나 Reflow 과정에서도 해당 요소를..

1. useState의 초기 렌더링: Dispatch가 어떻게 생성될까?function mountState( initialState: (() => S) | S,): [S, Dispatch>] { const hook = mountStateImpl(initialState); const queue = hook.queue; const dispatch: Dispatch> = (dispatchSetState.bind( null, currentlyRenderingFiber, queue, ): any); queue.dispatch = dispatch; return [hook.memoizedState, dispatch];} dispatch 함수는 초기 렌더 시점에 단 한 번 생성된다.dis..

React 19.3.0의 useState 구현을 보면 다음과 같다export function useState( initialState: (() => S) | S,): [S, Dispatch>] { const dispatcher = resolveDispatcher(); return dispatcher.useState(initialState);}resolveDispatcher()가 반환하는 dispatcher 객체의 useState 메서드를 호출할 뿐이다. resolveDispatcher가 반환하는 값function resolveDispatcher() { const dispatcher = ReactSharedInternals.H; return ((dispatcher: any): Dispatcher)..