Clear me on this, i don't understand it, and why for this functions

please help me to detail it down, :
clear me on this, i don’t understand it, and why for this functions:


// The global variable
var s = [23, 65, 98, 5];

Array.prototype.myFilter = function(callback){
// Only change code below this line
var newArray = [], i = 0;

for (; i < this.length; i++) {
  if(callback(this[i]) == true) {
    newArray.push(this[i]); 
  }
}
// Only change code above this line
return newArray;

};

var new_s = s.myFilter(function(item){
return item % 2 === 1;
});

what exactly don’t you understand from the code, please be specific.

I assume you don’t understand the meaning of the keyword this

In a JavaScript function, this refers to the owner of the function. In this case, it refers to the array. Therefore, when you type this.length, what you get is the length of the array.

All in all, the function returns a new array with the items that fulfill a certain condition (in this case, the condition is that item % 2 === 1.

Hope it helps!

1 Like

i was partially confused about why the this keyword is used here.

Don’t worry, the keyword “this” is one of the most difficult things in javaScript. I don’t even fully understand it now that I finished the course :joy:

2 Likes

:grinning: :grinning: :grinning:
but, you have advanced more. am still getting some confusion on how something is bn implemented here. i don’t know if it do happens to programmers here, or only just me.

Hello there,

The best thing to do, is to go through examples, to understand this:

Think about how you use your myFilter function. Also, in the above case, myFilter is more specifically a method.

let myArray = [2, 1, 3, 4];
// How to use myFilter
myArray.myFilter(someCallbackFunction);

function someCallbackFunction(a) {
  // What happens in here is not important for this
}

Notice how myFilter is not called like a normal function…you do not say:

myFilter(myArray);

And that is part of the distinction between a normal function and a method.

Now, this… As it is a method that is invoked upon an array (it just so happens to be an Array method), this refers to the thing the method is called on:

myArray.myFilter()
// this refers to myArray (within the myFilter method)

Back to your code above:

Array.prototype.myFilter = function(callback){
// Only change code below this line
var newArray = [], i = 0;

for (; i < this.length; i++) {
  if(callback(this[i]) == true) {
    newArray.push(this[i]); 
  }
}
// Only change code above this line
return newArray;

Everywhere you see this, replace it with the array the method is called on. In this case, s

var new_s = s.myFilter(function(item){
return item % 2 === 1;
});

Hope this helps

2 Likes

Hi Sky020,

That’s a really good explanation of this :grinning:

What does Array.prototype mean in the context of this challenge? Does it mean that you declare a function that can only be used as a method of an array?

Well, let us look at another example:

// Prior to ES6, JavaScript had no 'class' keyword, so you
// can think of the following implementation of a function
// as a class.
function Human(name) {
  this.name = name;
  this.species = 'Mammal';

  this.likesFood = function() {
    return true;
  }
}
// Now, I create some new instances of Human:
const nerdifico = new Human('Nerdifico');
const sky = new Human('Sky');

nerdifico.likesFood() // refers to nerdifico's function
sky.likesFood() // refers to sky's function

Now, in memory, we each have our own name and species property (even if the value is the same). Importantly, we each have our own likesFood function. However, this is not scalable, best-practice, nor necessary.

We can create a prototype associated with the base class (technically, function) so that it is not a unique function for each and every new (important) instance, but is a universal function:

function Human(name) {
  this.name = name;
  this.species = 'Mammal';
}
Human.prototype.likesFood = function() {
  return true;
}
const nerdifico = new Human('Nerdifico');
const sky = new Human('Sky');

nerdifico.likesFood() // refers to Human's method
sky.likesFood() // refers to Human's method

Please understand: This is simplified, as I do not have an internal understanding of JavaScript’s working.

I hope this helps, though…

P.S. What helped me a lot with understanding this, prototype, class, the general OOP principles possible in JS, was a channel on YouTube called The Coding Train. The owner does some brilliant Coding Challenges where he often makes use of this.

1 Like

Hi Sky020,

This is a really clear and useful explanation!

As I get it, by declaring Human.prototype.likesFood we create a function that we can reuse in any instance of Human, instead of creating a new one every time we create a new Human. And this way we can economize the resources of our computer. Is it right?

Then, in the previous example, when we declare Array.prototype.myFilter, we create a function that we can reuse with any Array that we want. Am I right?

Thanks a lot! :slight_smile:

I am glad that helps.

Yes, attaching a method to a prototype binds the method to that object type (in this case, all arrays). So, anytime an array is created, it inherits the method myFilter.

wooooow. nice explanation all over…let me see the ytube channel fast. i need to break javascript head in all possible way