Sunday, November 8, 2015

Let Me Re Iterator That


Iterators are handy tools that make looping through an array of data quicker than traditional for or while loops. The javascript iterators, map, reduce and forEach all employ an anonymous function that has three arguments built in: item, index and all.

Item references the current item in the array being operated on.

Index is the index of the item in the array that is being iterated through. (eg the first item in the array would have an index of 0).

All is the array itself.

MAP.map will go through every item in an array, preform some code on it and return a new array of THE EXACT SAME SIZE.

syntax:

var mappedArray= array.map(function(item, index, all){

   preform some operation to every item in array and return a new array with every item as the item       has been transformed by your code.

  return item OR all OR a variable you create or whatever.
})

You must always write a return statement at the bottom of your array (or else it will just be an empty array).

Examples of when to use this:
if you have a string of text and you want to manipulate each word or each letter (eg change certain letters to caps or if you want to add a certain number to each existing number in an array of numbers.

example: 
Johnny is making a database to keep track of each of the gentleman callers that visit his mom late at night. He wants to be able to add information to their profiles as he gets to know them better. Recently he found out that his mom only dates guys that are 27 years old, so he writes the following program.

var momsHarem = [{Name: Bruce, VisitsOn: [Wed]}, {Name: Clark, VisitsOn: [Wed,Friday]}, {Name: Tony, VisitsOn: []}]

function addToHarem(array) {
var newArray = array.map(function(item, index, all){
   item.age = 27;
console.log(item);
       
      return item;
 
})
  return newArray
}
addToHarem(momsHarem)

FOR EACH.forEach will go through every element in an array and will allow you to present some condition or not that will affect which items in the array are manipulated. If you want an array of the exact same size it is probably better to just use map, but for each can also be used.

syntax: 

array.forEach(function(item, index, all){

if (item MEETS SOME CONDITION) {

preform some code on the item and or index or whatever
}
  manipulatedArray.push
 OR
 $("#id").text(manipulated item from array)
OR
whatever else you wanna do
 })

example: 
Abhi has an extensive library of  things that sparkle, so he keeps the information about the items in a database. He wants to be able to search for particular theme or title and have the results returned in an array, so he writes the following function:
thingsThatSparkle = [{item: "glitter", location: "lv69", subGenres: "crafts shimmer"}, {item: "new penny", location: "fm11", subGenres: "coin glint"} ]

function findShinys(array, value){
  var results =[]

  thingsThatSparkle.forEach(function(item, index, all){
  var keyValue = item.subGenres
console.log(keyValue)
   if ( keyValue.indexOf(value) > -1) {
       results.push(item)
    }
  })
  return results;
}
console.log(findShinys(thingsThatSparkle, "glint"))

findUserInfo("a", array)

forEach does not return a value so to get info out you will need to push to an array or print to document or something along those lines to have the results of the loop show up.

when to use it:
if you want to do something to eliminate the odd numbers from an array OR send just the first 3 items to an array and do nothing with or do something else with the rest of the items. OR add a class to only the items that contain the letter B or whatever it is that you want to sort out one thing from another or eliminate items from an array.

REDUCE
.reduce will go through each item in an array and return a single value. So if you want to take an array of letters and return a single item rather than an array. Reduce also has an additional argument in front of these three, accumulation, which is the accumulation, running total of numbers being operated on or the current version of the string. The initial value of the accumulation can be set as a second argument in the anonymous function.

syntax:

var reducedValue = array.reduce(function(accumulation,  item, index, all){
   acc = acc item OPERATION (+, -, *, / etc...)
}, STARTING VALUE FOR THE ACCUMULATION -- USUALLY 0 OR 1 DEPENDING ON THE OPERATION YOU ARE PREFORMING)

WHEN TO USE
if you want to take an array of numbers that have been input and preform the same operation on them (eg if you wanted to add all the elements in an array and then work with the total)

OR

If you have a multidimensional array of letters or numbers and you want to concatenate each array within the array into a single value and then do something with that single value.

example:
Sally is building an app that pushes the value for the number of shits she gave in each of her classes today. She wants to take that data and total it so she knows the total amount of shits she gave all day long.

var shitsGivenToday= [0,1,0.5,2.4,0 ]

var totalShits = shitsGivenToday.reduce(function(acc, item, index, all){
   varShitsGivenToday = acc + item;
  return acc;
},0)

more about iterators

No comments:

Post a Comment