Binary Heaps (Min/Max Heaps) in JavaScript For Beginners An Implementation of a Priority Queue

In this tutorial, we will be going over a binary heap, using JavaScript. Within this video, we'll be implementing a binary heap using an array. We'll be going over what a Binary Heap is, as well as going over the Iterative Implementation as well as a Recursive Implementation. A Binary Heap comes in 2 forms, we have a Min-Heap and a Max-Heap. Within this video we'll be going over a Min-Heap. Once you understand how to implement a Min-Heap, you should be able to implement a Max-Heap on your own. A Binary Heap is also an Implementation of the Abstract Data Structure of a Priority Queue.

Source Code:

0:00 : Intro
0:36 : Binary Heap Properties
2:10 : Insertion Overview
4:29 : Deletion Overview
6:00 : Representing Heap using Array Overview
7:57 Min-Heap Constructor Code
8:23 Helper Methods Code
11:07 insert method code (iterative)
11:40 heapifyUp method code (iterative)
12:18 Insertion Code Example Iterative
14:30 insert method code (recursive)
14:53 heapifyUp method code (recursive)
15:37 Insertion Code Example (recursive)
19:03 removeMin method code (iterative)
19:50 heapifyDown method code (iterative)
20:58 Deletion Code Example (iterative)
24:55 removeMin method code (recursive)
25:17 heapifyDown method code (recursive)
26:43 Deletion Code Example (recursive)

[endle_ss]

Amazing explanation!! . Particularly loved the visualization and how you broke down the problem explaining the recursive and the iterative approach. Thank you so much for this video!!

[calgary]

Best Heaps explanation on YT. Thank you very much!

[bao-wow-in-da-house]

This is insane. You put in a lot of work for this video. This guy deserve a medal.

[danielh]

I've had a fair amount of trouble understanding binary heap implementation and watched several videos to try and figure it out.
This was by far the best. Not only were your explanations detailed and visually clear, but providing multiple examples on a number of
the concepts were EXTREMELY helpful and set you apart from the other videos I saw. Thank you SO much!!! <3

[vishwatj]

Hey, you are like a ray of sunshine, that was amazing keep up the good work🌄

[ocoocososococosooooosoococoso]

this is crazy well explained video of heap in javascript. Thank you for providing quality lecture of heap

[kenansari]

man, thank you so much for such an informative video, I thank you million times.

[vidro]

best explanation of this i've seen, especially in js

[NoobCoder]

Source Code:

Time Stamps:
0:00​ : Intro
0:36​ : Binary Heap Properties
2:10​ : Insertion Overview
4:29​ : Deletion Overview
6:00​ : Representing Heap using Array Overview
7:57​ Min-Heap Constructor Code
8:23​ Helper Methods Code
11:07​ insert method code (iterative)
11:40​ heapifyUp method code (iterative)
12:18​ Insertion Code Example Iterative
14:30​ insert method code (recursive)
14:53​ heapifyUp method code (recursive)
15:37​ Insertion Code Example (recursive)
19:03​ removeMin method code (iterative)
19:50​ heapifyDown method code (iterative)
20:58​ Deletion Code Example (iterative)
24:55​ removeMin method code (recursive)
25:17​ heapifyDown method code (recursive)
26:43​ Deletion Code Example (recursive)

[seans]

Loved this video! So simple and so easy to understand. cant wait for more videos!

[ParamSinghAhuja]

Really cool implementation. Thank you so much. It will be really kind of you if can please guide on as to how we can use this to implement a Priority Queue that enqueues elements with some priority. I understand the dequeue will the element with min number (priority say 1) attached to it if it is a Min Heap. But I am not able to somehow relate to the enqueue operation

[murshidameen]

why recursive method of insertion showing call stack error?

[muhammedaflah]

Crisp and clear. The best video I have seen about heaps.

[jennielfiguereo]

I really enjoy the thorough iterative and recursive walkthrough, i am having a hard time understanding the remove method.. we update the root node to the rightmost value, but the rightmost value in the heap is never actually removed. I added this.heap.pop() after this.heap[0] = this.heap[this.size - 1]

[rooseveltsnowden]

Great explanation, but I did want to ask when is the priority queue used? We used a normal queue but never assigned priorities to any of the elements.