CODEWITHSUNDEEP
javascript
Arms Wide Open
Arms Wide Open

Reputation: 35

JavaScript : What does the " x(x)(v) " syntax mean?

While doing some reading on the necessity of type checking and enjoying Eric Elliot's approach to functional programming, I decided to revisit arrow functions. With this in mind I found a great 2015 article on MDN Hacks by Jason Orendorff 'ES6 In Depth: Arrow functions'. Towards the end of the article I come across the lambda-calculus example, transpiled to ES6 with arrow functions as follows:

Here is an example of the sort of “program” a mathematician could write, using Church’s λ notation:

fix = λf.(λx.f(λv.x(x)(v)))(λx.f(λv.x(x)(v)))

The equivalent JavaScript function looks like this:

var fix = f => (x => f(v => x(x)(v)))
               (x => f(v => x(x)(v)));

I should also add that I've tried the Babel transpiler on the code and it still returns pretty much the same kind of syntax as in x(x)(v):

var fix = f => (x => f(v => x(x)(v)));

is transpiled to

"use strict";

var fix = function fix(f) {
  return function (x) {
    return f(function (v) {
      return x(x)(v);
    });
  };
};

The part that puzzles me is the function (v) { return x(x)(v) } part and x(x)(v) in particular? What does this syntax mean?

There has got to be something simple that eludes me, but I can't seem to find an answer anywhere. Your advice is greatly appreciated. Thank you!

Upvotes: 0

Views: 160

Answers (2)

Arms Wide Open
Arms Wide Open

Reputation: 35

Upon conducting more research into the subject of what exactly is this syntax and how it properly works, I have found that x(x)(v) is a mere IIFE (Immediately Invoked Function Expression). I believe Babel would not transpile it because it is a legacy notation. As James mentioned in the comments to the original question "This type of behavior has been in javascript since a long time ago".

If you want more information, you'll just have to word your search right, knowing the above. While MDN's page on IIFEs is scarce to say the least, the 'quick example' mentioned there should steer you in the right direction. A similar question, therefore was answered on stackoverflow before with "Passing Arguments to IIFE", as well as on quora with "What are the end-parameters of an immediately-invoked function expression for?".

The part that will throw most people off with this particular question of 'what is x(x)(v) syntax?' is the absence of parenthesis around x(x), like so:

x(x)(v) == (x(x))(v)

Now this is completely different and most people now will know straight away, that (v) is just an argument to the x(x) IIFE.

For the simplest of examples, just try out this piece of code:

function x (val) {return (val)};

var v = "v_variable";

console.log(x(x)(v));

or this snippet:

function x (val) {return (val)};

function fix (v) {
  var v = "I am the result variable, successfully returned by the x(x)(v) IIFE";
  return x(x)(v)
//  return (x(x))(v)
};

document.getElementById("demo").innerHTML = fix();
<!DOCTYPE html>
<html>
<body>

<h3>Ivoking x(x)(v) IIFE returns the same result as the generally accepted and widely known (x(x))(v) IIFE notation</h3>

<p id="demo"></p>

</body>
</html>

Upvotes: 0

FeifanZ
FeifanZ

Reputation: 16316

x(x)(v) is two chained function calls. x(x) returns a function, which is then called with v as an argument. This is equivalent to:

const y = x(x);  // y is a function
y(v);

Concrete example:

const x = function(foo) { return function(bar) { console.log(bar); } };
const y = x(x);
y(v);

Upvotes: 1

Related Questions