Image for post
Image for post

Menggunakan Titik-Koma Atau Tidak pada Javascript

1. Prolog

Kata semicolom/titik-koma (;) saya teringat dengan bang Sandhika Galih dalam akun youtube nya @webprogramingunpas dia memiliki ciri khas atau tagline yakni “jangan lupa titik-koma”. Kalimat tersebut selalu diucapkan oleh dia diakhir episode vidionya. Namun kita tidak akan membahasnya lebih dalam, kita fokus saja dengan titik-koma pada javascript. kebetulan saya termasuk programmer yang mengabaikan titik-koma ketika berhadapan dengan javascript.

Pada tahun 2018 saya mulai memutuskan untuk mempelajari javascript lebih dalam, saya meninggalkan bahasa pemograman PHP. Karena saya merasa tidak perlu memperlajari banyak bahasa pemograman dalam develop website baik itu pada sisi front-end maupun back-end. Untuk urusan back-end sudah ada node.js. Pada saat proses pembelajaran saya menemukan suatu referensi dari instruktur saya bahwa javascript tidak terlalu membutuhkan titik-koma. Oleh karena itu saya mencoba menghilangkan titik-koma pada tiap kode saya. karena menurut saya tanpa titik-koma kode menjadi lebih bersih dan enak untuk di baca.

Titik-koma javascript adalah suatu pilihan atau optional, boleh digunakan atau tidak digunakan. dalam javascript tanpa menggunakan titik-koma program tidak akan ada error ketika proses debug. Bagi anda tidak menggunakan titik-koma pada javascript, proses ini disebut dengan Automatic Semicolon Insertion yaitu javascript menambahkan sendiri titik-koma secara otomatis.

Tapi untuk itu ada beberapa aturan yang mesti ditaati dalam penerapan tidak menggunakan titik-koma pada akhir statment, kita akan membahas aturan-aturan tersebut.

2. Rule/Aturan tanpa titik-koma pada javascript

berikut ini adalah uraian mengenai titik-koma pada javascript beserta contoh tanpa penggunaan titik-koma:

a. Ketika baris kode terpenuhi maka tidak membutuhkan titik-koma. ada baiknya anda melihat contoh sebagai berikut

Image for post
Image for post

kode diatas terlihat bahwa variabel nama telah memiliki nilai dengan tipe data string. jadi kebiasaan saya dalam hal ini tidak menambahkan titik-koma.

b. ketika pada baris berikutnya dapat memecah kode tidak memerlukan titik-koma, untuk contoh bisa dilihat dibawah ini.

Image for post
Image for post

pada kode diatas dapat dilihat bahwa baris kedua memecah kode pada baris pertama pasalnya kode pertama mendeklasi kan variable nama dan telah terisikan nilai sedangkan baris kedua juga mendeklarasikan suatu variable baru dengan nama kota jadi keyword const adalah sebagai pemisah kode pada baris satu ke baris baru kedua.

c. Penulisan setelah kurung kurwal “{ }” tidak memerlukan titik-koma, sebagai contoh penggunaannya

Image for post
Image for post

atau pada pengkondisian kita tidak memerlukan titik-koma setelahnya

Image for post
Image for post

d. Keyword return pada baris kodenya. untuk return sendiri tidak memerlukan titik-koma karena javascript secara otomatis menambahkannya. contoh

Image for post
Image for post

baris ke-dua tidak diakhiri dengan titik koma setelah mengembalikan nilai dengan tipe data string.

namun hati-hati saat penggunaannya karena kode yang kita tulis tidak sesuai dengan harapan apabila kita mengembalikan suatu nilai tidak satu baris. contohnya sebagai berikut

akan menghasilkan undefined karena javascript telah menyisipkan titik-koma pada keyword return terlebih dahulu

untuk solusi permasalahan tersebut anda dapat meletakan pembuka kurung kurawal pada keyword return

Image for post
Image for post

sehingga javascript menganggap fungsi buah mengembalikan nilai objek dengan property namaBuah yang bernilai Apel.

e. Setelah tanda kurung “( )” saya tidak menggunakan titik-koma,pada kasus ini saya mencontohkan dengan penggunaan do{…}while(…) dan function( ){…}

Image for post
Image for post

contoh berikutnya dengan penggunaan invoke function.

Image for post
Image for post

f. Ketika berada satu baris kode dengan keywordcontinue tidak memerlukan titik-koma

Image for post
Image for post

g. Ketika berada satu baris kode dengan keywordbreak tidak memerlukan titik-koma

Image for post
Image for post

h. Ketika berada satu baris kode dengan keywordthrow tidak memerlukan titik-koma

Image for post
Image for post

3. Kejadian yang Tidak Terduga!

jika kita mengabaikan aturan-aturan diatas akan mendapatkan bug pada code yang telah kita buat seperti pada kasus berikut

Image for post
Image for post

akan muncul error Cannot read property 'foreach' of undefined ini disebabkan karena baris kode ke-lima tidak memecah kode sehingga javascript membaca kode tersebut menjadi

Image for post
Image for post

ini adalah kasus yang kedua, muncul error tanpa penggunaan titik-koma

Image for post
Image for post

disana disebutkan bawa “b” bukanlah sebuah function, jadi java script membaca kode kita sebagai berikut

Image for post
Image for post

4. Kesimpulan

a. berhati-hati kertika menggunakan keyword break / throw / return / continue saat mengembalikan suatu nilai karena jika kode tidak berada dalam satu baris javascript secara otmatis menambahkannya, contoh nya ada pada point return yang telah kita bahas.

b. Pastikan dalam memulai suatu kode tidak diawali dengan tanda kurung kurawal “{ }” karena javascript akan membaca kode terakhir sebagai objek, atau memulai baris pertama dengan kurung siku “[ ]” ini juga akan menyebabkan javascript membaca kode sebagai lanjutan dari sebelumnya sebagai array, begitu juga dengan kurung “( )”

5. Saran

Karena titik-koma bersifat optional, jadi tidak ada kewajiban untuk menggunakannya atau tidak menggunakannya. namun pada kondisi tertentu mungkin kita lebih nyaman menggunakan titik-koma. pengalaman pribadi saya saat saya mengikuti kelas node.js instruktur saya tidak menggunakan titik-koma. namun sebaliknya terjadi pada saat saya mengikuti kelas vue.js instruktur saya menggunakan titik-koma. Apabila anda berkerja dengan tim sebaiknya di rundingkan terlebih dahulu lebih baik menggunakan titik-koma atau tidak pada kode yang akan kalian bangun.

sumber :

https://flaviocopes.com/javascript-automatic-semicolon-insertion/

http://www.ecma-international.org/ecma-262/5.1/#sec-7.9

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store