What does the leading semicolon in JavaScript libraries do ?

Semicolons in JavaScript divide the community. Some developers prefer to use them always. Few developers want to avoid them. In some cases, omitting them may lead to bad consequences. A semicolon is required When two statements are on the same line. So if you’re going to put two statements on the same line, you have to separate them with a semicolon. The semicolon is only obligatory when you have two or more statements on the same line. One should have a good practice of using a semicolon to avoid bugs.

Syntax:

// Semicolon compulsory
let i = 0; i++  

The main purpose of a leading semicolon is the indication of insurance, i.e. if in case the library is embedded in any other code maybe a buggy one, so it will treat the latest statement as the last statement. In other words, the purpose of this semicolon is to avoid an error if one file is concatenated with another file. 

Because the problem is that it could be interpreted as a continuation of the statement before. Therefore, a leading ‘;’ is used in front of JavaScript libraries to prevent errors when we are appending any file during concatenation to a file containing an expression that is not properly terminated with a semicolon. JavaScript semicolons are optional & it can be possible because JavaScript does not strictly require semicolons, as it’s a background process (automatic semicolon insertion), which will automatically add it whenever required. So unlike any other languages like C, it is not compulsorily required to use a semicolon at the end of statements, instead, it is optionally one here. It is the job of a JavaScript interpreter to add the semicolons intelligently when it runs any code. But if we are talking about concatenating two or more files, so in order to avoid errors, we must put a semicolon in front of JavaScript libraries. A library in JavaScript shows a function, which begins with a semicolon 
Syntax:

;(function ){
    
}

Example 1:  In this example, we will not use semicolon in the first code and will use in the second code.



javascript

filter_none

edit
close

play_arrow

link
brightness_4
code

let userName = 'Deeksha';
  
function showMessage() {
  let message = 'hey, ' + userName;
  console.log(message);
    
}
function ReadMessage() {
  let read = 'You are promoted, ' + userName;
  console.log(read);
   
}
  
// When we are concatenating without 
// a semicolon
showMessage()
ReadMessage()

chevron_right


Output:

hey, Deeksha
You are promoted, Deeksha

javascript

filter_none

edit
close

play_arrow

link
brightness_4
code

let userName = 'Deeksha';
  
function showMessage() {
  let message = 'hey, ' + userName;
  console.log(message);
    
}
function ReadMessage() {
  let read = 'You are promoted, ' + userName;
  console.log(read);
   
}
  
// When we are concatenating with 
// a semicolon
;showMessage();ReadMessage()

chevron_right


Output: 

hey, Deeksha
You are promoted, Deeksha

Example  2: 

  • Syntax: Let’s take a JavaScript file with a variable
var animal= ”Tiger”
  • Syntax: Now, let’s take another JavaScript file with a function: 
(function(){})()

Now, it works well if you concatenate both the files separately but it may give an error if you concatenate them as is frequently done to reduce the number of requests. 

javascript

filter_none

edit
close

play_arrow

link
brightness_4
code

var animal = "Tiger";
  
function fun() {
  animal = "Tiger";
  console.log(animal)
    
}
fun();
  
var animal = "Tiger";(function(){})()

chevron_right


Output: 

Tiger

javascript

filter_none

edit
close

play_arrow

link
brightness_4
code

var animal = "Tiger";
  
function fun() {
  animal = "Tiger";
  console.log(animal)
    
}
fun();
  
var animal = "Tiger"(function(){})()

chevron_right


Output: 

Tiger
/home/tim/Personal/Semifinished/index.js:10
var animal = "Tiger"(function(){})()
                    ^

TypeError: "Tiger" is not a function

Note: In the above process , the engine is trying to call the result of (First)() but with argument Second. Therefore, it is important to add a semicolon in front of JavaScript libraries to delimit the statements fix the problem.

full-stack-img




My Personal Notes arrow_drop_up


If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.