Code Playground

< h1 > Code Playground </ h1 >

Quick Sort 퀵 정렬은 1960년에 찰스 앤터니 리처드 호어(C.A.R hoare)가 처음 제안한 방법으로 이후 많은 사람들이 수정 보완하여 완성된 정렬 알고리즘이다. 이 알고리즘은 처음 소개된 이후로 반세기가 넘었지만 현존하는 가장 빠른 정렬 알고리즘 중에 하나이다. 퀵 정렬은 in place 방법과 in place가 아닌 방법 2가지가 있는데 실제로 많이 쓰이는 방법은 메모리 사용량이 적은 in place 방법이다. 그러나 in place가 아닌 방법이 더 직관적으로 이해하기 쉬우므로 이 방법을 먼저 정리하고 그 다음 in place 방법을 정리하겠다. Basic Quick Sort - Not In Place 퀵 정렬은 지난번 병합 정렬 포스팅에서 소개한 Divide and Conquer 전략..

Tree 트리(Tree)는 이름 그대로 나무를 거꾸로 뒤집어 놓은듯한 형태이다. 자료구조가 하나의 뿌리에서 뻗어나가는 형상을 하고 있다. 트리 구조는 우리 일상에서 흔히 볼 수 있는 계층적인 구조(Hierarchical Structure)를 컴퓨터에서 표현한 구조이다. 한 가족의 족보나 회사의 조직도 등이 바로 트리 구조이다. 족보같은 경우 조상으로부터 자식, 자식의 자식, 자식의 자식의 자식 형태로 이루어져있기 때문이다. 컴퓨터의 파일 시스템이나 웹 페이지의 DOM 구조도 트리 구조이다. 트리 구조는 대개 위 그림과 같은 구조이다. 트리의 각 요소들은 Node라고 부르고 가장 상위의 노드를 Root Node라고 부른다. 반대로 최하위 노드는 Leaf Node 혹은 Terminal Node라고 한다. L..

Binary Search(이진탐색) 만약 어떤 친구가 1부터 10까지 중에 숫자 하나를 생각한 다음 우리에게 그 숫자가 뭔지 맞춰보라고 했다고 생각해보자. 이 때 그 숫자를 맞추기 위해 1부터 10까지 하나 하나 이 숫자가 맞는지 물어본다면 우리는 최악의 경우에 10번을 질문해야할 것이다. 그런데 만약에 우리가 1과 10의 가운데 숫자를 부르고 맞춰야 할 숫자가 그 숫자보다 작은지 큰지 친구가 알려준다면 어떻게 될까? 만약에 우리가 맞춰야할 숫자 x가 3이라고 해보자. 1과 10의 중간 숫자인 5와 비교한다. x < 5 1 2 3 4 5 6 7 8 9 10 우리가 찾는 숫자는 5보다 작으니까 5보다 큰 숫자는 모두 지울 수 있다. 이제 검색할 범위가 절반 이하로 줄어들었다. 이제 1과 5의 중간인 2와 ..

https://im-developer.tistory.com/121?category=828401 [자료 구조] Data Structure - (1) Stack / Queue / Linked List 자료 구조는 코딩과는 별로 상관없는 것처럼 보일 수도 있겠지만 사실 프로그래밍에 있어서 매우 중요한 부분을 차지한다. 내가 어떠한 프로그램을 구현할 때, 혹은 어떤 알고리즘 문제를 해결하거나 새로운 로직.. im-developer.tistory.com 지난번 포스팅에서 정리한 Linked List는 대충 아래와 같이 생겼다. Linked list는 배열과 비교했을때 특정 데이터를 검색하는데 시간이 오래 소요된다. 그 이유는 배열은 각 공간의 주소가 인덱스라는 것으로 정해져있기 때문이다. 따라서 어떤 값의 주소만..

오늘은 자료 구조 중에서 매우 중요한 것들 중 하나인 Hash Table(해시테이블) 자료 구조에 대해서 정리해보려고 한다. 만약에 다음과 같은 친구들의 이름과 전화번호 리스트가 있다고 해보자. 1 Alice 010-1234-**** 2 Sam 010-1357-**** 3 Mike 010-1248-**** ... ... 10 Harry 010-9876-**** 이제 친구들의 이름, 전화번호 데이터를 어디엔가 저장해뒀다가 전화번호가 필요할 때마다 친구들의 이름을 입력해서 전화번호 데이터를 찾으려고 한다. 이 때 친구들의 전화번호를 가장 빠르게 찾기 위한 방법 중 하나가 바로 해시 테이블이다. 해시 테이블을 구성하는 데는 해시 함수(Hash function)라는 것이 필수적이다. 해시 함수는 친구 이름과 같..

