일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- 계명대 이종호
- jest
- 힛잇
- 개발자
- hokeys
- react
- 자바스크립트
- 호키도키
- 스위프트
- Svelte
- 자바스크립트 자료구조
- data structure
- 리액트
- 비동기
- 스벨트
- javascript
- HTML
- hokidoki
- Hitit
- SWIFT
- 이종호
- 호키스
- 계명대
- IOS
- 자스민
- queue
- 자료구조
- TDD
- 리액트 예제
- 개발
- Today
- Total
목록javascript (24)
Dog foot print
React Day Scheduler 소개 react-day-scheduler는 제 첫번째 배포 리액트 모듈이며 화면상의 컴포넌트 영역에 드래그 하는 것으로 새로운 이벤트를 생성, 프롭스로 전달한 배열의 스케쥴을 자동으로 높이,위치, 크기를 지정하는 리액트 프론트 전용 모듈입니다. 설치 npm : npm install react-day-scheuduler yarn : yarn add react-day-scheduler 사용 방법 import DaySchedulerContainer from 'react-day-scheduler/dist' Props 설정 schedules : 이 프롭스는 화면상에 배치될 이벤트의 모음입니다. 전달하는 형태는 배열이며, 배열 속 이벤트를 표현하는 객체는 4가지의 기본 프로퍼티를..
서론 요즘 계속 자스민과 취업을 위한 포트폴리오를 위해 신경쓰다보니, 블로그를 너무 방치 한 것 같아 아쉽다. 이론이나 문법적인 내용을 다루기에는 현재 방학중이라 조금 어렵고 자스민 사람들이 사용할만한 작은 예제들을 만들어 업로드 할 예정이다. html 형태 이미지 불러오기 input type종류에는 여러가지가 있지만 그 중 file이라는 녀석은 클릭시 사용자가 어떤 파일을 선택할 수 있는 작은 창을 제공한다. 이를 통해 사용자가 파일을 브라우저로 업로드 할 수 있도록 할 수 있다. 이벤트 연결하기 인풋 파일을 다룰때 고려해야 이벤트 종류는 onChange이다. 클릭이 아닌 이유는 파일을 선택하지 않았을 경우도 있기 때문에 클릭 이벤트가 아닌 값이 변경될 때 발생하는 change이벤트를 사용한다. 여기 ..
( 너무나도 꼰대적인 교수 한명 때문에 이번 학기는 정말이지 너무나도 스트레스 받는다. ) 파라메터로 넘겨주는 값에 따라 pivot의 위치가 변하는 퀵소트 function swap(list, from, to) { const dummy = list[to]; list[to] = list[from]; list[from] = dummy; } function findMedian(list, left, mid, right) { let median = right; if (list[left] > list[mid] && list[mid] list[right] && list[right] < list[left]) { median ..
heap 이란 ? heap 은 우선순위 큐를 위해서 만들어진 트리자료구조이다. heap은 부모노드와 자식노드의 대소관계에 따라 최대힙(Max heap)과 최소힙(Min heap)으로 나뉜다. heap의 특징 heap은 완전이진트리의 형태이다. 완전이진트리 설명보러가기 heap은 트리내에서 중복된 값을 허용한다. heap은 느슨한 정렬(반 정렬) 상태를 가진다. 반 정렬 이라는 의미는 자식노드가 부모의 노드보다 무조건 크거나 작다. 그러나 전체트리를 볼 때는 가장 아래에 있는 노드가 가장 작거나 큰 값은 아니라는 의미이다. Max heap 최대 힙 최대힙은 다음과 조건을 항상 만족한다. 자식노드 value >= 부모노드 value Min heap 최소 힙 최소힙은 다음과 같 은 조건을 항상 만족한다. 자식..
지난번 해시테이블 포스팅도 그렇고 이번 트리도 그렇고 꽤나 양이 방대해서 그런지 시리즈로 포스팅을 하고 있다. 나도 몰랐고 처음 해보는 자료구조들이라서 그런지 예제도 이해하는데 오래 걸리고 이를 토대로 다시 정리하는 것도 생각보다 오래 걸린다. ㅜ.ㅜ 으쌰 으쌰해야겠다. tree의 표현 방법 트리를 만드는 방법은 배열 혹은 연결리스트로 만드는 방법이 있다. 배열로 표현하는 방법은 다음과 같다. 임의의 노드 A의 부모노드 인덱스 . : 해당 노드의 인덱스 i / 2; 임의의 노드 A의 왼쪽 자식노드 인덱스. : 해당 노드의 인덱스 i * 2; 임의의 노드 A의 오른쪽 자식노드 인덱스. : 해당 노드의 인덱스 ( i * 2 ) +1 배열로 트리를 만들게 되면 배열의 0번째 방은 사용하지 않는다. 그리고 배열..
어제 선형탐사 방식을 통하여 해시값 충돌시 해시값을 유효범위까지 늘려 충돌을 우회했다. 그러나 open adress방식을 사용하면 유효범위가 유한하기 때문에 언젠가 충돌이 일어날 수 있었다. 그렇기에 이번에는 chaining 방식을 통해 조금 더 유연한 hash table을 만들어 보겠다. Seperate Chaining Seperate chaining 은 배열에 연결리스트를 넣어서 유한하던 저장공간문제를 해결하는 방식이다. 다만 메모리문제와 탐색시 최악의 시간 복잡도가 O(n)이 된다는 단점도 가지고 있다. Double Linked List function Dictionary(key,value){ return { llink : null, key : key, value : value, rlink : nu..
자바스크립트 이외에 언어에서 연결리스트가 가지는 이점은 배열처럼 고정된 크기를 가지는게 아니라 동적으로 크기를 조정 할 수 있는 것이 장점이다. 그렇다면 단순연결리스트와 원형연결리스트 보다 이중연결리스트가 가지는 이점은 무엇일까 ? 이중연결리스트란 ? 기존에 만들었던 연결리스트들은 모두 한 방향으로 이루어져 있다. 그런데 이중연결리스트는 L link 와 R link를 가지고 있어 해당 노드에서 전, 후 노드에 접근 하는 것이 가능케 된다. 이로인해서 헤드가 마지막에 연결되어있는 노드를 O(1) 의 복잡도를 가지고 찾을 수 있다. 멤버변수 class nodeType{ constructor(item){ this.data = item; this.lLink = null; this.rLink = null; } 이..
정규표현식이란 문자열에서 특정한 패턴의 규칙을 가진 문자열의 집합을 표현 하는데 사용하는 형식 언어이다. - 위키 정의가 조금 와닿지 않을 수 도 있을 것 같다. 예를 들면 우리가 커뮤니티나 게임에서 "시발", "개새끼" , "섹스" 등 금지어를 글에 적을 때 해당 금지어 때문에 작성이 되지 않는 다던가 해당 금지어가 다른 문자열로 치환 되는 것을 본 경험이 있을 것이다. 이런 전체 문자열에서 특정한 문자열의 검색과 치환을 위해 사용되는 것이 정규표현식이다. 정규표현식 생성방법 정규표현식을 만드는 방법은 조금 난이도가 있어 보인다. 검색기능이 강력한 사이트를 관리하는 입장이라면 정규표현식은 필수로 잘 다뤄야 겠지만 일반인이라면 사용할때만 집중해서 만드는 것도 좋을 듯하다. 아래에 정말 잘 정리해놓은 블로..