까먹은 지식 437

[JavaScript] ES6 모듈 - 단 두 가지 요소 import, export

웹팩이 (조금이라도) 이해됬다면 이제는 모듈 문법(syntax)를 알아볼 차례 단 두 가지 구성요소가 있다. import export 쉽게 사용할 수 있다. export // functionOne.js 파일 const functionOne = () => console.log('FUNCTION ONE!') export { functionOne } import import { functionOne } from './functionOne' functionOne() //this should work as expected! 모듈로 코드를 작성하는 많은 장점이 있는데, 그 중 가장 좋은것은 '코드 재사용' 다른 이점은 factory function 또는 module pattern으로 코드를 감쌀 수 있다는 것 참고..

[JavaScript] 웹팩 - HTML, CSS, JavaScript를 묶어주다

웹팩(Webpack)은? 간단히 말해 모듈(HTML, CSS, JavaScript, sass, png 등 각각 모듈)을 묶어주는거다. 인터넷은 어렵고, 복잡하지만, 우리는 조금 있으면 되고, 원하는 설정도 간단하다. 이런것 도와주는거다 엄청 강력한 도구다, 꽤 복잡한 config file에서 강한 파워가 나온다. 코드가 많아지면 유용하다고 한다. 시작해보자 설치하면 CLI 및 API를 통해 웹팩과 상호작용 가능 다른 bundlers와 비교 경고: webpack5를 돌리기 위한 Node.js 최소 버전 10.13.0(LTS) 기본 설정 디렉토리를 만들고 npm 실행하고 웹팩을 로컬에 설치 webpack-cli도 설치(커맨드라인에서 웹팩 사용하기 위한 도구) 디렉토리는 이렇게 구성될거다 project web..

[JavaScript] npm - 플러그인, 라이브러리, 도구의 저장소

npm(node package manager) 방대한 플러그인, 라이브러리, 도구의 플러그인 저장소에 액세스 할 수 있게 도와주는 커맨드 라인 도구 여기서 수많은 개발자들이 공유한다. 공개하는 패키지에는 꼭 package.json 파일이 있어야된다. package.json 파일은 프로젝트가 의존하는 파일을 나열한다 빌드를 복제할 수 있게 해줘서 다른 개발자와 쉽게 공유할 수 있게 한다. package.json 필드 name과 version 필드 필수 name 필드에는 패키지 이름이 들어가고, 하이픈(-), 언더스코어(_), 소문자 사용가능 version 필드는 x.x.x 형태를 따라야 된다. { "name": "my-awesome-package", "version": "1.0.0" } Author 필드 ..

[알고리즘] 큐 - 먼저하면 먼저, 늦게하면 늦게

큐(Queue) 먼저 집어 넣은 데이터가 먼저 나온다 First In, First Out: FIFO 구조로 저장하는 자료구조 전단(Front), 후단(Rear)이 있다. 삽입(Enqueue) 뒤에 집어 넣는거다, 그럼 후단이 새로 들어온애로 바뀌겠지 삭제(Dequeue) 제일 먼저 들어온 녀석을 삭제하고, 그 다음 녀석이 전단이 된다. 배열로 큐를 구현할 때 문제점 앞의 것을 제거하면 나머지를 앞으로 땡겨와야한다. 그래서 배열에 큐 잘 안쓴다 순환 큐 배열의 끝과 시작이 이어진 것처럼 전단과 후단 관리 문제점 전단과 후단이 같은 위치면 비었나, 가득찼나? 해결 방법 큐 배열 생성할 때 실제 용량보다 1만큼 크게 만들어 전단과 후단 사이를 비운다 전단과 후단이 같으면 빈 상태 후단이 전단보다 1 작으면 가..

[알고리즘] 스택 - 먼저하면 늦게, 늦게하면 먼저

스택(Stack) 먼저 들어간 요소가 가장 나중에 나온다 Last-In, First Out: LIFO 자료구조 비행기 캐리어처럼 먼저 실으면 늦게 나오고, 늦게 실으면 먼저 나온다. 스택의 삽입 연산: push 스택의 삭제 연산: pop 스택 응용 예시 예시1) 역순 문자열 만들기 [A] [B] [C] [D] 들어올 때 [D] [C] [B] [A]가 나오도록 배열에 push 사용하듯 push(stack, A) push(stack, B) push(stack, C) push(stack, D) 꺼낼 때는 pop 이용 pop(stack) 하면 D pop(stack) 하면 C pop(stack) 하면 B pop(stack) 하면 A 이 나온다. 예시2) 시스템 스택 함수 호출과 복귀를 보면 시스템 스택이다. 예를..

[알고리즘] 리스트 - 선형, 단일 연결, 이중 연결, 원형 연결

