Basic JavaScript - Replace Loops using Recursion - solved, though confused

Tell us what’s happening:
I stumbled my way to the answer by way of the example, but I’m really not sure how I got there. If someone could tell me what each part of the code is ACTUALLY doing?

  **Your code so far**
function sum(arr, n) {
// Only change code below this line
if (n <= 0) {
return 0;
} else {
return sum(arr, n - 1) + arr[n-1]
}
// Only change code above this line
}
  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.0.0 Safari/537.36

Challenge: Basic JavaScript - Replace Loops using Recursion

Link to the challenge:

JavaScript runs line by line, so really need to just step through and work it out on paper.

But to put it in words, the result of
sum([1, 2, 3], 3) is the same as
sum([1, 2, 3], 2) + 3, which is the same as
sum([1, 2, 3], 1) + 2 + 3, which is the same as
sum([1, 2, 3], 0) + 1 + 2 + 3, which is the same as
0 + 1 + 2 + 3, which is the same as
6

Or you can watch it run with this neat tool: Python Tutor code visualizer: Visualize code in Python, JavaScript, C, C++, and Java