1. 완성본 [동영상] 완성본 2. HTML HTML 구조는 크게 어려운 것이 없다. The Nav Home About Work Projects 3. CSS 내가 어렵다고 생각한 것은 주석을 달아놨다. 엄청나게 어려운 것은 없다. * { margin: 0px; padding: 0px; box-sizing: border-box; } nav { display: flex; justify-content: space-around; align-items: center; /* 요소의 최소 너비 지정, height 속성 무시 vh단위는 브라우저 안쪽 높이(window.innerHeight)을 기준으로 설정된다. 하지만 태블릿이나, 모바일의 경우에는 뷰 포트에 따라 맞춰짐*/ min-height: 8vh; backgro..

문제 설명 카카오에 신입 개발자로 입사한 콘은 선배 개발자로부터 개발역량 강화를 위해 다른 개발자가 작성한 소스 코드를 분석하여 문제점을 발견하고 수정하라는 업무 과제를 받았습니다. 소스를 컴파일하여 로그를 보니 대부분 소스 코드 내 작성된 괄호가 개수는 맞지만 짝이 맞지 않은 형태로 작성되어 오류가 나는 것을 알게 되었습니다. 수정해야 할 소스 파일이 너무 많아서 고민하던 콘은 소스 코드에 작성된 모든 괄호를 뽑아서 올바른 순서대로 배치된 괄호 문자열을 알려주는 프로그램을 다음과 같이 개발하려고 합니다. 용어 설명 '(' 와 ')' 로만 이루어진 문자열이 있을 경우, '(' 의 개수와 ')' 의 개수가 같다면 이를 균형잡힌 괄호 문자열이라고 부릅니다. 그리고 여기에 '('와 ')'의 괄호의 짝도 모두 ..

힙 정렬(Heap Sort)은 힙 생성 알고리즘를 이용하여 정렬하는 방법이다. 힙 생성 알고리즘은 특정한 노드의 자식 중에서 더 큰 자식과 자신의 위치를 바꾸는 알고리즘이다. 또한 위치를 바꾼 후에도 자식이 존재하는 경우, 비교 연산을 수행하여 더 큰 자식과 자신의 위치를 바꾸어야한다. 따라서 최대 힙의 경우, 루트 노드의 원소는 가장 큰 수가 된다. 힙 생성 알고리즘에 대해서는 이전에 포스팅한 적이 있다. 그래서 이번 포스팅에서는 따로 설명하지는 않겠다. 그런데 힙 생성 알고리즘의 시간 복잡도는 몇 일까? 정답은 $$ O(nlog_{2}N) $$ 이다. 왜냐하면 한 번 자식노드가 증가할 때마다 노드의 개수가 2배씩 증가하기 때문이다. 예를 들어 데이터가 1024개라면 대략 10번 정도만 내려가면 된다...

1. 완성본 완성본 영상은 다음과 같다. 간단하게 사칙연산(더하기, 빼기, 곱하기, 나누기)만을 구현했다. [영상] 완성본 영상 2. HTML 구조 0 3. CSS * { box-sizing: border-box; } html, body { height: 100%; padding: 0; margin: 0; } .calc-wrapper { width: 250px; height: 300px; position: relative; margin: 0 auto; margin-top: 50px; background-color: #f9f9f9; border: 1px solid #dfe1e5; border-radius: 20px; padding: 10px; display: flex; flex-direction: colu..

1. 힙 (Heap) 힙은 완전 이진 트리에 있는 노드 중에서 키 값이 가장 큰 노드나 키 값이 가장 작은 노드를 찾기 위해서 만든 자료구조다. 키 값이 가장 큰 노드를 찾기 위한 힙을 최대 힙이라고 하고, 키 값이 작은 노드를 찾기 위한 힙을 최소 힙이라고 한다. 최대 힙은 부모노드의 키 값 > 자식노드의 키 값의 관계를 가지는 완전 이진 트리다. 따라서 최대 힙의 루트 노드는 가장 큰 값이 된다. 하지만 최소 힙은 부모노드의 키 값 ..

자바스크립트에는 총 8가지의 자료형이 있지만 대표적으로는 문자, 숫자, 불린 타입의 자료형이 있다. 그런데 코딩을하다보면 문자열 "123"을 숫자 123으로 변환해서 쓸 때가 있는데, 이렇게 자료의 형을 변환시켜서 사용하는 과정을 우리는 자료의 형 변환이라고 한다. 또한 명시적으로 변환을 안해줘도 alert함수와 같이 자동으로 형 변환을 해주는 경우도 존재한다. 주로 쓰이는 형 변환은 문자형으로의 변환, 숫자형으로의 변환, 불린형으로의 변환 세 가지가 있다. 이번 포스팅에서는 이 세 가지 변환을 다루려고 한다. 1. 문자형으로의 변환 문자형으로의 형 변환은 문자형의 값이 필요할 때 일어난다. alert 함수는 매개변수로 문자형을 받기 때문에 alert(value)의 경우 value는 문자형이어야만 한다...