stringsToNumber-low

/* Write a function addThreeNumsFromString that takes a single string
 * as argument. The given string will consist of three numbers
 * separated by a space. The function will add the three the numbers
 * and return their sum.
 */

/* This is the low-level view of what's going on wrong: what
 * operations are actually happening, what values are going into those
 * operations and such.
 */

/* The very first things that happen, before all the rest of your
 * code:
 * - All of your function definitions are "hoisted" to the top of your
 *   program. Notice that you can call your functions earlier in your
 *   code than the point at which you actually defined them. That's
 *   not normal. Only JS really does this.
 * - All of the variables that you defined with `var` are placed in
 *   this global scope. If still foggy on what scope means, scope is
 *   where names (variables) live. It's basically an object
 *   (conceptually): names of variables are mapped to their values.
 * - So, at this point in your program, the following names and values
 *   are in scope:
 *   - addThreeNumsFromString : function(str) {...}
 *   - sum : undefined
 *   - Any other JS objects like `console`, `Array`, `String`,
 *     `Number`, and so on.
 * - The reason that `sum` has a value of undefined is that variables
 *   declared with `var` are given a sum of undefined to start until
 *   the actual assignment statement you wrote happens. While the
 *   names of variables declared with `var` are available at the start
 *   of the scope in which they're defined, the values assinged to
 *   them are not because the assignment statement hasn't happened
 *   yet. This behavior is one of the reasons that many programmers
 *   prefer `let` over `var`. You never have to account for this sort
 *   of strange behavior.
 */

console.log(addThreeNumsFromString("5 5 5"))
// will log 15
console.log(addThreeNumsFromString("4 2 1"))
// will log 7


//Your Answer:
var sum = 0;

// For my explanations of this function, just assume that the argument
// is the string "5 5 5".
function addThreeNumsFromString (str){
  /* Whenever you invoke `addThreeNumsFromString`, you open up a new
   * scope as part of the function. This scope contains all of the
   * parameters of your function, as bound to their actual arguments:
   *    parameter Name : argument value
   *    str            : "5 5 5"
   * It also contains all of the names you declared with `var` inside
   * of this function:
   *    newArr         : undefined
   *    i              : undefined
   * Which start out at undefined because we have not yet gotten to
   * the point in the function where the variables are assigned
   * values.
   */

  /* var newArr = str.split("");
   * Evaluates to:
   *    ['5', ' ', '5', ' ', '5']
   */
  var newArr = str.split("");
  /* str.length is 5, because there's five characters in the string.
   * You're going to iterate over the following values:
   * i         : 0  , 1  , 2  , 3  , 4
   * newArr[i] : '5', ' ', '5', ' ', '5'
   */
  for (var i = 0; i < str.length; i++){
    /* - Adding is the right idea here.
     * - Your inputs are wrong. The first thing that's wrong is that
     *   you're trying to sum up *strings*, because you haven't
     *   converted the strings into numbers.
     *   - Desired behavior:
     *      sum += Number(newArr[i])
     *      sum = sum + Number(newArr[i])
     *   - What was written:
     *      sum += newArr[i]
     *      sum = sum + newArr[i]
     *      sum = String(sum) + newArr[i]
     *   Because that's how JS handles addition with strings.
     * - `sum` is also wrong here. You might expect `sum` to be 0, but
     *   its not. At this point in your code, here's what your scope
     *   looks like:
     *      local scope:
     *        str : "5 5 5"
     *        newArr : ['5', ' ', '5', ' ', '5']
     *        i : 0
     *      enclosing scope (which is the global scope):
     *        addThreeNumsFromString : function(str) {...}
     *        sum : undefined
     *        other JS global variables, like `console`, etc.
     *   When you requiest the value of `sum`, JS will:
     *   - Look in local scope first.
     *   - See that there is no entry for `sum` in the local scope.
     *   - Go to the enclosing scope, whatever that may be. In this
     *     case it is the global scope.
     *   - If `sum` is in this enclosing scope, then JS will take this
     *     value.
     *   - If `sum` is NOT in the global scope (which is the highest
     *     scope), then you will get a ReferenceError.
     *   - Since `sum` is in the global scope, the value of `sum` in
     *     this scope would get used. Since you called the function
     *     before `sum` got assigned value, value of `sum` is
     *     `undefined`.
     * - So, what actually gets executed on the first time this
     *   statement happens (when i == 0):
     *        sum += "5"
     *        sum = sum               + "5"
     *        sum = undefined         + "5"
     *        sum = String(undefined) + "5"
     *        sum = "undefined5"
     *   because this is how JS is going to handle the addition of
     *   these two values.
     */
    sum += newArr[i]
  }
  /* Consider that `sum` does not live inside of this function, but
   * outside. Returning `sum` is the right idea, but it makes little
   * sense when returned value lives outside of function's scope.
   */
  return sum;
}