패캠 네카라쿠배 도전: HTML CSS 23

[패캠 네카라쿠배 2기] 2차 테스트 - 10일차 데이터구조8: 힙

대표적인 데이터 구조8: 힙 1. 힙 (Heap) 이란? 힙: 데이터에서 최대값과 최소값을 빠르게 찾기 위해 고안된 완전 이진 트리(Complete Binary Tree) 완전 이진 트리: 노드를 삽입할 때 최하단 왼쪽 노드부터 차례대로 삽입하는 트리 힙을 사용하는 이유 배열에 데이터를 넣고, 최대값과 최소값을 찾으려면 O(n) 이 걸림 이에 반해, 힙에 데이터를 넣고, 최대값과 최소값을 찾으면, O(logn) 이 걸림 우선순위 큐(우선순위를 같이 지정해줘서 우선순위가 높은 애부터 추출)와 같이 최대값 또는 최소값을 빠르게 찾아야 하는 자료구조 및 알고리즘 구현 등에 활용됨 2. 힙 (Heap) 구조 힙은 최대값을 구하기 위한 구조 (최대 힙, Max Heap) 와, 최소값을 구하기 위한 구조 (최소 힙..

[패캠 네카라쿠배 2기] 2차 테스트 - 9일차 데이터 구조7 : 트리

대표적인 데이터 구조7: 트리 1. 트리 (Tree) 구조 트리: Node와 Branch를 이용해서, 사이클을 이루지 않도록 구성한 데이터 구조 실제로 어디에 많이 사용되나? 트리 중 이진 트리 (Binary Tree) 형태의 구조로, 탐색(검색) 알고리즘 구현을 위해 많이 사용됨 이진 탐색 트리 O(log2N) 배열 O(n)보다 짧게 걸린다 2. 알아둘 용어 Node: 트리에서 데이터를 저장하는 기본 요소 (데이터와 다른 연결된 노드에 대한 Branch 정보 포함) Root Node: 트리 맨 위에 있는 노드 Level: 최상위 노드를 Level 0으로 하였을 때, 하위 Branch로 연결된 노드의 깊이를 나타냄 Parent Node: 어떤 노드의 다음 레벨에 연결된 노드 (해당 노드의 상단에 있는) ..

[패캠 네카라쿠배 2기] 2차 테스트 - 8일차 데이터 구조6: 해쉬 테이블

대표적인 데이터 구조6: 해쉬 테이블 (Hash Table) 1. 해쉬 구조 cf. Hash : 이를 확장한 알고리즘들이 많은 ex. 블록체인 Hash Table: 키(Key)에 데이터(Value)를 저장하는 데이터 구조 배열에서는 원소를 검색할 때 하나하나 찾는다면 hash table은 바로 Trump를 구할 수 있다 Key를 통해 바로 데이터를 받아올 수 있으므로, 속도가 획기적으로 빨라짐 파이썬 딕셔너리(Dictionary) 타입이 해쉬 테이블의 예: Key를 가지고 바로 데이터(Value)를 꺼냄 보통 배열로 미리 Hash Table 사이즈만큼 생성 후에 사용 (공간과 탐색 시간을 맞바꾸는 기법) // 해쉬테이블을 내부적으로 구현할 때는 배열로 만들 수 있다// 공간을 늘려서 충돌이 일어나지 않도..

[패캠 네카라쿠배 2기] 2차 테스트 - 8일차 알고리즘 복잡도 표현 방법

알고리즘 복잡도 표현 방법 1. 알고리즘 복잡도 계산이 필요한 이유 하나의 문제를 푸는 알고리즘은 다양할 수 있음 자료구조 중에 복잡도를 검토할 부분이 있어서 자료구조를 공부하는 지금 다룬다 정수의 절대값 구하기 1, -1 ->> 1 방법1: 정수값을 제곱한 값에 다시 루트를 씌우기 방법2: 정수가 음수인지 확인해서, 음수일 때만, -1을 곱하기 다양한 알고리즘 중 어느 알고리즘이 더 좋은지를 분석하기 위해, 복잡도를 정의하고 계산함 2. 알고리즘 복잡도 계산 항목 시간 복잡도: 알고리즘 실행 속도 // 요즘은 시간 복잡도를 많이 물어본다 공간 복잡도: 알고리즘이 사용하는 메모리 사이즈 가장 중요한 시간 복잡도를 꼭 이해하고 계산할 수 있어야 함 알고리즘 시간 복잡도의 주요 요소 반복문이 지배합니다. 생..

2차 테스트 - 7일차 객체 지향 프로그래밍

1. 객체 지향 프로그래밍(OOP) 절차 지향 프로그래밍 : 1990년대 이전 언어는 대부분 절차지향 프로그래밍 ex. C언어 ex. 냉장고에 코끼리를 넣는다 1. open 냉장고 2. insert 코끼리 into 냉장고 3. close 냉장고 객체 지향 프로그래밍 : 객체 단위로 데이터와 기능(함수)를 하나로 묶어서 쓰는 언어 자동차 1)승용 자동차 (1)개인 자동차 : 나의 자동차, 너의 자동차 [인스턴스] (2)택시 (3)버스 2)산업용 자동차 => 1)과 (1),(2),(3), 그 안의 항목들은 각각 상속 관계를 가진다 객체 지향 프로그래밍 핵심 : class와 object 1)class란? 속성(attribute)와 동작(method)을 갖는 데이터 타입 속성은 변수와 유사 동작은 함수와 유사 ..

