Gunakan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_59 untuk semua referensi Anda; . eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 961, const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 962
mengapa?
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_
Jika Anda harus menetapkan kembali referensi, gunakan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 963 alih-alih const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 960. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_65
mengapa?
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }
Perhatikan bahwa const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 963 dan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 959 memiliki cakupan blok, sedangkan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 960 memiliki cakupan fungsi
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1
Pada kode di atas, Anda dapat melihat bahwa referensi const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 971 dan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 972 akan menghasilkan ReferenceError, sedangkan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 973 berisi nomor. Ini karena const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 971 dan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 972 adalah cakupan blok, sedangkan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 973 adalah cakupan untuk fungsi yang memuat
objek
Gunakan sintaks literal untuk pembuatan objek. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_77
// bad const item = new Object(); // good const item = {};
Gunakan nama properti yang dihitung saat membuat objek dengan nama properti dinamis
mengapa?
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };
Gunakan singkatan metode objek. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_78
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };
Gunakan singkatan nilai properti. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_78
mengapa?
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };
Kelompokkan properti steno Anda di awal deklarasi objek Anda
Mengapa?
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };
Hanya kutip properti yang merupakan pengidentifikasi tidak valid. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_80
mengapa? . Ini meningkatkan penyorotan sintaks, dan juga lebih mudah dioptimalkan oleh banyak mesin JS
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 90
Jangan panggil metode const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_81 secara langsung, seperti const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 982, const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 983, dan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 984. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_85
Mengapa?
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_1
Lebih suka sintaks penyebaran objek di atas const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 988 ke objek salinan dangkal. Gunakan sintaks parameter istirahat objek untuk mendapatkan objek baru dengan properti tertentu dihilangkan. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_89
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_2
array
Gunakan sintaks literal untuk pembuatan array. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_90
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_3
Gunakan Array#push alih-alih penugasan langsung untuk menambahkan item ke array
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_4
Gunakan spread array const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_91 untuk menyalin array
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 95
Untuk mengonversi objek yang dapat diubah menjadi array, gunakan spread const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 991 alih-alih const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 993
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_6
Gunakan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_93 untuk mengonversi objek mirip-array menjadi larik
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_7
Gunakan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_93 alih-alih sebarkan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 991 untuk memetakan iterables, karena ini menghindari pembuatan larik perantara
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_8
Gunakan pernyataan return dalam callback metode array. Tidak apa-apa untuk menghilangkan pengembalian jika badan fungsi terdiri dari pernyataan tunggal yang mengembalikan ekspresi tanpa efek samping, berikut ini. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_97
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_9
Gunakan jeda baris setelah tanda kurung buka dan sebelum tutup array jika array memiliki beberapa baris
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_0
menghancurkan
Gunakan penghancuran objek saat mengakses dan menggunakan beberapa properti objek. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_98
Mengapa? . Mengulang akses objek menciptakan lebih banyak kode berulang, membutuhkan lebih banyak membaca, dan menciptakan lebih banyak peluang untuk kesalahan. Penghancuran objek juga menyediakan satu situs definisi struktur objek yang digunakan dalam blok, daripada harus membaca seluruh blok untuk menentukan apa yang digunakan.
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_1
Gunakan penghancuran array. eslint. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_98
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_2
Gunakan penghancuran objek untuk beberapa nilai kembalian, bukan penghancuran susunan
Mengapa?
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_3
String
Gunakan tanda kutip tunggal // bad var a = 1; var b = 2; // good const a = 1; const b = 2;00 untuk string. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_01
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_4
String yang menyebabkan baris melebihi 100 karakter tidak boleh ditulis di beberapa baris menggunakan penggabungan string
mengapa?
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_5
Saat menyusun string secara terprogram, gunakan string template alih-alih penggabungan. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_02 // bad var a = 1; var b = 2; // good const a = 1; const b = 2;03
mengapa?
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_6
- Jangan pernah menggunakan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_04 pada sebuah string, karena akan membuka terlalu banyak kerentanan. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_05
Jangan serta merta lepas karakter dalam string. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_06
mengapa?
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_7
fungsi
Gunakan ekspresi fungsi bernama alih-alih deklarasi fungsi. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_07
mengapa? . Ini merusak keterbacaan dan pemeliharaan. Jika Anda menemukan bahwa definisi fungsi cukup besar atau kompleks sehingga mengganggu pemahaman file lainnya, maka mungkin inilah waktunya untuk mengekstraknya ke modulnya sendiri. Jangan lupa untuk memberi nama ekspresi secara eksplisit, terlepas dari apakah nama tersebut disimpulkan dari variabel yang memuatnya atau tidak (yang sering terjadi di browser modern atau saat menggunakan kompiler seperti Babel). Ini menghilangkan asumsi apa pun yang dibuat tentang tumpukan panggilan Kesalahan. (diskusi)
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_8
Bungkus ekspresi fungsi yang segera dipanggil dalam tanda kurung. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_08
Mengapa? . Perhatikan bahwa di dunia dengan modul di mana-mana, Anda hampir tidak pernah membutuhkan IIFE
// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_9
- Jangan pernah mendeklarasikan fungsi di blok non-fungsi (// bad var a = 1; var b = 2; // good const a = 1; const b = 2;09, // bad var a = 1; var b = 2; // good const a = 1; const b = 2;10, dll). Tetapkan fungsi ke variabel sebagai gantinya. Browser akan memungkinkan Anda untuk melakukannya, tetapi mereka semua menafsirkannya secara berbeda, yang merupakan berita buruk. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_11
catatan. ECMA-262 mendefinisikan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_12 sebagai daftar pernyataan. Deklarasi fungsi bukanlah pernyataan
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_0
Jangan pernah menyebutkan parameter // bad var a = 1; var b = 2; // good const a = 1; const b = 2;13. Ini akan lebih diutamakan daripada objek // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_13 yang diberikan ke setiap cakupan fungsi
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_1
Jangan pernah gunakan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_13, pilih untuk menggunakan sintaks istirahat const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 991 sebagai gantinya. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_17
mengapa? . Plus, argumen istirahat adalah Array nyata, dan bukan hanya seperti Array seperti // bad var a = 1; var b = 2; // good const a = 1; const b = 2;13
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_2
Gunakan sintaks parameter default daripada mengubah argumen fungsi
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_3
Hindari efek samping dengan parameter default
Mengapa?
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_4
Selalu tempatkan parameter default terakhir. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_20
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_5
Jangan pernah menggunakan konstruktor Fungsi untuk membuat fungsi baru. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_21
mengapa?
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_6
Spasi dalam tanda tangan fungsi. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_23 // bad var a = 1; var b = 2; // good const a = 1; const b = 2;24
Mengapa?
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_7
Jangan pernah mengubah parameter. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_25
mengapa?
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_8
Jangan pernah menetapkan ulang parameter. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_25
Mengapa? . Itu juga dapat menyebabkan masalah pengoptimalan, terutama di V8
// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_9
Lebih suka menggunakan sintaks spread const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 991 untuk memanggil fungsi variadic. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_29
Mengapa?
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_0
Fungsi dengan tanda tangan multibaris, atau pemanggilan, harus diindentasi seperti setiap daftar multibaris lainnya dalam panduan ini. dengan setiap item pada satu baris dengan sendirinya, dengan tanda koma pada item terakhir. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_32
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_1
Fungsi Panah
Saat Anda harus menggunakan fungsi anonim (seperti saat meneruskan panggilan balik sebaris), gunakan notasi fungsi panah. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_33, // bad var a = 1; var b = 2; // good const a = 1; const b = 2;34
mengapa?
Mengapa tidak?
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_2
Jika badan fungsi terdiri dari pernyataan tunggal yang mengembalikan tanpa efek samping, hilangkan kurung kurawal dan gunakan pengembalian implisit. Jika tidak, pertahankan kurung kurawal dan gunakan pernyataan ________4______36. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_37, // bad var a = 1; var b = 2; // good const a = 1; const b = 2;38
Mengapa? . Ini terbaca dengan baik ketika banyak fungsi dirangkai bersama
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_3
Jika ekspresi membentang lebih dari beberapa baris, bungkus dalam tanda kurung untuk keterbacaan yang lebih baik
mengapa?
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_4
Selalu sertakan tanda kurung di sekitar argumen untuk kejelasan dan konsistensi. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_37
Mengapa?
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_5
Hindari sintaks fungsi panah yang membingungkan (// bad var a = 1; var b = 2; // good const a = 1; const b = 2;40) dengan operator pembanding (// bad var a = 1; var b = 2; // good const a = 1; const b = 2;41, // bad var a = 1; var b = 2; // good const a = 1; const b = 2;42). eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_43
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_6
Terapkan lokasi badan fungsi panah dengan pengembalian implisit. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_44
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_7
Kelas dan Konstruktor
Selalu gunakan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_45. Hindari memanipulasi // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_46 secara langsung
mengapa?
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_8
Gunakan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_48 untuk warisan
mengapa?
// const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_9
Metode dapat mengembalikan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;35 untuk membantu dengan rangkaian metode
// bad const item = new Object(); // good const item = {};_0
Tidak apa-apa untuk menulis metode // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_51 khusus, pastikan itu berhasil dan tidak menyebabkan efek samping
// bad const item = new Object(); // good const item = {};_1
Kelas memiliki konstruktor default jika tidak ditentukan. Fungsi konstruktor kosong atau yang hanya didelegasikan ke kelas induk tidak diperlukan. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_52
// bad const item = new Object(); // good const item = {};_2
Hindari duplikat anggota kelas. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_53
mengapa?
// bad const item = new Object(); // good const item = {};_3
Metode kelas harus menggunakan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;35 atau dibuat menjadi metode statis kecuali jika perpustakaan atau kerangka kerja eksternal memerlukan penggunaan metode non-statis tertentu. Menjadi metode instan harus menunjukkan bahwa ia berperilaku berbeda berdasarkan properti penerima. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_55
// bad const item = new Object(); // good const item = {};_4
modul
Selalu gunakan modul (// bad var a = 1; var b = 2; // good const a = 1; const b = 2;56/// bad var a = 1; var b = 2; // good const a = 1; const b = 2;57) pada sistem modul non-standar. Anda selalu dapat menumpuk ke sistem modul pilihan Anda
mengapa?
// bad const item = new Object(); // good const item = {};_5
Jangan gunakan impor karakter pengganti
mengapa?
// bad const item = new Object(); // good const item = {};_6
Dan jangan ekspor langsung dari impor
Mengapa?
// bad const item = new Object(); // good const item = {};_7
Hanya impor dari jalur di satu tempat. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_58
mengapa?
// bad const item = new Object(); // good const item = {};_8
Jangan ekspor binding yang dapat diubah. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_59
Mengapa? . Meskipun teknik ini mungkin diperlukan untuk beberapa kasus khusus, secara umum, hanya referensi konstan yang harus diekspor.
// bad const item = new Object(); // good const item = {};_9
Dalam modul dengan satu ekspor, pilih ekspor default daripada ekspor bernama. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_60
Mengapa?
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };0
Letakkan semua // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_56s di atas pernyataan non-impor. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_62
mengapa?
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_1
Impor multiline harus diindentasi seperti multiline array dan literal objek. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_64
mengapa?
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_2
Larang sintaks pemuat Webpack dalam pernyataan impor modul. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_65
Mengapa? . Lebih suka menggunakan sintaks loader di // bad var a = 1; var b = 2; // good const a = 1; const b = 2;66
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_3
Jangan sertakan eslint ekstensi nama file JavaScript. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_67
mengapa?
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_4
Iterator dan Generator
Jangan gunakan iterator. Lebih suka fungsi urutan tinggi JavaScript daripada loop seperti // bad var a = 1; var b = 2; // good const a = 1; const b = 2;68 atau // bad var a = 1; var b = 2; // good const a = 1; const b = 2;69. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;70 // bad var a = 1; var b = 2; // good const a = 1; const b = 2;71
Mengapa? . Berurusan dengan fungsi murni yang mengembalikan nilai lebih mudah untuk dipikirkan daripada efek samping
Gunakan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_72 / // bad var a = 1; var b = 2; // good const a = 1; const b = 2;73 / // bad var a = 1; var b = 2; // good const a = 1; const b = 2;74 / // bad var a = 1; var b = 2; // good const a = 1; const b = 2;75 / // bad var a = 1; var b = 2; // good const a = 1; const b = 2;76 / // bad var a = 1; var b = 2; // good const a = 1; const b = 2;77 / // bad var a = 1; var b = 2; // good const a = 1; const b = 2;78 /. untuk mengulangi array, dan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_79 / // bad var a = 1; var b = 2; // good const a = 1; const b = 2;80 / // bad var a = 1; var b = 2; // good const a = 1; const b = 2;81 untuk menghasilkan array sehingga Anda dapat mengulangi objek
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_5
Jangan gunakan generator untuk saat ini
Mengapa?
Jika Anda harus menggunakan generator, atau jika Anda mengabaikannya, pastikan tanda tangan fungsinya diberi spasi dengan benar. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_82
mengapa?
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_6
Properti
Gunakan notasi titik saat mengakses properti. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_89
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_7
Gunakan notasi braket // bad var a = 1; var b = 2; // good const a = 1; const b = 2;90 saat mengakses properti dengan variabel
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_8
Gunakan operator eksponensial // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_91 saat menghitung eksponensial. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_92
function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, };_9
variabel
Selalu gunakan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_59 atau const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 963 untuk mendeklarasikan variabel. Tidak melakukannya akan menghasilkan variabel global. Kami ingin menghindari polusi namespace global. Kapten Planet memperingatkan kita akan hal itu. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_95 const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 961
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_0
Gunakan satu deklarasi const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 959 atau const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 963 per variabel atau penugasan. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_99
mengapa? . Anda juga dapat menelusuri setiap deklarasi dengan debugger, alih-alih melompati semuanya sekaligus
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_1
Kelompokkan semua const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 959 Anda dan kemudian kelompokkan semua const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 963 Anda
Mengapa?
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_2
Tetapkan variabel di mana Anda membutuhkannya, tetapi tempatkan di tempat yang masuk akal
Mengapa?
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_3
Jangan rantai penugasan variabel. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_06
Mengapa?
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_4
Hindari penggunaan kenaikan dan penurunan unary (// bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }07, // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }08). eslint // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_09
mengapa? . Juga lebih ekspresif untuk mengubah nilai-nilai Anda dengan pernyataan seperti // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }10 daripada // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }11 atau // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }12. Melarang pernyataan kenaikan dan penurunan unary juga mencegah Anda dari pre-incrementing/pre-decrementing nilai secara tidak sengaja yang juga dapat menyebabkan perilaku tak terduga dalam program Anda
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_5
Hindari ganti baris sebelum atau sesudah // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_13 dalam tugas. Jika tugas Anda melanggar // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_14, lingkari nilai pada orang tua. celah // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_15
Mengapa?
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_6
Larang variabel yang tidak digunakan. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_17
Mengapa? . Variabel semacam itu memakan ruang dalam kode dan dapat menyebabkan kebingungan bagi pembaca
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_7
mengangkat
Deklarasi const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 960 diangkat ke atas lingkup fungsi terlampir terdekat, penugasan mereka tidak. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_59 dan const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 963 deklarasi diberkati dengan konsep baru yang disebut. Penting untuk mengetahui mengapa typeof tidak lagi aman
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_8
Ekspresi fungsi anonim mengerek nama variabelnya, tetapi bukan penugasan fungsi
// bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, };_9
Ekspresi fungsi bernama mengerek nama variabel, bukan nama fungsi atau badan fungsi
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_0
Deklarasi fungsi mengerek nama mereka dan badan fungsi
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_1
Untuk informasi lebih lanjut lihat JavaScript Scoping & Hoisting oleh Ben Cherry
Operator Perbandingan & Kesetaraan
- Gunakan // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_21 dan // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }22 di atas // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }23 dan // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }24. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_25
Pernyataan bersyarat seperti pernyataan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_09 mengevaluasi ekspresi mereka menggunakan paksaan dengan metode abstrak // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }27 dan selalu mengikuti aturan sederhana ini
- Objek bernilai benar
- Nilai yang tidak ditentukan menjadi salah
- Null dievaluasi menjadi false
- Boolean mengevaluasi nilai boolean
- Angka bernilai salah jika +0, -0, atau NaN, jika tidak benar
- String bernilai false jika string kosong // bad var a = 1; var b = 2; // good const a = 1; const b = 2;00, jika tidak benar
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_2
Gunakan pintasan untuk boolean, tetapi perbandingan eksplisit untuk string dan angka
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_3
- Untuk informasi lebih lanjut lihat oleh Angus Croll
Gunakan kurung kurawal untuk membuat blok di // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_29 dan // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }30 klausa yang berisi deklarasi leksikal (e. g. const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 963, const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 959, const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 958, dan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;45). eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_35
mengapa? . Hal ini menyebabkan masalah ketika beberapa klausa // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }29 mencoba untuk mendefinisikan hal yang sama
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_4
Ternary tidak boleh bersarang dan umumnya berupa ekspresi baris tunggal. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_39
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_5
Avoid unneeded ternary statements. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_40
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_6
Saat mencampur operator, sertakan mereka dalam tanda kurung. Satu-satunya pengecualian adalah operator aritmatika standar. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_41, // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }42, dan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;91 karena prioritas mereka dipahami secara luas. Kami menyarankan untuk menyertakan // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_44 dan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;84 dalam tanda kurung karena prioritasnya dapat menjadi ambigu ketika digabungkan. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }46
Mengapa?
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_7
blok
Kenakan kawat gigi dengan semua blok multiline. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_47
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };_8
Jika Anda menggunakan blok multigaris dengan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;09 dan // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }49, letakkan // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }49 pada baris yang sama dengan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;09 kurung tutup blok Anda. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }52
const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, };9
Jika blok _// bad var a = 1; var b = 2; // good const a = 1; const b = 2;_09 selalu mengeksekusi pernyataan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;36, blok // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }49 berikutnya tidak diperlukan. A // bad var a = 1; var b = 2; // good const a = 1; const b = 2;36 in an // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }57 block following an // bad var a = 1; var b = 2; // good const a = 1; const b = 2;09 block that contains a // bad var a = 1; var b = 2; // good const a = 1; const b = 2;36 can be separated into multiple // bad var a = 1; var b = 2; // good const a = 1; const b = 2;09 blocks. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_61
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };0
Control Statements
Jika pernyataan kontrol Anda (// bad var a = 1; var b = 2; // good const a = 1; const b = 2;09, // bad var a = 1; var b = 2; // good const a = 1; const b = 2;10 dll. ) gets too long or exceeds the maximum line length, each (grouped) condition could be put into a new line. The logical operator should begin the line
mengapa? . Ini juga meningkatkan keterbacaan dengan membuatnya lebih mudah untuk mengikuti logika kompleks secara visual.
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };1
Jangan gunakan operator seleksi sebagai pengganti pernyataan kontrol
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };2
Comments
Use // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }64 for multiline comments
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };3
Use // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }65 for single line comments. Place single line comments on a newline above the subject of the comment. Put an empty line before the comment unless it’s on the first line of a block
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };4
Start all comments with a space to make it easier to read. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_66
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };5
- Prefixing your comments with // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }67 or // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }68 helps other developers quickly understand if you’re pointing out a problem that needs to be revisited, or if you’re suggesting a solution to the problem that needs to be implemented. These are different than regular comments because they are actionable. The actions are // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }69 or // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }70
Use // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }71 to annotate problems
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };6
Use // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }72 to annotate solutions to problems
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };7
Whitespace
Use soft tabs (space character) set to 2 spaces. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }73
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };8
Place 1 space before the leading brace. eslint. // bad var a = 1; var b = 2; // good const a = 1; const b = 2;24
const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJediWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJediWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, };9
Place 1 space before the opening parenthesis in control statements (// bad var a = 1; var b = 2; // good const a = 1; const b = 2;09, // bad var a = 1; var b = 2; // good const a = 1; const b = 2;10 etc. ). Place no space between the argument list and the function name in function calls and declarations. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }77
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 900
Set off operators with spaces. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }78
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 901
End files with a single newline character. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }79
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 902
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 903
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_04
Gunakan lekukan saat membuat rantai metode panjang (lebih dari 2 rantai metode). Gunakan titik awal, yang menekankan bahwa garis adalah pemanggilan metode, bukan pernyataan baru. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }80 // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }81
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_05
Biarkan baris kosong setelah blok dan sebelum pernyataan berikutnya
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_06
Jangan pad blok Anda dengan baris kosong. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_82
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_07
Jangan gunakan banyak baris kosong untuk mengisi kode Anda. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_83
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_08
Jangan menambahkan spasi di dalam tanda kurung. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_84
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_09
Jangan tambahkan spasi di dalam tanda kurung. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_85
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_10
Tambahkan spasi di dalam kurung kurawal. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_86
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_11
Hindari baris kode yang lebih panjang dari 100 karakter (termasuk spasi). catatan. per , string panjang dikecualikan dari aturan ini, dan tidak boleh dipecah. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_14
Mengapa?
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_12
Memerlukan spasi yang konsisten di dalam token blok terbuka dan token berikutnya pada baris yang sama. Aturan ini juga menerapkan spasi yang konsisten di dalam token blok tertutup dan token sebelumnya pada baris yang sama. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_88
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_13
Hindari spasi sebelum koma dan minta spasi setelah koma. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_89
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_14
Terapkan spasi di dalam tanda kurung properti yang dihitung. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_90
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_15
Hindari spasi di antara fungsi dan pemanggilannya. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }91
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_16
Terapkan spasi antara kunci dan nilai dalam properti literal objek. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_92
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_17
- Hindari membuntuti spasi di akhir baris. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_93
Hindari banyak baris kosong, hanya izinkan satu baris baru di akhir file, dan hindari baris baru di awal file. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }83
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_18
Koma
Tanda koma. Tidak. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_95
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_19
Tanda koma tambahan. ya. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_96
mengapa? . Selain itu, transpiler seperti Babel akan menghapus tanda koma tambahan dalam kode yang ditranspilasikan, yang berarti Anda tidak perlu khawatir tentang browser lawas
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 920
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_21
titik koma
ya. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_97
Why? When JavaScript encounters a line break without a semicolon, it uses a set of rules called to determine whether it should regard that line break as the end of a statement, and (as the name implies) place a semicolon into your code before the line break if it thinks so. ASI berisi beberapa perilaku eksentrik, dan kode Anda akan rusak jika JavaScript salah mengartikan jeda baris Anda. These rules will become more complicated as new features become a part of JavaScript. Menghentikan pernyataan Anda secara eksplisit dan mengonfigurasi linter Anda untuk menangkap titik koma yang hilang akan membantu mencegah Anda menghadapi masalah
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_22
.
Ketik Casting & Pemaksaan
- Lakukan pemaksaan ketik di awal pernyataan
String. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }_98
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_23
Numbers. Use // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }99 for type casting and // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 100 always with a radix for parsing strings. eslint. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_01 // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }98
Why? The // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 100 function produces an integer value dictated by interpretation of the contents of the string argument according to the specified radix. Spasi kosong terdepan dalam string diabaikan. Jika radix adalah const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 953 atau // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 105, diasumsikan sebagai // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 106 kecuali jika angka dimulai dengan pasangan karakter // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 107 atau // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 108, dalam hal ini diasumsikan radix 16. Ini berbeda dari ECMAScript 3, yang hanya melarang (tetapi mengizinkan) interpretasi oktal. Banyak implementasi belum mengadopsi perilaku ini pada 2013. Dan, karena browser lama harus didukung, selalu tentukan radix
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_24
Jika karena alasan apa pun Anda melakukan sesuatu yang liar dan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 100 adalah hambatan Anda dan perlu menggunakan Bitshift untuk alasan kinerja, tinggalkan komentar yang menjelaskan mengapa dan apa yang Anda lakukan
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 925
catatan. Berhati-hatilah saat menggunakan operasi bitshift. Angka direpresentasikan sebagai , tetapi operasi bitshift selalu mengembalikan bilangan bulat 32-bit (). Pergeseran bit dapat menyebabkan perilaku tak terduga untuk nilai bilangan bulat yang lebih besar dari 32 bit. Discussion. Int 32-bit bertanda tangan terbesar adalah 2.147.483.647
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_26
Boolean. eslint. // bad var count = 1; if (true) { count += 1; } // good, use the let. let count = 1; if (true) { count += 1; }98
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_27
Konvensi Penamaan
Hindari nama satu huruf. Jadilah deskriptif dengan nama Anda. eslint. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_11
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_28
Use camelCase when naming objects, functions, and instances. eslint. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_12
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_29
Use PascalCase only when naming constructors or classes. eslint. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 113
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_30
Jangan gunakan garis bawah di belakang atau di depan. eslint. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_14
Mengapa? . Although a leading underscore is a common convention to mean “private”, in fact, these properties are fully public, and as such, are part of your public API contract. Konvensi ini mungkin menyebabkan pengembang salah mengira bahwa perubahan tidak akan dianggap melanggar, atau bahwa pengujian tidak diperlukan. dr. jika Anda ingin sesuatu menjadi "pribadi", itu tidak boleh terlihat
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_31
Jangan simpan referensi ke // bad var a = 1; var b = 2; // good const a = 1; const b = 2;_35. Gunakan fungsi panah atau Function#bind
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_32
Nama file dasar harus sama persis dengan nama ekspor standarnya
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_33
Gunakan camelCase saat Anda mengekspor fungsi default. Nama file Anda harus identik dengan nama fungsi Anda
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_34
Gunakan PascalCase saat Anda mengekspor perpustakaan konstruktor / kelas / singleton / fungsi / objek kosong
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_35
Acronyms and initialisms should always be all uppercased, or all lowercased
Mengapa?
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_36
Anda dapat memilih huruf besar konstanta hanya jika (1) diekspor, (2) adalah const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 959 (tidak dapat dipindahkan), dan (3) pemrogram dapat mempercayainya (dan properti bersarangnya) untuk tidak pernah berubah
Why? This is an additional tool to assist in situations where the programmer would be unsure if a variable might ever change. UPPERCASE_VARIABLES memberi tahu programmer bahwa mereka dapat mempercayai variabel (dan propertinya) untuk tidak berubah
- Bagaimana dengan semua const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_59 variabel? . Ini harus digunakan untuk konstanta yang diekspor
- Bagaimana dengan objek yang diekspor? . g. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_18) dan mempertahankan bahwa semua properti bersarang tidak berubah
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_37
aksesoris
- Fungsi aksesor untuk properti tidak diperlukan
Jangan gunakan getter/setter JavaScript karena menyebabkan efek samping yang tidak terduga dan lebih sulit untuk diuji, dipelihara, dan dipikirkan. Sebagai gantinya, jika Anda membuat fungsi pengakses, gunakan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 119 dan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 120
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_38
Jika properti/metode adalah const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 951, gunakan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 122 atau // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 123
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_39
Tidak masalah membuat fungsi // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_24 dan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 125, tetapi konsistenlah
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_40
acara
When attaching data payloads to events (whether DOM events or something more proprietary like Backbone events), pass an object literal (also known as a "hash") instead of a raw value. Hal ini memungkinkan kontributor berikutnya untuk menambahkan lebih banyak data ke muatan peristiwa tanpa menemukan dan memperbarui setiap penangan untuk peristiwa tersebut. Misalnya, alih-alih
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_41
lebih suka
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_42
jQuery
Awali variabel objek jQuery dengan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 126
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 943
Pencarian cache jQuery
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_44
- Untuk kueri DOM, gunakan Cascading // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 127 atau parent > child // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 128. jsPerf
Gunakan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_29 dengan kueri objek jQuery cakupan
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_45
Kompatibilitas ECMAScript 5
- Lihat tabel kompatibilitas ES5 Kangax
Gaya ECMAScript 6+ (ES 2015+).
- Ini adalah kumpulan tautan ke berbagai fitur ES6+
Jangan gunakan proposal TC39 yang belum mencapai tahap 3
Mengapa? . Kami ingin menggunakan JavaScript, dan proposal belum menjadi JavaScript
Perpustakaan Standar
Pustaka Standar berisi utilitas yang secara fungsional rusak tetapi tetap ada karena alasan warisan
Gunakan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_30 alih-alih global // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 131. eslint. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_32
Mengapa? . Jika perilaku ini diinginkan, buatlah secara eksplisit
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_46
Gunakan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_34 alih-alih global // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 135. eslint. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_32
mengapa? . Jika perilaku ini diinginkan, buatlah secara eksplisit
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_47
pengujian
ya
const foo = [1, 2]; const bar = foo; bar[0] = 9; console.log(foo[0], bar[0]); // => 9, 9_48
- Tidak, tapi serius
- Kerangka pengujian apa pun yang Anda gunakan, Anda harus menulis tes
- Berusaha keras untuk menulis banyak fungsi murni kecil, dan meminimalkan di mana mutasi terjadi
- Berhati-hatilah dengan stub dan tiruan - mereka dapat membuat pengujian Anda lebih rapuh
- Kami terutama menggunakan // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_38 dan ________14______39 di Airbnb. // const and let only exist in the blocks they are defined in. { let a = 1; const b = 1; var c = 1; } console.log(a); // ReferenceError console.log(b); // ReferenceError console.log(c); // Prints 1_40 juga kadang-kadang digunakan untuk modul kecil dan terpisah
- Cakupan tes 100% adalah tujuan yang baik untuk diperjuangkan, meskipun tidak selalu praktis untuk mencapainya
- Setiap kali Anda memperbaiki bug, tulis tes regresi. Bug yang diperbaiki tanpa uji regresi hampir pasti akan rusak lagi di masa mendatang
pertunjukan
- Tentang Tata Letak & Performa Web
- String vs Array Concat
- Coba/Tangkap Biaya Dalam Satu Putaran
- Fungsi Bang
- jQuery Temukan vs Konteks, Pemilih
- innerHTML vs textContent untuk teks skrip
- Rangkaian Tali Panjang
- Apakah fungsi JavaScript seperti // bad var a = 1; var b = 2; // good const a = 1; const b = 2;72, // bad var a = 1; var b = 2; // good const a = 1; const b = 2;77, dan // bad var a = 1; var b = 2; // good const a = 1; const b = 2;74 dioptimalkan untuk melintasi array?
- memuat
Sumber daya
Mempelajari ES6+
- Spesifikasi ECMA terbaru
- menjelajahiJS
- Tabel Kompatibilitas ES6
- Tinjauan Lengkap Fitur ES6
Baca ini
- Standar ECMA-262
Peralatan
- Linter Gaya Kode
- ESlint - Gaya Airbnb. eslintrc
- JSHint - Gaya Airbnb. jshintrc
- Neutrino Preset - @neutrinojs/airbnb
Panduan Gaya Lainnya
- Google JavaScript Style Guide
- Panduan Gaya JavaScript Google (Lama)
- Pedoman Gaya Inti jQuery
- Prinsip Penulisan JavaScript Idiomatis yang Konsisten
- StandarJS
Gaya Lain
- Penamaan ini dalam fungsi bersarang - Christian Johansen
- Callback Bersyarat - Ross Allen
- -Jeong Hoon Byun
- Beberapa pernyataan var dalam JavaScript, tidak berlebihan - Ben Alman
Bacaan lebih lanjut
- Memahami Penutupan JavaScript - Angus Croll
- Basic JavaScript for the impatient programmer - Dr. Axel Rauschmayer
- Anda Mungkin Tidak Membutuhkan jQuery - Zack Bloom & Adam Schwartz
- Fitur ES6 - Luke Hoban
- Panduan Frontend - Benjamin De Cock
buku
- javascript. Bagian yang Baik - Douglas Crockford
- Pola JavaScript - Stoyan Stefanov
- Pola Desain Pro JavaScript - Ross Harmes dan Dustin Diaz
- Situs Web Berperforma Tinggi. Pengetahuan Penting untuk Insinyur Front-End - Steve Souders
- JavaScript yang Dapat Dipelihara - Nicholas C. Zaka
- Aplikasi Web JavaScript - Alex MacCaw
- Teknik Pro JavaScript - John Resig
- Node Penghancur. js. JavaScript Di Mana Saja - Guillermo Rauch
- Rahasia Ninja JavaScript - John Resig dan Bear Bibeault
- JavaScript manusia - Henrik Joreteg
- Super hero. js - Kim Joar Bekkelund, Mads Mobæk, & Olav Bjorkoy
- JSBooks - Julien Bouquillon
- JavaScript Pihak Ketiga - Ben Cuka dan Anton Kovalyov
- JavaScript yang efektif. 68 Cara Spesifik untuk Memanfaatkan Kekuatan JavaScript - David Herman
- JavaScript yang fasih - Marijn Haverbeke
- Anda Tidak Tahu JS. ES6 & Selanjutnya - Kyle Simpson
Blogging
- JavaScript Mingguan
- javascript, javascript
- Blog Bocoup
- cukup baik
- NCZOnline
- Kesempurnaan Membunuh
- Ben Alman
- Dmitry Baranovsky
- nettuts
siniar
- JavaScript Udara
- Javascript Jabber
di alam liar
Ini adalah daftar organisasi yang menggunakan panduan gaya ini. Kirimi kami permintaan penarikan dan kami akan menambahkan Anda ke daftar
- 123ercepat. 123erfast/javascript
- 4Catalyzer. 4Catalyzer/javascript
- Aan Zee. AanZee/javascript
- Airbnb. airbnb/javascript
- AloPeyk. AloPeyk
- AltSchool. AltSchool/javascript
- Apartmint. apartmint/javascript
- Ascribe. ascribe/javascript
- Avant. avantcredit/javascript
- Axept. axept/javascript
- Billabong. billabong/javascript
- Bisk. bisk
- Bonhomme. bonhommeparis/javascript
- Brainshark. brainshark/javascript
- CaseNine. CaseNine/javascript
- Cerner. Cerner
- Chartboost. ChartBoost/javascript-style-guide
- Coeur d'Alene Tribe. www. cdatribe-nsn. pemerintah
- Bandingkan Online. bandingkan online/javascript
- Pembelajaran Kompas. kompaslearning/javascript-style-guide
- DailyMotion. dailymotion/javascript
- Lakukan sesuatu. Lakukan Sesuatu/eslint-config.php
- digitpaint digitpaint/javascript
- Drupal. www. drupal. org
- Ekosia. ecosia/javascript
- evernote. evernote/javascript-style-guide
- Permainan Evolusi. evolusi-gaming/javascript
- evozonjs. evozonjs/javascript
- TepatTarget. TepatTarget/javascript
- flexberry. flexberry/javascript-style-guide
- Gawker Media. gawkermedia
- Listrik Umum. GeneralElectric/javascript
- Generasi Tuks. GenerationTux/javascript
- DataBagus. gooddata/gdc-js-style
- GreenChef. greenchef/javascript
- grooveshark. grooveshark/javascript
- Grup-Abraxas. Grup-Abraxas/javascript
- Happeo. happeo/javascript
- Sayang. honeyscience/javascript
- Bagaimana tentang kami. howaboutwe/javascript
- hubspot. HubSpot/javascript
- Hiper. hyperoslo/javascript-playbook
- Grup Antar Kota. intercitygroup/javascript-style-guide
- jam3. Konvensi-Kode-Javascript/Jam3
- JSSolutions. jssolutions/javascript
- Komputasi Kaplan. kaplankomputing/javascript
- KickorStick. kickorstick
- Solusi Kinetik. kinetika/javascript
- LEINWAND. LEINWAND/javascript
- planet kesepian. lonelyplanet/javascript
- M2GEN. M2GEN/javascript
- Musim Semi yang Perkasa. perkasa/javascript
- MinnPost. MinnPost/javascript
- MitocGroup. MitocGroup/javascript
- Muber. muber
- Masyarakat Geografis Nasional. natgeosociety
- NullDev. NullDevCo/JavaScript-Styleguide
- Nulogi. nulogi/javascript
- Pengembangan Bukit Jeruk. orangehill/javascript
- Kesehatan Orion. orionhealth/javascript
- Peerby. Peerby/javascript
- Dermaga 1. pier1/javascript
- Qotto. Panduan gaya Qotto/javascript
- reaksi.
- REI. reidev/js-style-guide
- Riak. ripple/javascript-style-guide
- Supermarket Sainsbury. jsainsburyplc
- shutterfly. shutterfly/javascript
- sourcetoad. sourcetoad/javascript
- Springload. springload
- StratoDem Analytics. stratodem/javascript
- SteelKiwi Development. steelkiwi/javascript
- StudentSphere. studentsphere/javascript
- SwoopApp. swoopapp/javascript
- SysGarage. sysgarage/javascript-style-guide
- Syzygy Warsaw. syzygypl/javascript
- Target. target/javascript
- Terra. terra
- Tangga. TheLadders/javascript
- The Nerdery. thenerdery/javascript-standards
- Tomify. tomprats
- Traitify. traitify/eslint-config-traitify
- T4R Technology. T4R-Technology/javascript
- UrbanSim. urbansim
- VoxFeed. VoxFeed/javascript-style-guide
- WeBox Studio. weboxstudio/javascript
- Weggo. Weggo/javascript
- Zillow. zillow/javascript
- ZocDoc. ZocDoc/javascript
Translation
This style guide is also available in other languages
- Brazilian Portuguese. armoucar/javascript-style-guide
- Bulgarian. borislavvv/javascript
- Catalan. fpmweb/javascript-style-guide
- Chinese (Simplified). lin-123/javascript
- Cina tradisional). jigsawye/javascript
- Perancis. nmussy/javascript-style-guide
- Jerman. timofurrer/javascript-style-guide
- Italia. sinkswim/javascript-style-guide
- Jepang. mitsuruog/javascript-style-guide
- Korea. ParkSB/javascript-style-guide
- Rusia. leonidlebedev/javascript-airbnb
- Bahasa inggris. paolocarrasco/javascript-style-guide
- Thai. lvarayut/javascript-style-guide
- Turki. eraycetinay/javascript
- Orang Ukraina. ivanzusko/javascript
- Vietnam. dangkyokhoang/javascript-style-guide
Panduan Panduan Gaya JavaScript
- Referensi
Mengobrol Dengan Kami Tentang JavaScript
- Temukan kami di gitter
kontributor
- Lihat Kontributor
lisensi
(Lisensi MIT)
Hak Cipta (c) 2012 Airbnb
Izin dengan ini diberikan, tanpa biaya, kepada siapa pun yang mendapatkan salinan perangkat lunak ini dan file dokumentasi terkait ("Perangkat Lunak"), untuk berurusan dengan Perangkat Lunak tanpa batasan, termasuk tanpa batasan hak untuk menggunakan, menyalin, memodifikasi, menggabungkan , menerbitkan, mendistribusikan, mensublisensikan, dan/atau menjual salinan Perangkat Lunak, dan untuk mengizinkan orang yang diberikan Perangkat Lunak untuk melakukannya, tunduk pada ketentuan berikut
Pemberitahuan hak cipta di atas dan pemberitahuan izin ini harus disertakan dalam semua salinan atau bagian substansial dari Perangkat Lunak
PERANGKAT LUNAK INI DISEDIAKAN 'SEBAGAIMANA ADANYA', TANPA JAMINAN APA PUN, TERSURAT MAUPUN TERSIRAT, TERMASUK NAMUN TIDAK TERBATAS PADA JAMINAN DAPAT DIPERDAGANGKAN, KESESUAIAN UNTUK TUJUAN TERTENTU DAN TANPA PELANGGARAN. DALAM KEADAAN APA PUN PENULIS ATAU PEMEGANG HAK CIPTA TIDAK BERTANGGUNG JAWAB ATAS KLAIM, KERUSAKAN ATAU KEWAJIBAN LAINNYA, BAIK DALAM TINDAKAN KONTRAK, KESALAHAN ATAU LAINNYA, YANG TIMBUL DARI, DARI ATAU SEHUBUNGAN DENGAN PERANGKAT LUNAK ATAU PENGGUNAAN ATAU HUBUNGAN LAIN DALAM PERANGKAT LUNAK
Amandemen
Kami mendorong Anda untuk membagi panduan ini dan mengubah aturan agar sesuai dengan panduan gaya tim Anda. Below, you may list some amendments to the style guide. Ini memungkinkan Anda memperbarui panduan gaya secara berkala tanpa harus berurusan dengan konflik penggabungan