Function within a function

JavaScript
22

In this example, I used the callback function to change the behaviour of printOneToFive() based on what the callback function does.

You should do the same thing inside of your myMap(). Your myMap() should use the callback function to make new array elements out of the old array elements.

23

Ok since it has to return newArray I tried

  for(let i = 0; i < this.length; i++) {
    newArray.push(callback(i));
  }

But I assume since it doesn’t have this it’s not working

24

Here you are using this[i] to access the elements of the array. Your callback needs to act on the elements of your array.

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

is using item when I need this it seems. Isn’t callback just going to plug in return item * 2;

26

What a function chooses to call an argument has nothing to do with the name of the variable you pass into the function.

function printThat(that) {
  console.log(that);
}

let a = 42;
printThat(a);

The same thing can have different names in different scopes.

27

Ok I tried newArray.push(callback[i]); but its not working

Btw if you could answer this one I’d appreciate it

28

Why callback[i]? callback is a function, not an array.

I really don’t understand what you mean by

thinking about functions in functions like this

29

callback is a function that has to be applied to each array item

callback[i] is trying to access the property i on callback

1 Like
30

Ok I don’t know how to apply callback to this (or each array item) but I’m trying different things

Oh ok I first asked this when I tried plugging them into each other like this:

I’m asking if I should plug them in like this.Honestly if anyone is willing to help me over video or something I’ll pay you. This concept alone is killing me and I want to move on

31

how do you call a function with an argument? I’m sure it’s a thing you already did a lot of times

1 Like
32

I already said this is wrong. I have no idea what num(i) is.

I think you have some fundamental misunderstanding about how variables and scope work, but I don’t know what that misunderstanding is.

Do you understand this example?

function printThat(that) {
  console.log(that);
}

let a = 42;
printThat(a);

What will be printed to the console?

33

Just quoted that sorry I got that part.

42 and 9000?

34

Or to expand that example

function printThat(that) {
  console.log(that);
}

// pass a as argument to the function
let a = 42;
printThat(a);

// pass b as argument to the function
let b = 9000;
printThat(b);

The name of the variable inside of the function (that here) and the name of the variable outside of the function (a and b) have nothing to do with each other.

35

You’re replacing that with a and b so

42 and 9000?

If callback already contains item * 2 and the name item vs this don’t matter, then why isn’t callback working?

36

Right. It works the same way in the callback example.

// Print the numbers 1-5 with custom formatting
function printOneToFive(formatterFunction) {
  for (let i = 1; i <= 5; i++) {
    console.log(formatterFunction(i));
  }
}

// A nice formatting function
function makePretty(num) {
  return "--*****--" + num + "--*****--";
}

// A bad formatting function
function makeMessy(num) {
  return "890721498721948" + num + "98127498";
}

// Test
printOneToFive(makePretty);
printOneToFive(makeMessy);

When I call the function printOneToFive() with makePretty as an argument, then internally the function printOneToFive() uses makePretty as formatterFunction.

When I call the function printOneToFive() with makeMessy as an argument, then internally the function printOneToFive() uses makeMessy as formatterFunction.

37

It matters that you use the name that matches the current function scope. For the myMap() method, you need to call the callback function for each array item. The callback function can name it’s arguments whatever it wants, but the myMap() needs to use the callback with every single array element (this[i]).

38

Going on what you had before and using that “gradual abstraction” thing I was doing before, might this help you understand?

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

// *****

Array.prototype.myMap1 = function() {
  var newArray = [];
  for(let i = 0; i < this.length; i++) {
    newArray.push(this[i] * 2);
  }
  return newArray;
};

var new_s1 = s.myMap1();

console.log(new_s1);

// *****

Array.prototype.myMap2 = function() {
  function doubleIt2(item) {
    return item * 2;
  }
  
  var newArray = [];
  for(let i = 0; i < this.length; i++) {
    newArray.push(doubleIt2(this[i]));
  }
  return newArray;
};

var new_s2 = s.myMap2();

console.log(new_s2);

// *****

function doubleIt3(item) {
  return item * 2;
}

Array.prototype.myMap3 = function() {
  var newArray = [];
  for(let i = 0; i < this.length; i++) {
    newArray.push(doubleIt3(this[i]));
  }
  return newArray;
};

var new_s3 = s.myMap3();

console.log(new_s3);

// *****

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

function doubleIt4(item) {
  return item * 2;
}

var new_s4 = s.myMap4(doubleIt4);

console.log(new_s4);

For the first one, the doubling is built into the function. For the second it’s still in the function but abstracted into a local function. The third is the same, but using a global function. The last one just passes that function in as a callback.

Does that help?

39

@JeremyLT @kevinSmith I don’t know why I wasn’t getting that. I ended up using newArray.push((callback(this[i])));. I didn’t realize I could attach a argument to the callback for some reason.

Sadly it’s my second time doing this stuff and it’s really not connecting with me, but you guys are helpful. Can you remind me where we started using functions in functions on the curriculum? I guess all I’ve been able to do when struggling is go back and do it again. Someone online told me to read this but I can’t understand it very well either

@ilenia thank you for commenting.

40

It’s probably first discussed in the functional programming section?

Using functions as arguments to other functions is a bit tricky to get used to at first. Like recursion, the idea of functions as arguments to other functions highlights and complicates any misunderstandings in foundational concepts you may have.

41

Because it’s hard. We’ve all been there.

I didn’t realize I could attach a argument to the callback for some reason.

Yeah, it’s just a reference to a function. In my example above, doubleIt4 and callback are pointing to the same function code. They are “references” or “addresses”. When you call that function and pass in that reference, it just tells callback to point to that and you can use it any way you want - it is a function reference like any other, just use it like you would any other function.