Anton Bely
Hello world! My name is Anton Bely and I'm Product Frontend Engineer. Welcome!
Data Structures with JS
Evening talk
Time Complexity
Use timer
⏰
Use math
👩🏻💻
Big O notation
Big O notation
Monthly temperature
let januaryTemperature = -15.4;
let februaryTemperature = -17.2;
let marchTemperature = 2.7;
let aprilTemperature = 12.6;
let mayTemperature = 23.0;
let juneTemperature = 27.1;
let julyTemperature = 28.8;
let augustTemperature = 25.4;
let septemberTemperature = 18.9;
let octoberTemperature = 15.2;
let novemberTemperature = -1.7;
let decemberTemperature = -9.6;Monthly average temperature for one year
For several years?
Calculate average per year?
Check tendency for 10 years?
Array
let monthlyTemperature = [
-15.4, -17.2, 2.7, 12.6,
23.0, 27.1, 28.8, 25.4,
18.9, 15.2, -1.7, -9.6
];Monthly average temperature for one year
For several years!
Calculate average per year!
Check tendency for 10 years!
let averagePerYear = monthlyTemperature.reduce(
(acc, item) => acc + item,
0
) / monthlyTemperature.length;Array
[0]
[1]
[2]
[3]
[...]
-15.4
-17.2
2.7
12.6
...
Add element
[0]
[1]
[2]
[3]
-15.4
-17.2
2.7
12.6
[4]
23.0
let monthlyTemperature = [ -15.4, -17.2, 2.7 ];
monthlyTemperature.push( 12.6 );Code time
Linked List
🐱
🐶
🐭
NULL
Node
HEAD
Add node
🐱
🐶
🐭
NULL
Node
HEAD
🦄
New node
HEAD
Add node
🐱
🐶
🐭
NULL
Node
HEAD
🦄
New node
Remove node
🐱
🐶
🐭
NULL
HEAD
🦄
Remove node
🐱
🐶
🐭
NULL
HEAD
🦄
Code time
Time complexity
Doubly Linked List
🐱
🐶
🐭
NULL
Node
HEAD
NULL
TAIL
Add element
🐱
🐶
🐭
NULL
Node
HEAD
NULL
TAIL
🦄
New node
Add element
🐱
🐶
🐭
NULL
Node
HEAD
NULL
TAIL
🦄
New node
Remove element
🐱
🐶
🐭
NULL
Node
HEAD
NULL
TAIL
Remove element
🐱
🐶
🐭
NULL
Node
HEAD
NULL
TAIL
Code time
Time complexity
Circular Linked List
🐱
🐶
🐭
HEAD
Doubly Circular Linked List
🐱
🐶
🐭
HEAD
TAIL
Stack
1
2
3
Push
Pop
4
Top
Push flow
5
2
3
Push 5
4
Empty stack
Push 2
5
2
Push 4
4
5
2
Push 3
Pop flow
5
2
3
4
5
2
4
5
2
Pop
Pop
Code time
Time complexity
Queue
1
2
3
Enqueue
Dequeue
4
Front
Enqueue flow
1
End
Front
1
2
3
4
1
2
3
End
Front
Enqueue 2
Enqueue 3
Enqueue 4
Front
End
Dequeue flow
4
End
Front
1
2
3
4
3
End
Front
Dequeue
Dequeue
Dequeue
Front
End
4
Code time
Time complexity
Priority Queue
Mike
Paul
Sara
John
Paul
Set
N = { 1, 2, 3, 4, ... , 100, ... }
A = { x, y, z }
Data structure with unique elements
Union
Intersection
Difference
Subset
Code time
Dictionary / Map
IconMap = {
< 'Avocado': '🥑' >
< 'Pizza': '🍕' >
}
Data structure with pairs <key, value>, where keys are unique
Hash Table
Handling Collisions
Linear Probing
Separate Chaining
Use next position
Use list of values
Tree
Root - 1
Leaf - 6, 7, 8, 3, 12, 10, 11
Height - 3
Binary Search Tree (BST)
BST: Remove Item
1. Find item by value
2. Check type of selected item:
2.1. Leaf - it's cool (do nothing)
2.2. Has only one child: left or right (set this child node instead of current node)
2.3. Has both children (find min from the right child and set this value on current position, deleting min node)
BST: Left Traversing
Code time
BST: Unbalanced Tree
10
8
12
15
21
23
AVL Tree
Balanced Tree
AVL Tree: Left Rotation
AVL Tree: Right Rotation
AVL Tree: Left Right Rotation
AVL Tree: Right Left Rotation
Heap
Min Heap
Heap: Add Item
1. Create a new node with item at the end of heap.
2. Compare the value of new node with its parent.
3. If value of parent is greater than child, then swap them.
4. Go to step 2.
Heap: Remove Item
1. Remove root node.
2. Move the last element of last level to root.
3. Go to step 2 & 3 from "Add Item" section.
Tree with Array
0
1
2
10
3
4
5
6
7
8
9
10
14
19
26
31
42
27
44
35
33
Index
Left child: 2*n
Right child: 2*n+1
Parent: Math.floor(n/2)
Code time
Data Structures with JS
By Anton Bely
