본문 바로가기

전체 글137

B-Tree와 DB index index: DB에서 데이터를 찾을 때 full scan 말고, index를 사용하여 빠르게 한번에 접근할 수 있다page: 디스크와 메모리에 데이터를 읽고 쓰는 최소 작업 단위= 한 번 읽을 때 page만큼을 읽어옴index와 B-Tree인덱스 자체가 B-Tree로 구성되어 있다.]루트 노드에서 찾을 인덱스 키가 어딨는지 page단위로 이동하며 찾는다.DB에서 BST대신 BTree를 쓰는 이유여러 키를 하나의 노드에 저장하기 때문에 노드 수가 적어 더 적은 디스크 I/O를 발생 시킨다디스크 I/O란, 한 지점에서 다른 지점으로 점프, 위치를 찾아가는 것DB 성능 개선 혹은 쿼리 튜닝은 디스크 I/O 자체를 줄이는 것이 핵심인 경우가 많다자기가 알아서 균형을 맞추기 때문에, 각 데이터 별로 접근 시간이 .. 2024. 4. 27.
Binary Tree, Binary Search Tree, B-Tree DB 공부하다 B-Tree와 Binary tree들이 헷갈려서 정리할 겸 쓰는 글 Binary Tree (이진 트리) : 자식이 최대 2개인 트리Complete Binary Tree (완전 이진 트리) : 앞에서부터 순서대로 채워지는 트리Full Binary Tree : 모든 depth가 다 채워진 트리Balanced Binary Tree : 모든 leaf node의 depth 차이가 1 이내Binary Search Tree (이진탐색 트리, BST) : 왼쪽엔 현재 노드보다 작은 거, 오른쪽은 큰거Heap (Binary Heap)Max Heap: 부모 노드의 키 값이 자식 노드의 키 값보다 항상 큼Min Heap: 반대Complete Binary Tree의 성질을 가짐추가: 맨 끝에(complete b.. 2024. 4. 27.
백준 g3 11779 최소비용 구하기 2 c++ (다익스트라 경로 복원) https://www.acmicpc.net/problem/11779 11779번: 최소비용 구하기 2 첫째 줄에 도시의 개수 n(1≤n≤1,000)이 주어지고 둘째 줄에는 버스의 개수 m(1≤m≤100,000)이 주어진다. 그리고 셋째 줄부터 m+2줄까지 다음과 같은 버스의 정보가 주어진다. 먼저 처음에는 그 버스 www.acmicpc.net 문제 다익스트라인데 경로 복원하기 풀이 pre[노드] 배열을 둬서 경로가 업데이트 될 때마다 이전의 노드가 무엇이었는지 추가하고, 마지막에 pre[end] -> pre[start]로 따라가면 경로가 나온다. 다익스트라는 노드를 하나씩 확정시켜나가면서 확정된 노드의 인접한 노드들을 업데이트하므로, pre[확정된 노드의 인접한 노드] = 확정된 노드로 경로 복원을 할 .. 2024. 4. 21.
백준 g4 1753 최단경로 c++ (다익스트라) https://www.acmicpc.net/problem/1753 1753번: 최단경로 첫째 줄에 정점의 개수 V와 간선의 개수 E가 주어진다. (1 ≤ V ≤ 20,000, 1 ≤ E ≤ 300,000) 모든 정점에는 1부터 V까지 번호가 매겨져 있다고 가정한다. 둘째 줄에는 시작 정점의 번호 K(1 ≤ K ≤ V)가 www.acmicpc.net 다익스트라 매 단계마다 도달할 수 있는 정점 중에서, 시작점으로부터 거리가 가장 가까운 점을 구해서 그 거리를 확정 짓는 방법이다. 1. 노드 선택(시작점으로부터의 거리가 가장 가까운 노드) 2. 그 노드에서 뻗어나가는 간선들을 베이스로 인접한 노드들을 모두 업데이트 원래 기록된 거리 vs. 1번에서 선택한 노드를 거쳤을 때의 거리 중 더 짧은 것으로 업데이트.. 2024. 4. 21.
[javascript] 이벤트 위임 event delegation + bind(this) 정의 1 2 3 6 5 4 이런 table의 td에 접근할 때, 각각의 td에 event handler를 할당하는 것이 아닌 table자체에 event handler 하나만 할당함으로써 여러 요소의 event handler를 한꺼번에 다룰 수 있음! (캡처링, 버블링 베이스: https://kyj0032.tistory.com/125) 활용하기 1) menu의 button에 알맞은 함수 실행하기 menu안 button 각각에 event handler를 할당하는 대신, menu에서 button에 발생한 event를 받아서 맞는 함수를 처리할 수 있다. 저장하기 불러오기 검색하기 * js class의 인스턴스 변수: https://kyj0032.tistory.com/126 this._elem = elem; *.. 2024. 4. 19.
[html] html의 data-* 속성 https://developer.mozilla.org/ko/docs/Learn/HTML/Howto/Use_data_attributes 표준이 아닌 속성이나, 추가적인 DOM 속성과 같이 다른 조작을 하지 않고도 HTML 태그에 추가 정보를 저장할 수 있도록 도와줌 속성 할당 2024. 4. 19.
[javascript] 생성자 안에서 인스턴스 변수 초기화 배경 https://ko.javascript.info/event-delegation 이벤트 위임 ko.javascript.info 저장하기 불러오기 검색하기 이벤트 위임을 공부하던 중, 낯선 class 개념이 나왔다. class Menu { constructor(elem) { this._elem = elem; elem.onclick = this.onClick.bind(this); // (*) } 생성자 안에서 두번째 statement는 elem의 onclick을 현재 객체에 있는 onClick함수에 바인딩하기 위함이라고 이해했다. this._elem = elem; 그렇지만 첫번째 statement는 대체 무슨 역할을 하는 걸까? _elem이란 변수를 쓰지도 않는데 .. 답변 1. 일단 언더바(_)는 ja.. 2024. 4. 19.
[javascript] 이벤트 버블링, 캡처링 EM을 클릭했는데도 DIV에 할당한 핸들러가 동작합니다. HTML 삽입 미리보기할 수 없는 소스 안에 있는 , 를 눌러도 div에 할당된 onclick 이벤트 핸들러가 작동한다. 처음엔 그냥 div가 div 안 전체 영역을 포함하는 것(트리구조)이라 그런 게 아닐까?라고 생각했지만.. 그거랑 별개로 이벤트 버블링이 동작하는 거라 그런 거였다. 이벤트 버블링으로 내가 생각한 "포함하는 구조"라는 직관적 개념이 구현되는 듯 1. 이벤트 버블링 한 요소에 이벤트가 발생하면, 이 요소에 할당된 핸들러가 동작하고 부모 요소의 핸들러가 동작한다. 부모의 부모를 거슬러 가면서 최상단의 요소까지 모든 할당된 이벤트 핸들러를 실행한다.' FORM DIV P HTML 삽입 미리보기할 수 없는 소스 가장 안 쪽의 를 클릭하.. 2024. 4. 19.
[javascript] 이벤트 1. 이벤트란 무언가 일어났다는 것 자주 쓰는 DOM 이벤트 예시 click, mouseover, mousedown, mouseup submit, focus keydown, keyup 등등 이벤트 핸들러 이벤트에 반응하기 위해, 이벤트가 발생했을 때 실행되는 함수 2. 이벤트 핸들러 구현 1) HTML 속성 HTML 삽입 미리보기할 수 없는 소스 해당 버튼을 누르면 onclick 안의 함수가 주어진다. + 이때, "" 안은 ''여야 한다. 그래야 헷갈리지 않고 코드가 제대로 실행된다. + 속성값은 대소문자 상관 없다. 2) DOM property + HTML attribute와 DOM property의 차이점 HTML attribute는 HTML에 존재, 문자열 DOM property는 DOM에 존재, .. 2024. 4. 18.