vendredi 14 février 2020

In JavaScript, why pass the context as an argument to a function call when the context is already determined by who calls it?

A read an article on Medium called

You Must Understand These 14 JavaScript Functions by bitfish

In the article the author writes about functions a JavaScript developer must know or understand when/before a Job Interview - for position as a JavaScript developer.

In the examples there is a constant usage of passing in a context as an optional argument. Unfortunately the author does not go into details on why we would pass a context argument like here:

mappedArr[i] = fn.call(context, arr[i], i, this); 

My question is "In JavaScript, why pass the context as an argument to a function call when the context is already determined by who calls it?"

Under what condition is it useful to have that context available (another context)?

Here is the code listed below:

let selfMap = function(fn, context) {

   let arr = Array.prototype.slice.call(this);
   let mappedArr = Array();
   for(let i=0; i < arr.length; i++) {

     if (! arr.hasOwnProperty(i)) continue;

     let info = [];
     info.push({ "context" : context } );
     info.push({ "arr[i]" : arr[i] } );
     info.push({ "i" : i } );
     info.push({ "this" : this } );
     console.log(info);

     mappedArr[i] = fn.call(context, arr[i], i, this); 

   } 
   return mappedArr;

 }; 

And then call it using:

Array.prototype. selfMap = selfMap;
[1,2,3].myMap(n => n * 2);

Why would one provide a context as a second argument to myMap? I think there may be a JavaScript Design Pattern for this, but at this time I could not find any references, due to all the debris of search results on Google that are unrelated to my search.

I did write a function and passed in the context as a second argument but I am not sure, though I could come up with my own thoughts, what is the main reason for doing this?

Here is my example of using it:

[1,2,3].selfMap((n, o, p) => {

     let info = [];
     info.push({ "n" : n } );
     info.push({ "o" : o } );
     info.push({ "p" : p } );
     info.push({ "this" : this } );
     console.log(info)
     return n * 2;

});

Could pass this or window or {}

Context would be equal to the current context of where we called the method from

[1,2,3].selfMap((n, o, context) => {

         let info = [];
         info.push({ "n" : n } );
         info.push({ "o" : o } );
         info.push({ "context" : context } );
         info.push({ "this" : this } );
         console.log(info)
         return n * 2;

}, this);

Window as context argument

[1,2,3].selfMap((n, o, context) => {

     let info = [];
     info.push({ "n" : n } );
     info.push({ "o" : o } );
     info.push({ "context" : context } );
     info.push({ "this" : this } );
     console.log(info)
     return n * 2;

}, window);

And we could use a custom object

[1,2,3].selfMap((n, o, context) => {

     let info = [];
     info.push({ "n" : n } );
     info.push({ "o" : o } );
     info.push({ "context" : context } );
     info.push({ "this" : this } );
     console.log(info)
     return n * 2;

}, { something: 1 });

So, I know that a context can be passed, but I don't know why I might want to pass in a context.

Please with-in your answer provide not only an explanation but an example(s) to clarify your explanation.

Thank You

Aucun commentaire:

Enregistrer un commentaire