1.3.0 β€’ Published 5 years ago

data-structure-visualization v1.3.0

Weekly downloads
6
License
MIT
Repository
github
Last release
5 years ago

🐷 data_structure_JS

NAVER D2 CAMPUS FEST κ²°μŠΉμ§„μΆœνŒ€!

document-page

github-page

INTRODUCTION

JS 에 λ„€μ΄ν‹°λΈŒν•˜κ²Œ μ‘΄μž¬ν•˜μ§€ μ•ŠλŠ” μžλ£Œκ΅¬μ‘°λ“€μ„ κ΅¬ν˜„ν•œ λΌμ΄λΈŒλŸ¬λ¦¬μž…λ‹ˆλ‹€. λ˜ν•œ 자료ꡬ쑰 μ‹œκ°ν™” μ›Ή λ·° ν”„λ‘ νŠΈμ—”λ“œκ°€ κ΅¬ν˜„λ˜μ–΄ μžˆμ–΄ ν•™μŠ΅ μš©λ„ λ“±μœΌλ‘œ ν™œμš© κ°€λŠ₯ν•©λ‹ˆλ‹€.

DEPENDENCY

  • jest

  • expect

ν…ŒμŠ€νŠΈλ₯Ό μœ„ν•΄ jest 와 expectλ₯Ό μ‚¬μš©ν•˜μ˜€μŠ΅λ‹ˆλ‹€.

  • clone

snapshot 생성을 μœ„ν•΄ object cloning (deep, circular) 라이브러리인 clone을 μ‚¬μš©ν–ˆμŠ΅λ‹ˆλ‹€.

  • babel-preset-env

jestκ°€ ES6 일뢀 문법을 μ΄ν•΄ν•˜μ§€ λͺ»ν•΄ 바벨을 μ‚¬μš©ν•˜μ˜€μŠ΅λ‹ˆλ‹€.

  • ejs

  • express

visualization μ›Ή μ„œλ²„λ₯Ό 돌리기 μœ„ν•΄ express / ejsλ₯Ό μ‚¬μš©ν•˜μ˜€μŠ΅λ‹ˆλ‹€.

  • eslint

μ½”λ“œ μŠ€νƒ€μΌμ€ eslint(airbnb)을 λ”°λ¦…λ‹ˆλ‹€.

USAGE

- Singly Linked List

import { SinglyLinkedList } from 'data-structure-visualization';

// SLL μΈμŠ€ν„΄μŠ€ 생성
const sll = new SinglyLinkedList();

sll.push(1); // [1]
sll.push(2); // [1, 2]

sll.size(); // 2

sll.pop(); // 2
sll.pop(); // 1
sll.pop(); // undefined

sll.unshift(2); // [2]
sll.unshift(1); // [1, 2]

sll.shift(); // 1
sll.shift(); // 2
sll.shift(); // undefined

// sll.insert(index, value)
sll.insert(0, 1); // [1]
sll.insert(0, 2); // [2, 1]
sll.insert(1, 4); // [2, 4, 1]

sll.insert(4, 5); // Error: index is out of range!

// sll.remove(index);
sll.remove(1); // 4
// [2, 1]
sll.remove(0); // 2
// [1]

sll.remove(4); // Error: index is out of range!

sll.push(2); // [1, 2]
sll.push(3); // [1, 2, 3]

sll.reverse();
sll; // [3, 2, 1]

- Doubly Linked List

import { DoublyLinkedList } from 'data-structure-visualization';

// DLL μΈμŠ€ν„΄μŠ€ 생성
const dll = new DoublyLinkedList();

dll.push(1); // [1]
dll.push(2); // [1, 2]

dll.size(); // 2

dll.pop(); // 2
dll.pop(); // 1
dll.pop(); // undefined

dll.unshift(2); // [2]
dll.unshift(1); // [1, 2]

dll.shift(); // 1
dll.shift(); // 2
dll.shift(); // undefined

