Why a ```()```at the end of a function

JavaScript
1

Tell us what’s happening:

Guys, I don’t get why at the end of this code it was typed ()

Your code so far

const arr1 = ['JAN', 'FEB', 'MAR', 'APR', 'MAY'];
let arr2;
(function() {
  "use strict";
  arr2 = [...arr1]; // change this line
})();

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.142 Safari/537.36 OPR/62.0.3331.119.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place

1 Like
2

@leoncpaulo That is an IIFE (immediately evoked function expression). It is a function that runs right away. There is no need for the function to be called.

2 Likes
3

The parentheses is where we define argument variables for the function. This function does not take any input so they are empty.

Something like this might help explain how functions are defined.

4

Let start easily when you define a function and want to directly execute it you use the syntax

function test(){

}
test();

this because when you declare a function it doesn’t execute it self automatically he wait for an invocation(as the exemple above) the last () is for execute the fonction directly so

(function test() {

})();

// Becomes:
(test)();

// which becomes too :
test();```
so as the function is directly exected you can ommit the name and or you can save the return value in a variable
2 Likes
5

@leoncpaulo
By the way, here is the ES6 version:

(() => {
  console.log(`Javascript file enabled!`);
})();

You can add something like this to your projects when you first set them up to make sure your the path leading to your to your Javascript file is set up correctly. You will see “Javascript file enabled!” in the console. Then you know the path to the file is set up correctly and that little bit of code can be replaced with the Javascript code that you want to use in your website.

1 Like
6

Here is some more reading material on IIFEs

Speaking JavaScript (ES1–ES5) Introducing a New Scope via an IIFE

It must be an expression

If a statement starts with the keyword function, the parser expects it to be a function declaration (see Expressions Versus Statements). But a function declaration cannot be immediately invoked. Thus, we tell the parser that the keyword function is the beginning of a function expression by starting the statement with an open parenthesis. Inside parentheses, there can only be expressions.

Wikipedia: Immediately invoked function expression Usage

Immediately invoked function expressions may be written in a number of different ways. A common convention is to enclose the function expression – and optionally its invocation operator – with the grouping operator, in parentheses, to tell the parser explicitly to expect an expression. Otherwise, in most situations, when the parser encounters the function keyword, it treats it as a function declaration (statement), and not as a function expression.

(function () { /* ... */ })();
(function () { /* ... */ }());
(() => { /* ... */ })(); // With ES6 arrow functions (though parentheses only allowed on outside)

There are other ways to enforce a function expression:

!function () { /* ... */ }();
~function () { /* ... */ }();
-function () { /* ... */ }();
+function () { /* ... */ }();
void function () { /* ... */ }();

Immediate invocation is not limited to functions, Immediately invoked constructors and object literals

2 Likes