Cosa fa il punto e virgola principale nelle librerie JavaScript?

In diverse librerie JavaScript ho visto questa notazione all'inizio:

/**
 * Library XYZ
 */
;(function () {
  // ... and so on

Mentre mi trovo perfettamente a mio agio con la sintassi della "funzione eseguita immediatamente"

(function(){...})()

Mi chiedevo a cosa servisse il punto e virgola principale. Tutto quello che ho potuto escogitare è che si tratta di un'assicurazione. Vale a dire, se la libreria è incorporata in un altro codice errato, funge da "l'ultimo enunciato finisce qui all'ultimo" tipo di speed bump.

Ha qualche altra funzionalità?

Ti consente di concatenare in modo sicuro più file JavaScript in uno, per servirlo più velocemente come una richiesta HTTP.

La migliore risposta è stata effettivamente data nella domanda, quindi scriverò qui per chiarezza:

Il primo ;di fronte alle espressioni di funzione immediatamente invocate è lì per prevenire errori quando si aggiunge il file durante la concatenazione a un file contenente un'espressione non correttamente terminata con a ;.

È consigliabile terminare le espressioni con punti e virgola, ma utilizzare anche il punto e virgola principale come protezione.

In generale, se un'istruzione inizia con (, [, /, + o -, esiste la possibilità che possa essere interpretata come una continuazione dell'istruzione precedente. Le dichiarazioni che iniziano con /, + e - sono piuttosto rare nella pratica , ma le istruzioni che iniziano con (e [non sono affatto rare, almeno in alcuni stili di programmazione JavaScript. Ad alcuni programmatori piace mettere un punto e virgola difensivo all'inizio di una tale dichiarazione in modo che continui a funzionare correttamente anche se l'istruzione prima che venga modificato e rimosso un punto e virgola precedentemente terminato:

var x = 0 // Semicolon omitted here
;[x,x+1,x+2].forEach(console.log) // Defensive ; keeps this statement separate

Fonte:

JavaScript: The Definitive Guide, 6th edition

Questo è indicato come punto e virgola iniziale.

Il suo scopo principale è proteggersi dal codice precedente che era stato chiuso in modo improprio, il che può causare problemi. Un punto e virgola impedirà che ciò accada. Se il codice precedente è stato chiuso in modo errato, il nostro punto e virgola lo correggerà. Se fosse correttamente chiuso, il nostro punto e virgola sarà innocuo e non ci saranno effetti collaterali.

Una risposta di una riga è quella di concatenare in modo sicuro più file JavaScript. L'uso di un punto e virgola non solleva un problema.

Supponiamo di avere più funzioni:

IIFE 1

(function(){
  // The rest of the code
})(); // Note it is an IIFE

IIFE 2

(function(){
   // The rest of the code
})(); // Note it is also an IIFE

Sulla concatenazione può apparire come:

(function(){})()(function(){})()

Ma se aggiungi un punto e virgola prima della funzione sarà simile a:

;(function(){})();(function(){})()

Quindi aggiungendo un ;, si prende cura se qualsiasi espressione non è correttamente terminata.

Esempio 2

Supponiamo di avere un file JavaScript con una variabile:

var someVar = "myVar"

Un altro file JavaScript con alcune funzioni:

(function(){})()

Ora sulla concatenazione sembrerà

var someVar = "myVar"(function(){})() // It may give rise to an error

Con un punto e virgola, sarà simile a:

var someVar = "myVar";(function(){})()

È utile quando si minimizza il codice JavaScript. Previene errori di sintassi imprevisti.