// dll.insert(index, value)
dll.insert(0, 1); // [1]
dll.insert(0, 2); // [2, 1]
dll.insert(1, 4); // [2, 4, 1]

dll.insert(4, 5); // Error: index is out of range!

// dll.remove(index);
dll.remove(1); // 4
// [2, 1]
dll.remove(0); // 2
// [1]

dll.remove(4); // Error: index is out of range!

dll.push(2); // [1, 2]
dll.push(3); // [1, 2, 3]

dll.reverse();
dll; // [3, 2, 1]

- Stack

import { Stack } from 'data-structure-visualization';

// μŠ€νƒ μΈμŠ€ν„΄μŠ€ 생성
const stack = new Stack();

stack.push(1);
stack.push(2);

stack.size(); // 2

stack.pop(); // 2
stack.pop(); // 1
stack.pop(); // undefined

- Queue

import { Queue } from 'data-structure-visualization';

// 큐 μΈμŠ€ν„΄μŠ€ 생성
const queue = new Queue();

queue.enqueue(1);
queue.enqueue(2);

queue.size(); // 2

queue.dequeue(); // 1
queue.dequeue(); // 2
queue.dequeue(); // undefined

- Dequeue

import { Dequeue } from 'data-structure-visualization';

// 덱 μΈμŠ€ν„΄μŠ€ 생성
const dequeue = new Dequeue();

dequeue.pushHead(1); // [1]
dequeue.pushTail(2); // [1, 2]
dequeue.pushHead(3); // [3, 1, 2]

dequeue.size(); // 3

dequeue.popTail(); // 2
dequeue.popHead(); // 3
dequeue.popHead(); // 1
dequeue.popHead(); // undefined

- Heap

import { Heap } from 'data-structure-visualization';

// νž™ μΈμŠ€ν„΄μŠ€ 생성
// new Heap(isMax = true)
// μƒμ„±μžμ— 인자둜 boolean 값을 쀄 수 μžˆλ‹€.
// true 이면 max heap, false 이면 min heap이 μƒμ„±λ˜κ³ , 기본값은 true 이닀.
const heap = new Heap();

// insert μΈμžκ°€ number νƒ€μž…μ΄ μ•„λ‹ˆλ©΄ μ—λŸ¬κ°€ λ°œμƒν•œλ‹€.
heap.insert('not number'); // Error: Invalid value is given!

heap.insert(4); // [4]
heap.insert(6); // [6, 4]
heap.insert(5); // [6, 4, 5]
heap.insert(10); // [10, 6, 5, 4]

heap.size(); // 4

heap.pop(); // 10
// [6, 4, 5]
heap.pop(); // 6
// [5, 4]
heap.pop(); // 5
// [4]
heap.pop(); // 4
// []
heap.pop(); // undefined

- Priority Queue

import { PriorityQueue } from 'data-structure-visualization';

// μš°μ„ μˆœμœ„ 큐 μΈμŠ€ν„΄μŠ€ 생성
const pq = new PriorityQueue();

// pq.enqueue(priority, value)

// priority κ°€ number νƒ€μž…μ΄ μ•„λ‹ˆλ©΄ μ—λŸ¬κ°€ λ°œμƒν•œλ‹€.
pq.enqueue('not number', 'val'); // Error: Invalid value is given!

pq.enqueue(3, 'wash your hand');
// [{3, 'wash your hand'}]
pq.enqueue(4, 'eat food');
// [{3, 'wash your hand'}, {4, 'eat food'}]
pq.enqueue(1, 'find out location of toilet');
// [{1, 'find out location of toilet'}, {4, 'eat food'}, {3, 'wash your hand'}]

pq.size(); // 3

pq.dequeue(); // {priority: 1, value: 'find out location of toilet'}
// [{3, 'wash your hand'}, {4, 'eat food'}]
pq.dequeue(); // {priority: 3, value: 'wash your hand'}
// [{4, 'eat food'}]
pq.dequeue(); // {priority: 4, value: 'eat food'}
// []
pq.dequeue(); // undefined

