"Implement a Map prototype" with forEach?

"Implement a Map prototype" with forEach?
0.0 0

#1

So im running into a bit of an issue. I solved this issue (on beta) through:

// the global Array
var s = [23, 65, 98, 5];

Array.prototype.myMap = function(callback){
  var newArray = [];
  // Add your code below this line
  for(var i = 0;i < this.length;i++)
  {
  	newArray.push(callback(this[i]));
  }
  // Add your code above this line
  return newArray;

};

var new_s = s.myMap(function(item){
  return item * 2;
});

console.log(new_s);

I wanted to try implementing it with forEach (The for loop makes sense for the most part…)

however something like this DOES NOT work:

// the global Array
var s = [23, 65, 98, 5];

Array.prototype.myMap = function(callback){
  var newArray = [];
  // Add your code below this line
  newArray.forEach(function(item,index,array){
  	newArray.push(callback(this[index]))
  })
  // Add your code above this line
  return newArray;

};

var new_s = s.myMap(function(item){
  return item * 2;
});

console.log(new_s);

Maybe im not understanding how forEach works? can you not manipulate the array itself?


#2

You should use the forEach on the old array since the newArray is the one you are pushing values into. In your case the array s. Considering your solution would otherwise work, that’s probably a typo you didn’t recognize.


#3

Doh! :smacks forehead: Can’t believe I didn’t even think of that, I got it worked (had to change callback(this[index])) to callback(element) in the loop of course.

That begs the question, when using the s.forEach how come I don’t need to say “this[index]” actually saying this[index] does not work. But shouldn’t this refer to s, which is the array? I checked what this was when doing s.forEach and “this” referred to the window object?

Why is that? I mean I am calling s.forEach So I would think even if this was getting pulled down to the forEach method it should still refer to s?

Or is it because forEach is a global Javascript method and this refers to it’s original array prototype or something?


#4

You could have used:

Array.prototype.myMap = function(callback){
  var newArray = [];
  // Add your code below this line
  this.forEach(function(item,index,arr){
  	newArray.push(callback(item,index,arr));
  });
  // Add your code above this line
  return newArray;
};

Instead of using s.forEach, you can use this this.forEach, because this is the original array.


#5

That makes sense, sidenote though…when you do the push, whats the point of including index,arr in it as well? (in fact im confused why it even works)


#6

The map function can use all of those (item, index,arr), so I was making sure to pass them along in case there was a need with a particular solution. Not all situations require needing the other parameters, but by passing them in, they could be used with the forEach the same as you would normally be able to access them via map. Hopefully my explanation is clear.

For the actual example you gave, the following would suffice:

Array.prototype.myMap = function(callback){
  var newArray = [];
  // Add your code below this line
  this.forEach(function(item){
  	newArray.push(callback(item));
  });
  // Add your code above this line
  return newArray;
};

#7

Thanks for this.
Would not have figured this out on my own.


#8

Dang… i knew how to get it to work but i didn’t knew how to catch the array. How did you know to refer at the Array as this?


#9

The following is not the most elegant answer, but it should give you the idea of what is going on.

this refers to the object the function is called upon. In this case when you call the function upon an array, the array (which is an object in JS) is the this inside the function.


#10

this is the thing to the left of the . (the object you are calling the method on). so for [1,2,3].map(), in map, this is [1,2,3]