JavaScript tidak memiliki panduan gaya pengkodean otoritatif, tetapi sebaliknya itu adalah beberapa gaya pengkodean yang populer:
Salinan kode adalah sebagai berikut:
Panduan Gaya JavaScript Google (selanjutnya disebut sebagai Google)
http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml
Gaya penyandian NPM (selanjutnya disebut sebagai NPM)
https://npmjs.org/doc/coding-style.html
Panduan Gaya Felix Node.js (selanjutnya disebut sebagai Node.js)
http://nodeguide.com/style.html
Javascript Idiomatik (selanjutnya disebut sebagai idiomatik)
https://github.com/rwldrn/iiomatic.js/
Panduan Gaya JavaScript JQuery (selanjutnya disebut sebagai jQuery)
http://contribute.jquery.org/style-guide/js/
Panduan Gaya Javascript Douglas Crockford (selanjutnya disebut Crockford), Douglas Crockford adalah salah satu otoritas teknis paling terkenal di bidang pengembangan web dan anggota Komite Standardisasi ECMA Javascript 2.0
http://javascript.crockford.com/code.html
Tentu saja, ada juga beberapa pilihan pengaturan default di JavaScript Sintaks Checkers JSlint dan JShint. Pertanyaannya adalah, apa gaya pengkodean JavaScript utama yang sebagian besar pengembang dapat diikuti? Mari kita temukan beberapa gaya konsensus dari 6 panduan gaya di bawah ini.
1. Perbandingan Gaya Kode
1.1 Indentasi
Dua spasi, tidak lagi indentasi, tidak ada indentasi tab: Google, NPM, Node.js, Idiomatic
Tab Indent: JQuery
4 Spaces: Crockford
1.2 Ruang antara parameter dan ekspresi
Gunakan gaya ringkas: Google, npm, node.js
Salin kode sebagai berikut: Project.myclass = function (arg1, arg2) {
Terlalu banyak menggunakan spasi: idiomatik, jQuery
Salin kode sebagai berikut: untuk (i = 0; i <panjang; i ++) {
Tidak ada komentar: Crockford
Dalam sebagian besar panduan, pengembang diingatkan untuk tidak memiliki ruang di akhir pernyataan.
1.3 Panjang baris kode
Hingga 80 karakter: Google, NPM, Node.js, Crockford (ketika dalam blok kode, indentasi lain kecuali 2 spasi memungkinkan parameter fungsi diselaraskan dengan posisi parameter fungsi pertama. Opsi lain adalah menggunakan 4 spasi untuk indentasi saat membungkus garis alih -alih 2.)
Tidak ada komentar: jQuery, idiomatik
1.4 Semi-Kolon
Selalu gunakan titik koma, tidak mengandalkan sisipan implisit: google, node.js, crockford
Jangan gunakan Harapan: NPM dalam beberapa kasus
Tidak ada komentar: jQuery, idiomatik
1.5 Komentar
Ikuti Konvensi JSDOC: Google, Idiomatik
Tidak ada komentar: npm, node.js, jQuery, crockford
1.6 Kutipan
Kutipan tunggal yang disarankan: Google, node.js
Kutipan Ganda: JQuery
Tidak ada komentar: NPM, Idiomatic, Crockford
1.7 Deklarasi Variabel
Menyatakan satu per satu tanpa menggunakan koma: node.js
Salinan kode adalah sebagai berikut:
var foo = ";
var bar = ";
Deklarasikan banyak sekaligus, gunakan koma untuk terpisah di akhir baris: idiomatik, jQuery
Salinan kode adalah sebagai berikut:
var foo = "",
bar = "",
quux;
Gunakan koma di awal baris: NPM
Tidak ada komentar: Google, Crockford
1.8 kawat gigi
Gunakan kawat gigi pembuka di baris yang sama: Google, npm, node.js, idiomatic, jQuery, crockford
Salin kode sebagai berikut: function thisisblock () {
Panduan NPM menyatakan bahwa hanya menggunakan kawat gigi ketika blok kode perlu menyertakan baris berikutnya, jika tidak itu tidak akan digunakan.
1.9 Variabel Global
Jangan gunakan variabel global: Google, Crockford (Google mengatakan konflik penamaan variabel global sulit untuk debug, dan mungkin memiliki beberapa masalah rumit ketika dua proyek diintegrasikan. Untuk memfasilitasi berbagi kode javascript umum, konvensi perlu dilakukan untuk menghindari konflik. Crockford percaya bahwa variabel global implisit tidak boleh digunakan.)
Tidak ada komentar: idiomatik, jQuery, npm, node.js
2 gaya penamaan
2.1 Penamaan Variabel
Kata pertama di awal adalah huruf kecil, dan huruf pertama dari semua kata setelah itu adalah huruf besar: Google, npm, node.js, idiomatik
Salinan kode adalah sebagai berikut:
var foo = "";
var fooname = "";
2.2 Penamaan Konstan
Gunakan huruf kapital: Google, npm, node.js
Salinan kode adalah sebagai berikut: var cons = 'value';
Tidak ada komentar: jQuery, idiomatic, crockford
2.3 Fungsi Penamaan
Kata pertama di awal adalah huruf kecil, dan huruf pertama dari semua kata setelah itu adalah huruf besar (unta): Google, npm, idiomatic, node.js (disarankan untuk menggunakan nama fungsi deskriptif yang panjang)
Salinan kode adalah sebagai berikut:
fungsi sangat longolasi nama
fungsi pendek () ..
Fungsi penamaan dalam bentuk kata kunci:
Salinan kode adalah sebagai berikut:
fungsi isready ()
function setName ()
function getName ()
Tidak ada komentar: jQuery, Crockford
2.4 Penamaan Array
Gunakan bentuk jamak: idiomatik
Salinan kode adalah sebagai berikut: var documents = [];
Tidak ada komentar: Google, jQuery, npm, node.js, crockford
2.5 Penamaan Objek dan Kelas
Gunakan formulir berikut: Google, NPM, Node.js
Salinan kode adalah sebagai berikut:
var thisisObject = tanggal baru;
Tidak ada komentar: jQuery, idiomatic, crockford
2.6 Penamaan lainnya
Gunakan All-Lower-Hyphen-CSS-Case untuk nama file panjang dan kunci konfigurasi: NPM
3. Konfigurasikan file .jshintrc sesuai dengan gaya di atas
JShint (http://www.jshint.com/) adalah sintaks JavaScript dan alat pemeriksaan gaya yang dapat Anda gunakan untuk mengingatkan masalah terkait gaya kode. Ini dapat diintegrasikan dengan baik ke dalam banyak editor yang umum digunakan dan merupakan alat yang hebat untuk menyatukan gaya pengkodean tim.
Anda dapat melihat opsi yang tersedia melalui dokumentasi JShint: http://www.jshint.com/docs/#options
Berikut ini adalah membuat file .jshintrc berdasarkan gaya pertama di bawah masing -masing kategori di atas. Anda dapat meletakkannya di direktori root proyek, dan editor kode JShint-Avare akan menyatukan semua gaya kode dalam proyek menurutnya.
Salinan kode adalah sebagai berikut:
{
"Camelcase": Benar,
"Indent": 2,
"Undef": Benar,
"quotmark": lajang,
"Maxlen": 80,
"trailing": Benar,
"Curly": Benar
}
Selain itu, Anda harus menambahkan header berikut ke file JavaScript Anda:
Salinan kode adalah sebagai berikut:
/ * jshint browser: true, jQuery: true */
Di file Node.js yang harus Anda tambahkan:
Salinan kode adalah sebagai berikut:
/ *node jshint: true */
Anda juga dapat menambahkan pernyataan berikut di berbagai file JavaScript:
Salinan kode adalah sebagai berikut:
'Gunakan ketat';
Ini akan mempengaruhi JShint dan mesin JavaScript Anda dan mungkin tidak begitu kompatibel, tetapi JavaScript akan berjalan lebih cepat.
4. Secara otomatis mengeksekusi jshint sebelum melakukan git
Jika Anda ingin memastikan bahwa semua kode JS konsisten dengan gaya yang didefinisikan dalam .JShINTRC, Anda dapat menambahkan yang berikut ini ke file .git/hooks/pra-komit Anda, dan pemeriksaan gaya akan secara otomatis dilakukan ketika Anda mencoba mengirimkan file yang baru dimodifikasi ke proyek.
Salinan kode adalah sebagai berikut:
#!/Bin/Bash
# Pra-komit kait git untuk menjalankan JShint pada file JavaScript.
#
# Jika Anda benar -benar harus berkomitmen tanpa pengujian,
# Gunakan: git komit-no-verifikasi
FileNames = ($ (Git Diff --Cached--name-only head)))
JShint &> /dev /null mana
jika [$? -Ne 0];
Kemudian
Echo "Kesalahan: JShint tidak ditemukan"
Echo "Instal dengan: Sudo NPM Instal -Gshint"
Keluar 1
fi
untuk saya di "$ {fileNames [@]}"
Mengerjakan
if [[$ i = ~ /.js$]];
Kemudian
Echo Jshint $ i
JShint $ i
jika [$? -Ne 0];
Kemudian
Keluar 1
fi
fi
Selesai