sai saran
sai saran

Reputation: 117

Explain how this function works

let a = () => {
  return ((b) => alert(b))("hello");
};

a();

This function alerts "hello", please explain to me how this works and what type of a function this is?

Upvotes: 0

Views: 140

Answers (4)

Mark Schultheiss
Mark Schultheiss

Reputation: 34158

Arrow functions: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

IIFE: https://developer.mozilla.org/en-US/docs/Glossary/IIFE

Same as

let a = () => {
  return ((b) => alert(b))("hello");
};

a();

a is a named function let a =

a is an arrow function () => {}

a is a parameter-less arrow function since the parenthesis is empty ()

((b) => alert(b))("hello"); is an immediately invoked function since it is inside the ()

(b) => alert(b) is an arrow function with parameter b that alerts the b value

((b) => alert(b))("hello"); gets the value "hello" since the ("hello") passes the immediately invoked function using that value as the parameter value for b

So given all that, let's see some examples:

let a = () => {
  return ((b) => alert(b))("hello");
};

a();

// same net effect
((b) => alert(b))("hellos");

// same net effect
alert("hellosa");


(function(x){alert(x)})("hello Me")

// https://developer.mozilla.org/en-US/docs/Glossary/IIFE

let af = function() {
  return ((b) => alert(b))("helloaf");
};

af();

let na = function(nb) {
  return ((b) => alert(b))(nb);
};

na("hellob");


let nab = function(nbb) {
  return function(bi){alert(bi);}(nbb);
};

nab("hellobb");



function nab2(nbb) {
  return function(bi){alert(bi);}(nbb);
};

nab2("hello2");

/* two functions */
function sayHi(bi){
  alert(bi);
}

function nab3(nbbn) {
  return sayHi(nbbn);
};

nab3("hello3");

Upvotes: 1

Zartant
Zartant

Reputation: 107

Let's focus on the

((b) => alert(b))("hello");

first. ((b) => alert(b)) is a function that take a parameter b, and return alert(b). And the ("hello") here, is a parameter that is send to this function.

Soo, about this whole expression. I can present another form that'll work

let a = () => {
    ((b) => alert(b)) ("hi")
}
a()

here you don't even have to have a return. Alert return nothing anyway. So basically, in this block, you define a function a, that take no parameters, and execute the code that i already explained.

Upvotes: 1

Valdrinium
Valdrinium

Reputation: 1416

(b) => alert(b) is an arrow function

((b) => alert(b)) our arrow function is actually an anonymous function expression, and we need to wrap it between parentheses in order to invoke it in place

((b) => alert(b))("hello") we pass "hello" as an argument to our function when invoking it

() => { return ... } is yet another anonymous arrow function, except this time, instead of invoking the function in place, we store in a variable named a so that we can invoke it later

a() calls the previously stored function, which in turn calls (b) => alert(b) with the argument "hello" which in turn calls alert("hello")

Upvotes: 2

Mitya
Mitya

Reputation: 34556

It's a function which, inside, calls an immediately-invoked function expression (IIFE) - i.e. a function that is declared and called in the same line.

The return does nothing (it returns the return value from the alert(), which is undefined; nothing is listening for the return.)

Both the outer function and the IIFE use what's called arrow functions - short-syntax functions that don't have their own this context.

The whole thing could be reduced to simply:

let a = () => alert('hello');
a();

Upvotes: 3

Related Questions