.map and .filter's thisValue, what's for?

so i looked up the map and filter methods on google and i almost understood everything about them, except the this value parameter in them , i read the explanation about it yet i don’t know what is used for. so i was worried i may need it in my futur coding.
can anybody give a simple example and explain why we need the thisValue and how to use it in the method? ( pseudo code: array.map( function(currentValue, index, arr), thisValue ).
my example:

const myArray=[1,2,3,4,5,6];
const myFunc = par => par*2;
const result = myArray.map(myFunc, //this value what is it for);

thank you

Hello, please am currently on where you got out Filter, Map and reduce().
can you please share with me the resource you used to understand the concept.

thanks

and to those that will be viewing this, any resources that will help in understanding the concept will be appreciated.

I don’t know what the usecase is exactly, and I never realised it actually existed. Afaics it’s useless and can be ignored; there must have been a reason for it existing but I’m not seeing it. I may be missing something here, but I’ve been using JS for years now and have never ever seen that second argument used in any code, ever.

Note that it won’t work with arrow functions, have to use a function declaration.

It sets what the value of this is for the callback. So if I don’t set it (note MDN says it’s set to undefined but that’s not what I’m getting here):

["a", "b", "c"].map(function(el) {
  return el + this;
});

For that in the browser console I get:

[
  "a[object Window]",
  "b[object Window]",
  "c[object Window]",
]

this in this case is context the function is being called within (Window).

So if I add the second argument:

["a", "b", "c"].map(function(el) {
  return el + this;
}, "fart");

For that, I’ve set what this is when the callback runs, so result:

[
  "afart",
  "bfart",
  "cfart",
]

Just to reiterate that this will not work if you’re using an arrow function. Arrow functions do not have their own this context, so the result will always be like the first example regardless.

1 Like

search for .map , .filter and .reduce in these 2 websites:
in this it’s longer and easier : https://developer.mozilla.org
in here it’s short definitions: https://www.w3schools.com
i suggest you read about each of the methods in both sites , to complete your understandings of how they work.
good luck.

1 Like

Thanks Dev, Alright i’ll