Map:

map is a method that is available to any array.

It takes in a callback function which is called once for every element within the array

The return value of each function call will be added to a new array which will be the
final return value once all elements have been iterated through

Note: Map returns a new array, it does not in itself modify the original array.

Here is a simple example of how map works - for now pay attention to the original array
and the new array this is returned.

Then we will go over in greater detail the mechanics of how map is working behind the scenes
to create the new array.

var nums = [1, 2, 3];

We will use this array to generate the numsDoubled array.

nums.map(function(num) {
  return num * 2;
});

Because the return value of calling map on an array will be a new array let's
store the return value in a variable:

let numsDoubled = nums.map(function(num) {
  return num * 2;
});

nums still contains the original array i.e:
[1, 2, 3];

numsDoubled is the newly created array with each number doubled i.e:
[2, 4, 6];

It should hopefully be clear here that it is the callback function which is responsible for
taking in the value of each element one at a time and returning some value.

The same result could also be achieved by using a traditional for loop
however map can achieve the same result in a more concise implicit way.

When map is called a function is passed as the first argument. This function
will be called once for each element within the array.

In this case there are three elments in the array so the function will be called
three times.

This callback function can accept three different parameters, however for now
we will focus on the first parameter.

This first parameter represents the value of the current element within the array. The actual looping
mechanism is implicit meaning that the corresponding value will change for each iteration.

Remember that the function is called for once iteration so it always knows which element within the
array that it is referring to.

The return value from this callback function is used to populate the new array this is created.

Map will add a new element to this array for each element in the initial array.

Generally you will use the value that is passing in to create the new value in the new array.

For example we want to use our nums array to create a new array where each number from the
original array is doubled

If the return keyword is not used within the callback function the default value of undefined
is added to the new array.

This callback function also takes two other arguments, index and the array itself - these are
optional but helpful.

It is important to understand that arguments are passed implicitly by nature of how the
map method works rather than being passed in by the author of the code - this is a fairly
practise in many popular JavaScript libraries

The index is the current index of the array, for example in the first iteration the
index is 0, the next it is 1 etc

The original is passed as the third argument if needed.

Note that all of these are passed to the callback function but you only need to indicate the parameters
that you need.

In our example we only needed the value to get the result that we wanted:

let numsDoubled = nums.map(function(num) {
  return num * 2;
});

In other situations you might also want to pass the index along.

The value, index and array parameters can be called anything because the value for
each parameter is dependent on the position and not the name.

The first parameter is always the value
The second parameter is always the index
The third is always the original array.

The map method in addition to the callback function can also receive a second argument but
that isn't relevant for what we are doing so I will leave it out for now.

So to recap, map is a method on the array that takes in a callback function and this function
is run once for each element within the array and then returns a new array based on what was returned.

Many other array methods work similar to map so once you understand how map works you will also
understand how other methods work like forEach, filter, etc etc

Although understanding how map works to begin with can be difficult once you understand it helps to keep code
minimal and to the point.

The less code in the application that easier it will be to make sense of it and there is less
opportunity that any errors may be created (because there is less code).


A glossary of terms:

Implicit: Something that is implied rather than directly stated. For example the map method
does most of its work implicitly. Generally implicit code will be less verbose than explicit code

Explicit: Showing the process/steps taken to achieve a certain outcome. A for loop is a
good example of an explicit mechanism. Generally explicit code will be more verbose than implicit code.

Note: There are advantages and disadvantages to explicit and implicit mechanisms.

Implicit mechanisms are more concise and require less mental processing so long
as you are familiar with them.

Learning how they work may be difficult because generally the way that the result is obtained
is hidden - there is more work being done than you can see.

Implicit code is helpful when the result is obvious based on what input you gave it and what
result you received.

Explicit code can be verbose which means that you will have to write and read more code
and there is more chance of causing some kind of error.

The advantage is that you can look in fine detail the step by step process by which a result
was achieved.

Callback function: A function that is passed as an argument to another function
and which is called by that as part of the internal workings of the function of
which it is passed

Method: In JavaScript the term method essentially refers to a function that is
called in relation to an object. An array is considered an object in JavaScript
and so any array has access to the map method.

Return value: Every function in JavaScript returns a value either an explicit value or the keyword
undefined if there is no explicit use of the return keyword

Iterations: Doing something multiple times. Each time the data available is
likely to be different