Ka Tech
Ka Tech

Reputation: 9457

Typescript/JavaScript forEach

I'm doing a tutorial on lexical scope handling by Typescript and I've come across the use of a function which I have never seen before. Which looks like an empty function in a forEach statement. In typescript it looks like this:

fns.forEach(fn=>fn());

In javascript it looks like:

fns.forEach(function (fn) { return fn(); });

I've never seen a function used like this. Can someone explain how this works? To be specific, what is fn=>fn() actually executing. In reference to the code below, is it executing the fns.push or for loop? If it is the For Loop there's no reference to this so how does it know?

Below is the full code:

TypeScript:

var fns = [];
for(var i=0;i<5;i+=1){
    fns.push(function(){
        console.log(i);
    })
}
fns.forEach(fn=>fn());

JavaScript

var fns = [];
for (var i = 0; i < 5; i += 1) {
    fns.push(function () {
        console.log(i);
    });
}
fns.forEach(function (fn) { return fn(); });

Upvotes: 5

Views: 301

Answers (3)

Amir Popovich
Amir Popovich

Reputation: 29836

Check out this example:

var method = a => a+1;

method is a var that holds a reference to a function.
a is the input param.
a+1 is the methods body and return type.

Typescript will transpile this into:

var method = function (a) { return a + 1; };

Check out the typescript playground example and you will understand the concept pretty fast.

In your example fns is an array of functions.

doing fns.forEach(fn=>fn()); means execute each method in the fns array.

Upvotes: 3

Adrian Brand
Adrian Brand

Reputation: 21628

fn => fn() is a function definition, in C# they are called Lambda expressions and it is just syntactic sugar for the same function (fn) { return fn(); }.

fn is the input parameter, and => defines it as a function and the fn() is the return value.

Another example is

var add = (a,b) => a + b;

is the same as

function add(a, b) { 
    return a + b;
}

Upvotes: 3

user6269864
user6269864

Reputation:

It is looping through an array of functions, because functions can be stored inside variables just like strings, integers etc. So you're looping through an array of functions and executing them like this: return fn();

Upvotes: 2

Related Questions