Day 12 of #100DaysOfCode!

Tags: javascript, codenewbie, 100daysofcode, beginners
Published: 2021-07-02 19:15:28

<h2>Today's progress</h2>
This morning I worked on an intermediate scripting algorithm problem from <a href="https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range">freeCodeCamp</a>.

The problem set is as follows:

**Sum All Numbers in Range**

> We'll pass you an array of two numbers. Return the sum of those two numbers plus the sum of all the numbers between them. The lowest number will not always come first.

> For example, sumAll([4,1]) should return 10 because sum of all the numbers between 1 and 4 (both inclusive) is 10.

<h2>What I learned</h2>

When given a problem it is important to **understand** what the problem is asking. Carefully reading and re-reading the problem helps to digest what it's asking you to do. Read it out aloud if you need to and write notes.

Before writing code I like to **divide and conquer** and try to break it down to smaller subproblems and solve them in isolation. This helps to break down each step of what I'm plan to do in writing. 

It can also help to write in **human-readable text** to better organize your thought process and identify any gaps. 

Finally, when implementing the code solution for each subproblems. I like to create **visual representation** of what does the code is actually doing. For example, if the code I implemented is a for loop. I would visually create each iteration input and output. Something along the lines like...

```javascript
let arr = [1,2,3,4,5]
let sum = 0;

for(let i = 0; i < arr.length; i++){
//      i = 0; 0 < 5; 0++
//      i = 1; 1 < 5; 1++
//      i = 2; 2 < 5; 2++
//      i = 3; 3 < 5; 3++
//      i = 4; 4 < 5; 4++

             sum += arr[i]
// 1st loop:  0 += 1 = 1
// 2nd loop:  1 += 2 = 3
// 3rd loop:  3 += 3 = 6
// 4th loop:  6 += 4 = 10
// 5th loop: 10 += 5 = 15

}
console.log(sum)
//output: 15
```

Now, it can look a bit messy with the comments but it's okay because it's much more important that we understand what's happening and if we continue to practice it we can create it visually in our heads but for now I like to do it this way but definitely try out techniques that works best for you!

####As a side note
You can also use `console.log` to create visual representation to display it on your browser's console and see what's happening under the hood. 

```javascript
for(let i = 0; i < arr.length; i++){
     sum += arr[i]
     console.log(sum)
//output: 1
//        3
//        6
//       10
//       15 
}
```

I like to do it this way too and I think is a good way to troubleshoot and identify if the code is working correctly.


####Going back to the original problem

So we have to *sum all numbers in range*

If we have an array [1, 4]. We must include all the numbers in between `[1, 2, 3, 4]` and get the sum of all the numbers in the array.

Below is how I solved the problem.

```javascript
function sumAll(arr) {
  // pass in an array of two numbers
  // return the sum of those numbers
  // PLUS
  // the sum of all numbers between them

  // for example...
  // [1,4]     = 1 + 4 = 5 
  // [1,2,3,4] = 2 + 3 = 5
  // 5 + 5     = 10

  // get the lowest value using Math.min()
  // get the largest value using Math.max()
  let min = Math.min(arr[0], arr[1])
  let max = Math.max(arr[0], arr[1])

  // create a sum variable
  let sum = 0;

  // loop through the array
  // let i = 1; min < arr.length; min++)

  // loops 4 times
  for(let i = min; min <= max; min++){
       sum+= min
    // 0 += 1 = 1
    // 1 += 2 = 3
    // 3 += 3 = 6
    // 4 += 4 = 10
  }  
  return sum;
}

console.log(sumAll([1, 4]));
//output: 10
```

####Breaking it down

For the first set of code example.

```javascript
// get the lowest value using Math.min()
// get the largest value using Math.max()
let min = Math.min(arr[0], arr[1])
let max = Math.max(arr[0], arr[1])
```

The above code gets the array's first and second indexes and returns the lowest value and largest value using `Math.min()` and `Math.max()`.

Next, we create a variable which will store the sum of all the elements in the array.

```javascript
let sum = 0;
```

Then, we create a `for loop` that will increment the `min` value by 1 and add the `min` value to `sum` on each iteration.
```javascript
for(let i = min; min <= max; min++){
  sum += min;
}
```

Finally, because its a function we want to return some value. Remember `INPUT => PROCESS => OUTPUT`. So we use the `return` on `sum` and should return `10`

```javascript
return sum;
```

<h2>Simply put</h2>
When it comes to solving code problem sets. Just take it apart one by one and understand what the problem is asking. By isolating each part of the problem and writing notes. It can help to organize your thought process and identify any gaps. Remember to take it slow and don't feel you have to provide the best solution. Sometimes, having a solution is more than enough. Sure, it's important to consider the least amount of code and the most optimal but for the sake of developing problem solving skills. Then find the solution that fits is good enough. I know that it can take me hours even days to solve an algorithm but it definitely comes with practice.