- Binary Search Tree

import { BinarySearchTree } from 'data-structure-visualization';

// μ΄μ§„νƒμƒ‰νŠΈλ¦¬ μΈμŠ€ν„΄μŠ€ 생성
const bst = new BinarySearchTree();

// insert 의 μΈμžκ°€ number μ΄μ™Έμ˜ νƒ€μž…μΌ 경우 μ—λŸ¬ λ°œμƒ
bst.insert('not number'); // Error: Invalid valud is given!

bst.insert(4);
// 4
bst.insert(3);
//   4
// 3
bst.insert(10);
//   4
// 3   10
bst.insert(100);
//   4
// 3   10
//       100

bst.find(3); // true
bst.find(11); // false

bst.remove(10);
//   4
// 3   100
bst.remove(20); // Error: given value doesn't exist!!

- Graph

import { Graph } from 'data-structure-visualization';

// κ·Έλž˜ν”„ μΈμŠ€ν„΄μŠ€ 생성
const graph = new Graph();

graph.addVertex('a');
graph.addVertex('b');
graph.addVertex('b'); // Error: given value already exists!
graph.addVertex('c');

graph.sizeVertex(); // 3

graph.addEdge('a', 'b');
graph.addEdge('a', 'z'); // Error: given value doesn't exist!
graph.addEdge('a', 'c');
//    a
//  /  \
// b   c

graph.sizeEdge(); // 2

graph.removeEdge('a', 'b');
graph.removeEdge('a', 'z'); // Error: given value doesn't exist!
//    a
//     \
// b   c

graph.sizeEdge(); // 1

graph.removeVertex('c');
graph.removeVertex('d'); // Error: given value doesn't exist!
//   a
//
// b
// removeVertex λ©”μ†Œλ“œλ₯Ό μ‹€ν–‰ν•˜λ©΄ ν•΄λ‹Ή vertex에 μ—°κ²°λ˜μ–΄ 있던 λͺ¨λ“  edge듀이 μ œκ±°λœλ‹€.

graph.sizeVertex(); // 2
graph.sizeEdge(); // 0

- B - Tree

ν˜„μž¬ ν™€μˆ˜ b-tree 만 μ§€μ›ν•©λ‹ˆλ‹€.

import { BTree } from 'data-structure-visualization';

// B-tree μΈμŠ€ν„΄μŠ€ 생성
// μƒμ„±μž ν•¨μˆ˜μ˜ 첫번째 인자둜 b-tree의 차수 전달.
const btree = new BTree(3); // 3μ°¨ b-tree 생성
new Btree(4); // Error : invalid value is given! (ν˜„μž¬ ν™€μˆ˜ b-tree 만 μ§€μ›ν•©λ‹ˆλ‹€.)

btree.insert(5);
btree.insert(8);
btree.insert(11);
btree.insert(13);
btree.insert(15);
btree.insert(15); // Error : given value already exist!

btree.size(); // 5

//     8
//  /    \
// 5  11 13 15

btree.find(13); // BTreeNode { values: [12 ,13, 15], children: [], limit: 3 }
btree.find(1); // false

btree.remove(8);
//    11
//  /    \
// 5   13 15
btree.remove(1); // Error : given value doesn't exist!

btree.size(); // 4

TEST

  • ν…ŒμŠ€νŠΈ μ‹€ν–‰
npm run test

SERVER LISTENING

루트 λ””λ ‰ν† λ¦¬μ—μ„œ npm run start 둜 visualization μ›Ή μ„œλ²„λ₯Ό 3000번 ν¬νŠΈμ— μ‹€ν–‰μ‹œν‚¬ 수 μžˆμŠ΅λ‹ˆλ‹€.

npm run start

μ›Ή λ·° frontend μ˜ˆμ‹œ νŽ˜μ΄μ§€ : http://ec2-13-209-66-132.ap-northeast-2.compute.amazonaws.com/

LICENSE

MIT