Explain me callback and how its refer to array in code

Question

I dont understand what is callback in this example, espicially line newArray.push(callback(this[i])); as i got it (this[i]) is item from Array, but how does CALLBACK refer to code;

const s = [23, 65, 98, 5];

Array.prototype.myMap = function(callback) {
  const newArray = [];
  
  for(let i=0;i<this.length;i++){
      newArray.push(callback(this[i]));
  }
  return newArray;
};



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

console.log(new_s);

Archer Blood · Accepted Answer · 2022-04-25T13:53:27.563

1. Background concepts

Firstly, this top part is just a function definition where 'callback' is just a parameter that myMap is able to accept. The word 'callback' isn't special and you can use in fact any name, but 'callback' does signal that in your function definition you are asking the caller to supply a function instead of an integer or a string. That is, you could also write something like this:

Array.prototype.myMap = function(param) {
   // you can console.log(param) and you would see the parameter in log.
}

And in theory you could then call this function by doing:

s.myMap(1) // the log will show 1
s.myMap("hello") // the log will show "hello"
s.myMap(function() {}) // the log will show [Parameter is a Function]

Secondly, if you name your parameter 'callback', it signals to the caller that they could in fact pass a function into this myMap not just an integer or a string -- so when you write something like this:

Array.prototype.myMap = function(callback_f) {
   callback_f(); // <----- call the incoming function passed as a param
}

Then the caller has an idea that they have to supply a function into myMap, either in this way:

s.MyMap(function() {
   // do some stuff
})

Or in this way:

function doStuff() {}
s.MyMap(doStuff)

Either way, the parameter callback_f is expected to be a function in this case, and myMap will call and execute this function, regardless of what you pass into it.

2. Answering your question

As you may already know, this is a special function definition because, by doing Array.prototype.myMap you're modifying how all arrays work and all arrays will now gain this function definition myMap.

Secondly, you can call this function by doing s.myMap() if s is any array.

So in your case, the line:

newArray.push(callback(this[i]))

could also be written as:

let result_of_executing_the_callback = callback(this[i])
newArray.push(result_of_executing_the_callback)

which means: first, execute the incoming callback function on this (= current array) at the index i. And what is the incoming callback function? It is the function f that you are passing in when you do s.MyMap(f):

In your case f is this:

function(item) {
  return item * 2;
}

picture of f being passed into your function as the parameter 'callback'

(If this is helpful please mark as accepted!)

Damn You right and now im in. I was getting headache about this part, now im good. Thank You so much for your awesome explanation and precious time! — technic_brsa, Apr 25 '22 at 15:59
of course np! if you don't mind to mark the answer (with checkmark) that would be great! — Archer Blood, Apr 25 '22 at 19:07

Explain me callback and how its refer to array in code

1 Answers1