본문 바로가기

Programming310

[Javascript] 해시테이블 이번에 소개드릴 자료구조는 해시테이블입니다. 그동안 배운 자료구조들에서 탐색이 유용하게 쓰였었는데, 이 해시테이블은 탐색을 잘 할 수 있는 자료구조입니다. 1. 테이블과 해시함수 그리고 해시테이블 우선 테이블(Table)은 key와 value가 한 쌍을 갖고 표에 저장된 자료구조입니다. 단순히 표에 저장했다고 해서 테이블 자료구조가 아니라, key와 value가 쌍을 이루고 저장되어야합니다. 근데 key와 value라고하니 자바스크립트에서 떠오르는 한 가지 구조가 있습니다. 바로 key와 value 쌍을 이룬 연관(혹은 연상) 배열 map이었습니다. 그리고 우리는 이 연관 배열을 해시라고도 한다고 했었습니다. 혹은 집합과 유사한 Set도 해시테이블의 일종이라고 할 수 있습니다. 2021.03.15 - [.. 2021. 11. 22.
[Javascript] 그래프 이번에 구현할 자료구조는 그래프입니다. 그래프는 트리와 비슷하면서도 다른 성질의 자료구조 입니다. 2021.10.04 - [Programming/자료구조] - 그래프 Graph 그래프 Graph 리스트와 스택, 큐는 1:1 구조의 자료구조, 트리는 1:다의 자료구조였습니다. 그렇다면 다:다 관계를 가진 자료구조도 존재할 것 같다는 생각이 듭니다. 그래프는 이처럼 다:다의 관계를 가진 자 bamtory29.tistory.com 2021.10.05 - [Programming/자료구조] - 그래프 구현2 - 인접 리스트로 그래프 구현하기 그래프 구현2 - 인접 리스트로 그래프 구현하기 지난번엔 순차 자료구조인 2차원 배열을 이용한 인접 행렬 기반 그래프를 구현했습니다. 이번에는 연결 자료구조를 이용해서 그래프.. 2021. 11. 22.
[React] 컴포넌트에 CSS 적용하기 사용자와 상호작용 하는 로직과 인터페이스도 중요하지만 역시 외관이 눈에 띄고 쉬워야 이용하기 좋은 인터페이스라고 할 수 있습니다. 1. CSS 적용하기 우선 우리가 create-react-app을 통해 만든 리액트 프로젝트에는 App.css라는 css파일이 존재합니다. 이 파일을 열어보면 다음과 같이 구성되어있습니다. .App { text-align: center; } .App-logo { height: 40vmin; pointer-events: none; } @media (prefers-reduced-motion: no-preference) { .App-logo { animation: App-logo-spin infinite 20s linear; } } .App-header { background-co.. 2021. 11. 18.
[Javascript] 이진 탐색 트리 가장 활용도가 높은 이진 탐색트리를 자바스크립트로 구현해보겠습니다. 2021.09.30 - [Programming/자료구조] - 이진 탐색 트리 이진 탐색 트리 처음에 트리를 소개하며 조직도이야기를 했듯이, 트리라는 자료구조는 어떤 자료를 찾는데 이점을 갖는 구조입니다. 하지만 트리의 높이가 높아지면 탐색하는데 오래걸리거나, 위치를 안다고 bamtory29.tistory.com 중복 코드와 로직부분은 private 멤버 함수로 선언했습니다. 코드가 좀 많이 길지만 내용은 간단합니다. 재귀를 통해 삽입, 삭제, 검색에서 연산을 진행하도록 설계했습니다. class Tree { constructor() { this.root;//루트 노드 this.size = 0;//트리 크기 } _insertNode(root.. 2021. 11. 18.
[Javascript] 큐 이번에 볼 자료구조는 스택과 비슷한 큐 입니다. 2021.09.16 - [Programming/자료구조] - 큐 Queue 큐 Queue 이번에는 스택과 비슷한 자료구조인 큐를 알아보겠습니다. 1. 큐 큐는 스택처럼 특정한 위치에서 넣고 뺄 수 있는 자료구조입니다. 스택은 입구와 출구가 같아서 나중에 들어간 자료가 먼저 나 bamtory29.tistory.com class Queue { constructor() { this.front = null; this.rear = null; this.size = 0; } enQueue(data) { const newNode = new Node(data); if(!this.front) { this.front = newNode; } else { this.rear.nex.. 2021. 11. 18.
백준에서 Javascript 이용하기 프로그래밍 입문을 자바로 했기 때문에 웹 개발, 특히 프론트엔드를 준비하면서도 그동안 자바로 코딩테스트 문제를 풀곤 했었습니다. 그러다 문득 든 생각이 JS가 메인인 프론트엔드, 백엔드에서도 Node.js가 자리를 잡아가면 js를 잘 아는 것이 중요한데 자바로 준비하는게 과연 맞는 것인가?라는 생각이 들었습니다. 그래서 자바스크립트로 다시 코딩테스트 준비를 하게 되었습니다. 하지만 백준 사이트에서 언어 선택에 자바스크립트가 없는 것을 발견했습니다. Node.js와 Typescript가 있긴 하지만 타입스크립트는 아직 손도 안대봤고, 노드는 살짝 찍먹만 해본 수준이라 구글링을 해보니 파일시스템을 통해 노드로 자바스크립트를 이용해야한다고 합니다. 1. fs모듈 이용 첫 번째 방식은 파일 시스템 모듈인 fs모.. 2021. 11. 17.
300x250