자료 구조는 코딩과는 별로 상관없는 것처럼 보일 수도 있겠지만 사실 프로그래밍에 있어서 매우 중요한 부분을 차지한다. 내가 어떠한 프로그램을 구현할 때, 혹은 어떤 알고리즘 문제를 해결하거나 새로운 로직을 만들어야할 때 데이터들을 어떤 구조로 저장하느냐에 따라서 프로그램의 효율성이나 성능 면에서 차이가 날 수 있기 때문이다. 따라서 오늘은 자료 구조 중에서 가장 기본적인 3가지를 간단하게 정리해보려고 한다. Stack (스택) Stack은 자료를 한 줄로 블록을 쌓듯이 추가하는 형태의 자료 구조이다. Stack의 맨 위에 자료를 추가하는 것을 우리는 push라고 하고 반대로 맨 위의 자료를 하나씩 제거하는 것을 우리는 pop이라고 한다. 위 그림처럼 스택은 어느 한 곳에 블록처럼 자료가 쌓이기 때문에 스..

바닐라코딩 부트캠프 프렙 과정을 끝마치고 본과정으로 들어가기 전 일주일 동안의 휴식 기간이 있었는데, 정말 최선을 다해(!) 열심히(!) 놀았다. ㅋㅋㅋ 이제 다음주 월요일에 부트캠프 시작하고 열심히 달려야하니까 오늘부터 슬슬 그동안 공부했던거 읽어보면서 기억을 되살려보려고 한다... 오늘은 프렙 과정에서 배웠던 내용들 중에서 아직 정리를 못한 Rest Parameter, Spread Operator와 Destructuring에 대해서 정리를 해보려고 한다. 1. Rest Parameter (나머지 인자들) Rest Parameter는 나머지 인자들, 혹은 여분의 인자들이라는 뜻이다. 함수를 정의할 때 마지막 인자 앞에 ...을 붙이면 해당 인자 다음에 오는 모든 나머지 인자들을 배열로 만든다. func..

자바스크립트의 이벤트 루프(Event Loop)에 대해서 공부를 해보려다가 정말 좋은 영상을 발견했다. JSconf EU에서 Philip Roberts라는 사람이 이벤트 루프에 대해서 발표한 스피치 영상인데, 오늘은 이 동영상 내용을 정리해보려고 한다. 자바스크립트는 기본적으로 싱글 스레드 프로그래밍 언어(Single threaded programming language)이다. 여기서 싱글 스레드라는 것은 한 번에 하나의 작업만 할 수 있다는 뜻이다. one thread == one call stack == one thing at a time 여기서 호출 스택(call stack)이라는 것은 지난번에 재귀함수에 대해서 정리하면서 언급했었다. call stack은 프로그램 상에서 우리가 어떤 순서로 작업을..

오늘은 DOM에서 이벤트를 처리하는 방법에 대해서 포스팅해보려고 한다. 1. HTML 태그 안에서 이벤트 처리기 연결 (Inline Event Handlers) 이 방법은 이벤트를 발생시킬 HTML 태그 안에 직접 이벤트 핸들러를 추가하는 방법이다. 이 방법을 사용하면 HTML 태그와 자바스크립트 소스가 섞이기 때문에 중간에 이벤트 수정하거나 연결 함수를 바꾸려면 HTML 코드를 수정해야 한다. function logMessage (msg) { alert(msg || 'logging'); } 1번 2번 3번 4번 5번 태그에 직접 연결해야하기 때문에 이벤트 함수가 전역 공간에 미리 선언되어 있어야 한다. 이 방법은 요즘엔 거의 사용하지 않는 방법이고, HTML 코드와 JS 코드가 뒤섞이기 때문에 사용을 ..

오늘은 자바스크립트로 DOM을 동적 생성하는 방법에 대해서 정리해보려고 한다. 정리를 위해서 간단한(...간단하지만 나름 깔끔하게 만들려고 오랜 시간 고군분투했다.히히) 영화 정보를 출력하는 웹 페이지를 만들어보기로 했다. 영화 정보를 가져오기 위해서 인터넷을 뒤져서 146개의 영화 정보를 담고 있는 JSON 파일을 다운 받았다. JSON 파일을 연결하는 방법은 아직 모르니까 일단은 js 파일에 MOVIES라는 이름의 객체로 만들어 html파일에 연결시켜주었다. const MOVIES = [{ "id": 1, "title": "Beetlejuice", "year": "1988", "runtime": "92", "genres": [ "Comedy", "Fantasy" ], "director": "Tim B..