Apa yang dilakukan dengan tanda titik koma di pustaka JavaScript?


156

Di beberapa perpustakaan JavaScript saya melihat notasi ini di awal:

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

Sementara saya sangat nyaman dengan sintaks "fungsi yang segera dieksekusi"

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

Saya bertanya-tanya untuk apa tanda koma itu. Yang bisa saya pikirkan hanyalah asuransi. Artinya, jika perpustakaan tertanam dalam kode lain, kereta, itu berfungsi sebagai "pernyataan terakhir berakhir di sini" jenis terbaru dari benjolan kecepatan.

Apakah ada fungsi lainnya?


Jawaban:


140

Ini memungkinkan Anda untuk menggabungkan beberapa file JavaScript dengan aman menjadi satu, untuk menyajikannya lebih cepat sebagai satu permintaan HTTP.


16
Tapi itu tidak perlu, jika semua file akan dikodekan dengan benar, bukan?
Boldewyn

8
Tidak: Dalam contoh Anda, Anda akan mendapatkannya (function(){...})()(function(){...})().
Aaron Digulla

8
Maksud saya dengan 'dikodekan dengan benar', bahwa setiap perpustakaan diakhiri dengan jumlah yang benar dari tanda titik koma ...
Boldewyn

6
Ya Boldewyn, tapi bukan itu masalahnya.
Mathias Bynens

13
Dua file berkode buruk tidak akan cocok hanya dengan fakta bahwa file ketiga berisi perbaikan kotor ini. Mengapa konkatator tidak dapat menambahkan titik koma tambahan di antara file dalam hasil?
Dávid Horváth

30

Jawaban terbaik sebenarnya diberikan dalam pertanyaan, jadi saya hanya akan menuliskannya di sini untuk kejelasan:

Yang terdepan ;di depan ekspresi fungsi yang segera dipanggil ada untuk mencegah kesalahan saat menambahkan file selama penggabungan file yang berisi ekspresi yang tidak diakhiri dengan benar dengan a ;.

Praktik terbaik adalah menghentikan ekspresi Anda dengan titik koma, tetapi juga menggunakan titik koma sebagai pengamanan.


Mengapa juga mengakhiri ekspresi Anda dengan titik koma, jika Anda menggunakan titik koma defensif? Entah Anda mengambil kesempatan untuk mengandalkan titik koma yang ada di akhir setiap baris, atau Anda menggunakan titik koma defensif. Melakukan keduanya membuat orang salah menyimpulkan bahwa ada alasan untuk melakukan keduanya. Saran untuk menggunakan titik koma defensif adalah baik; saran untuk mengganti setiap contoh "\n"dengan ";\n"tidak masuk akal.
Vladimir Kornea

4
@VladimirKornea: karena Anda tidak selalu hanya menggunakan perpustakaan Anda sendiri :)
jvenema

@ jvenema Saya tidak tahu mengapa Anda berpikir itu membuat perbedaan.
Vladimir Kornea

6
Karena Anda tidak dapat mengandalkan kode orang lain mengikuti konvensi Anda. Kode bertahan dan Anda tidak perlu melakukannya.
jvenema

1
@VladimirKornea Anda bisa menganggap itu sebagai defensif juga, jika Anda mau - itu membela terhadap kode orang lain yang tidak selalu dimulai dengan titik koma defensif.
Nathan Hinchey

26

Secara umum, jika pernyataan dimulai dengan (, [, /, +, atau -, ada kemungkinan bahwa pernyataan itu dapat ditafsirkan sebagai kelanjutan dari pernyataan sebelumnya. Pernyataan yang dimulai dengan /, +, dan - sangat jarang dalam praktiknya) , tetapi pernyataan yang diawali dengan (dan [tidak jarang sama sekali, setidaknya dalam beberapa gaya pemrograman JavaScript. Beberapa programmer suka meletakkan tanda titik koma di awal pernyataan seperti itu sehingga akan terus bekerja dengan benar bahkan jika pernyataan itu sebelum dimodifikasi dan tanda titik koma yang dihapus sebelumnya dihapus:

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

Sumber:

JavaScript: Panduan Definitif, edisi ke-6


9

Ini disebut sebagai titik koma terkemuka.

Tujuan utamanya adalah untuk melindungi diri dari kode sebelumnya yang ditutup secara tidak benar, yang dapat menyebabkan masalah. Tanda titik koma akan mencegah hal ini terjadi. Jika kode sebelumnya ditutup tidak semestinya maka titik koma kami akan memperbaikinya. Jika ditutup dengan benar maka titik koma kami tidak akan berbahaya dan tidak akan ada efek samping.


7

Jawaban satu baris adalah menggabungkan beberapa file JavaScript dengan aman. Menggunakan titik koma tidak menimbulkan masalah.

Misalkan Anda memiliki beberapa fungsi:

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

Pada penggabungan mungkin terlihat seperti:

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

Tetapi jika Anda menambahkan titik koma sebelum fungsi itu akan terlihat seperti:

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

Jadi dengan menambahkan a ;, berhati-hatilah jika ekspresi apa pun tidak diakhiri dengan benar.

Contoh 2

Asumsikan Anda memiliki file JavaScript dengan variabel:

var someVar = "myVar"

File JavaScript lain dengan beberapa fungsi:

(function(){})()

Sekarang pada penggabungan akan terlihat seperti

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

Dengan titik koma, akan terlihat seperti:

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

4

Ada baiknya saat Anda memperkecil kode JavaScript. Ini mencegah kesalahan sintaks yang tidak terduga.


Seperti apa? Apakah koma ada artinya untuk kode berikut atau hanya untuk kode kereta hipotetis digabung di depan perpustakaan yang sebenarnya?
Boldewyn

Dalam, kode-kode itu saja, tidak ada makna khusus, tetapi ketika kode itu berada di tengah-tengah kode lain dan ketika Anda mengecilkannya menjadi satu baris, mungkin ada kesalahan tak terduga, seperti (1) titik koma tidak ada pada baris sebelumnya, (1 ) yang sebelumnya juga berfungsi sehingga akan menjadi () () () (), ketika mendapatkan kesalahan, sulit untuk debug, kami tidak bisa mengatakan itu buggy, karena sebelum minify itu berjalan dengan baik.
ANDA

1
Tapi tentunya itu adalah tanggung jawab dari minifier untuk menangani ini dengan benar. Apakah kereta mini adalah norma saat ini?
Vladimir Kornea
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.