리스트 동일한 값이 두 번 이상 나타날 수 있는 셀 수 있는 정렬된 값을 나타내는 자료의 구조 시퀀스(Sequence)라고도 함 종류 선형 단일 연결 이중 연결 원형 연결 선형: 순서를 가지고 있다 순차 방식으로 구현 원소를 논리적인 순서대로 연속하여 저장 원소 삽입 삽입할 빈 자리 만들기 빈 자리 이후의 원소를 한자리씩 뒤로 이동 빈 자리에 원소 삽입 원소 삭제 삭제한 자리 이후의 원소들을 한 자리씩 앞으로 이동 단점 삽입, 삭제가 비효율적 그래서 개선한 방법이 단일 연결 리스트 단일 연결: 저장할 때 그 다음 순서의 자료가 있는 위치를 데이터에 포함 각 노드는 다음 노드를 가리키는 포인터(주소 값)를 가짐 맨 앞부분은 머리(Head), 끝 부분은 꼬리(Tail) 노드 추가 앞 노드가 새 노드를 가르키..

[알고리즘] 선택 알고리즘 - 퀵 정렬과 함께하다

선택 알고리즘 n개의 원소가 불규칙하게 저장된 배열에서 i번재 큰(or 작은)원소를 찾는 알고리즘 정렬과 비슷하다 두 가지 알고리즘 평균적으로 선형시간이 소용되는 알고리즘 최악의 경우에 선형시간이 소요되는 알고리즘 평균적으로 선형시간이 소용되는 알고리즘 배열 A에서 i 번째 원소 찾기 원소가 하나뿐인 경우, 하나 리턴 원소가 다수의 경우, 파티션(퀵 정렬)을 통해 중간값이 몇 번째인지 확인 중간값이 i와 같을 경우, A[파티션 통해 얻은 중간]값 리턴 중간값이 i보다 클 경우, 오른쪽 그룹으로 범위를 좁혀 재귀 중간값이 i작을 경우, 왼쪽 그룹으로 범위를 좁혀 재귀 예시 1 2번째 작은 원소 찾기 [31] [8] [48] [73] [11] [3] [20] [29] [65] [15] 마지막수 15를 기준으..

[알고리즘] 기수 정렬 - 같은 자릿수 끼리끼리 비교

기수정렬(Radix Sort) k이하의 자릿수를 가진 자연수인 경우 각 자릿수별로 정렬 숫자를 부분적으로 비교 기수의 기란? 기수에서 기는 기(Radix), 특정 진수를 나타낸다 10진수의 기: 0 ~ 9 2진수의 기: 0, 1 예시 가장 낮은 자릿수(1의 자리)를 비교 그 다음 낮은 수(10의 자리) 비교 그 다은 자릿수(100의 자리) 비교 하면서 작은수부터 적어주면 된다. 어디서 쓰면 좋을까? 많은 숫자로 되어있는 상용 데이터 베이스에서 유용 주민등록번호, 계좌번호, 전화번호, 인터넷 주소 등 파이썬으로 구현하면 이렇다(그저 따라해서 이해 못했지만) def radix_sort(A): RADIX = 10 maxLengh = False tmp, placement = -1, 1 while not maxL..

[알고리즘] 계수 정렬 - 신기하게 잘 찾아들어간다!

계수정렬(Counting Sort) 각 항목이 몇개씩 있는지 세는 작업을 하면서 선형시간에 정렬 한계 정수나 정수로 표현할 수 있는것만 정렬가능 방법 최대값까지 배열 생성 입력원소의 발생 횟수를 세어 저장 예시 입력 배열: [0] [5] [4] [4] [1] [3] [2] [5] [1] [4] [6] 입력 원소의 최대값까지 카운트(Count) 배열 생성 위의 예에서는 0~6까지 정수, 7개를 가진 카운트 배열이 생성된다. 1. 카운트 배열 7개 각 원소의 발생 횟수를 세어 저장 0 원소의 개수 한번, 1이 두번, 2가 한번 등 6까지 그럼 카운트 배열은 이렇다 [1] [2] [1] [1] [3] [2] [1] 2. 카운트 배열의 값을 누적하여 저장 다시 카운트 배열의 값을 누적해서 만들어준다 [1] [2..

[알고리즘] 트리 정렬 - 다시 정리 필요

트리 정렬(Tree Sort) 이진탐색트리를 이용해 정렬한다 이진트리? 트리의 모든 노드의 차수가 2이하 탐색 요건 모든 노드의 키는 서로 다른 유일한 키 왼쪽 서브트리에 있는 노드들의 키는 루트 노드의 키보다 작다 오른쪽 서브트리에 있는 노드들의 키는 루트 노드의 키보다 크다 왼쪽 서브트리와 오른쪽 서브트리도 이진 탐색트리

728x90