[패캠 네카라쿠배 2기] 2차 테스트 - 7일차

대표적인 데이터 구조: 링크드 리스트 (Linked List) 1. 링크드 리스트 (Linked List) 구조 연결 리스트라고도 많이 함 구조는 단순한데 구현하기 복잡하고 헷갈리는 부분이 많다 프로그래밍 퀴즈를 낼 때(가벼운 면접) 등에서 링크드 리스트 문제를 내는 경우 많다 배열은 순차적으로 연결된 공간을 예약을 해놓고(확보를 해놓고) 거기에 데이터를 하나씩 넣어서 나열하는 데이터 구조// 그러므로 새로운 정보를 추가할 수 없음. 이런 단점을 해결하기 위해 나온 것이 링크드 리스트다 링크드 리스트는 예약을 해놓지 않고 필요할 때마다 추가// 공간을 만들고 그 안에 데이터와 다음 데이터 주소를 적는다 / 다음 데이터는 어느 공간이든 간에 새로운 노드를 만들고 이 노드의 주소를 앞에 있는 노드의 포인터에..

[패캠 네카라쿠배 2기 도전] CSS/속성 - 글꼴, 문자

1. font, font-style 글자 관련 속성들을 지정[단축] 값 의미 기본값 font-style 글자 기울기 normal font-weight 글자 두께 normal font-size 글자 크기 medium (16px) line-height 줄 높이(줄 간격) 지정 normal (reset.css 적용시 1) font-family 글꼴(서체) 지정 운영체제(브라우저)에 따라 달라짐 font: 기울기 두께 크기 / 줄높이 글꼴; [최소한 크기, 글꼴은 지정해야 나온다] .box{ font: italic bold 20px / 1.5 "Arial", sans-serif; } font-style 글자 스타일(기울기)를 지정[개별] 속성 값 값 의미 기본값 normal 스타일 없음 normal italic..

[패캠 네카라쿠배 2기 도전] CSS/속성 - 박스 모델

CSS의 속성들 1. width, height (1)width: 요소의 가로 너비 지정 기본값 : auto 의미: 브라우저가 너비를 계산 단위: px, em, cm, %, vw (2)height: 요소의 세로 너비 지정 기본값 : auto 의미: 브라우저가 높이를 계산 단위: px, em, cm, %, vw //인라인 요소는 width, height가 0으로 시작. 가로, 세로 값을 가질 수 없다. 대신 text를 작성한 만큼만 나온다 블록 요소는 width가 auto(100%), height를 설정해줘야 뜬다 div{ width: auto; /100%/ height: auto; /0/ } span{ width: auto; /0/ height: auto; /0/ } 2. max-width, min-wid..

[패캠 네카라쿠배 2기 도전] CSS/ 단위

1. px, % body *{ border: 2px solid;} .container{ width: 600px; } .parent{ width:300px; // 50%(부모 요소인 container의) } .child{ width: 150px; // 50%(부모 요소인 parent의) } %는 부모 요소의 영향을 받는다 부모(바로 상위인 요소. 즉 그 이상의 요소의 영향을 받는 건 아니다) 2. em, rem em은 자신의 font 크기의 영향을 받는다 %와 달리 상속하는 요소의 영향을 모두 똑같이 받는다 .container{ width: 600px; // 60em (font 크기에 상대적) font-size: 10px; // 이 크기를 바꾸면 아래 em으로 정의한 사이즈도 함께 바뀐다 } .parent..

[패캠 네카라쿠배 2기 도전]CSS/ 개요, 선택자, 상속

1) 기본문법 (1)css는 화면에 꾸미는 도구 선택자{ 속성: 속성값; 속성: 속성값; } => 이렇게 쓰는 것이 가독성이 더 좋다 (2) 선택자의 역할 : 속성과 값을 지정할 대상을 검색 첫번째 요소는 div 두번째 요소는 span css div{ color: red; } 속성과 값의 역할 : 검색된 대상에 지정될 css 명령 /* 주석 */ 문서내 수정사항이나 설명 등을 작성(주석) 2) 선언 방식 (1)인라인 방식 : html 요소(태그)의 style 속성에 직접 작성하는 방식 [html 안 속성] Hello - 이 방식은 선택자가 필요하지 않다. (2)내장 방식 : html 안에 작성하는 방법 [html 안 태그] Hello (4)@import 방식 css @import를 이용하여 외부 문서로 ..