브라우저에서 검색창에 키워드를 입력하면 어떤 일이 일어날까? 검색 결과를 가져오기 위해 서버에 요청을 보내고, 응답을 받아 화면에 표시하는 동안에도 우리는 다른 탭을 열거나 스크롤을 내릴 수 있다. 하지만 자바스크립트는 싱글 스레드 언어다. 그렇다면 한 번에 하나의 작업만 처리할 수 있지 않을까? 이런 동작이 어떻게 가능한 걸까? 동기$_{synchronous}$ 처리는 은행 창구에서 한 명의 고객이 업무를 마쳐야 다음 고객의 업무를 처리하는 것처럼 한 작업이 끝나야만 다음 작업을 시작하는 방식이다. 반면 비동기$_{asynchronous}$ 처리는 카페에서 주문을 받은 후 에스프레소 샷이 내려오는 동안 다음 손님의 주문을 받을 수 있는 것처럼 이전 작업이 끝나기를 기다리지 않고 다음 작업을 실행할 수 ..

자바스크립트의 스코프는 변수의 유효한 범위를 의미한다. var로 선언한 변수는 오직 함수의 중괄호 내부만을 유효 범위로 인정하는데, 이를 함수 레벨 스코프$_{function \space level \space scope}$라 한다. 반면 C나 자바 등 대부분의 프로그래밍 언어는 모든 중괄호(함수, if문, for문, while문 등) 내부를 유효 범위로 인정한다. 이러한 특성을 블록 레벨 스코프$_{block \space level \space scope}$라 한다. var x = 1;if (true) { var x = 10; console.log("if문 안쪽:", x);}console.log("if문 바깥쪽:", x);위 예제를 보면 if문 내부와 외부에서 선언된 x가 같은 변수를 가리킨다. v..

React로 개발을 하다 보면 이벤트 핸들링은 피할 수 없다. 버튼 클릭, 폼 입력, 마우스 호버 등 사용자와의 상호작용을 처리하기 위해서는 이벤트를 다뤄야 한다. 하지만 브라우저마다 이벤트 처리 방식이 조금씩 다르다. React는 이런 브라우저 간의 차이를 어떻게 해결했을까?  합성 이벤트React는 브라우저 간 차이를 해결하기 위해 합성 이벤트$_{synthetic \space event}$ 개념을 도입했다. 브라우저의 네이티브 이벤트를 한 번 감싸서 모든 브라우저에서 동일하게 동작하도록 만든 것이다. 브라우저마다 이벤트를 처리하는 방식이 다르다는 점은 웹 개발에서 오랫동안 골칫거리였다. 예를 들어 Internet Explorer에서는 이벤트 객체를 전역 window 객체를 통해 접근해야 하고, 다른..

React로 개발을 하다 보면 사용자의 입력을 받아야 하는 상황이 자주 생긴다. 이메일 입력, 게시글 작성, 설문 응답처럼 폼을 사용하는 기능을 구현할 때가 많다. React는 선언적인 특성을 가지고 있어서 기존 HTML 폼을 다루는 방식과는 다른 접근이 필요하다. 폼을 다루는 방식은 크게 Uncontrolled Components와 Controlled Components로 나눌 수 있다.  Uncontrolled componentUncontrolled Components는 React가 직접 상태를 제어하지 않는 폼 요소를 의미한다. 일반적인 HTML 폼처럼 DOM이 직접 폼 데이터를 관리하며, React는 필요할 때만 ref를 통해 값을 읽어오는 방식이다. 기본적인 Uncontrolled Compone..

2024년을 보내고 새로운 2025년이 왔다. 새해를 맞이해 방향성을 돌아보고 올해는 어떻게 지내면 좋을지 생각해보는 시간을 가졌다. 작년에 아쉬웠던 것들은 2024년에 정리하고, 2025년에는 안 좋은 습관들을 개선하고, 새로운 도전을 가능한 많이 해보고자 한다. 작년 2024 회고를 통해 한 해의 경험을 정리했으니, 이번 달 회고에서는 올해 어떤 일들을 실천해볼지 정해보자.  건강 유지체중 감량에는 어느 정도 성공했지만, 이제는 어느 정도 유지를 하면서 체지방량 관리에 집중하려고 한다. 구체적인 목표로는 골격근량을 유지하면서 체지방률을 20% 미만으로 줄여보려 한다. (할 수 있을까..?) 운동 루틴은 주 3회(대흉근/등/하체) 웨이트 트레이닝을 기본으로 잡았다. 여기에 런닝을 병행해야 신체적, 정신..

https://www.acmicpc.net/problem/11899 스택을 활용해 문자열을 처리했다.여는 괄호는 스택에 push닫는 괄호는 스택이 비어있지 않고 top이 여는 괄호면 pop, 그렇지 않으면 스택에 push하는 방식으로, 최종적으로 남은 괄호 개수를 셌다. import sysinput = sys.stdin.readlinen = input().strip();stack = []for char in n: if char == ')': if stack and stack[-1] == '(': stack.pop() else: stack.append(char) else: stack.append(char)print(len(stack))

https://www.acmicpc.net/problem/17827 모듈러 연산을 이용하는 문제였다. 첫 순회를 돌고, 그 다음부터는 n - v + 1의 길이만큼만 순회하는 방식으로 식을 구성했다.  import sysinput = sys.stdin.readlinen, m, v = map(int, input().split())arr = list(map(int, input().split()))for i in range(m): cnt = int(input()) if cnt