Praktik Terbaik JavaScript
Hindari variabel global, hindari new
, hindari ==
, hindarieval()
Hindari Variabel Global
Minimalkan penggunaan variabel global.
Ini mencakup semua tipe data, objek, dan fungsi.
Variabel dan fungsi global dapat ditimpa oleh skrip lain.
Gunakan variabel lokal sebagai gantinya, dan pelajari cara menggunakan closure .
Selalu Deklarasikan Variabel Lokal
Semua variabel yang digunakan dalam suatu fungsi harus dideklarasikan sebagai variabel lokal .
Variabel lokal harus dideklarasikan dengan var
kata kunci atau let
kata kunci, atau const
kata kunci, jika tidak mereka akan menjadi variabel global.
Mode ketat tidak mengizinkan variabel yang tidak dideklarasikan.
Deklarasi di Atas
Ini adalah praktik pengkodean yang baik untuk meletakkan semua deklarasi di bagian atas setiap skrip atau fungsi.
Ini akan:
- Berikan kode yang lebih bersih
- Sediakan satu tempat untuk mencari variabel lokal
- Permudah untuk menghindari variabel global (tersirat) yang tidak diinginkan
- Kurangi kemungkinan deklarasi ulang yang tidak diinginkan
// Declare at the beginning
let firstName, lastName, price, discount, fullPrice;
// Use later
firstName = "John";
lastName = "Doe";
price = 19.90;
discount = 0.10;
fullPrice = price - discount;
Ini juga berlaku untuk variabel loop:
for (let i = 0; i < 5; i++)
{
Inisialisasi Variabel
Ini adalah praktik pengkodean yang baik untuk menginisialisasi variabel saat Anda mendeklarasikannya.
Ini akan:
- Berikan kode yang lebih bersih
- Sediakan satu tempat untuk menginisialisasi variabel
- Hindari nilai yang tidak ditentukan
// Declare and initiate at the beginning
let firstName = "",
let lastName = "",
let price = 0,
let discount = 0,
let fullPrice = 0,
const myArray = [],
const myObject = {};
Inisialisasi variabel memberikan gambaran tentang tujuan penggunaan (dan tipe data yang dimaksudkan).
Deklarasikan Objek dengan const
Mendeklarasikan objek dengan const akan mencegah perubahan tipe yang tidak disengaja:
Contoh
let car = {type:"Fiat", model:"500", color:"white"};
car = "Fiat"; // Changes object to string
const car = {type:"Fiat", model:"500", color:"white"};
car = "Fiat"; // Not possible
Deklarasikan Array dengan const
Mendeklarasikan array dengan const akan mencegah perubahan tipe yang tidak disengaja:
Contoh
let cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Changes array to number
const cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Not possible
Jangan Gunakan Objek baru()
- Gunakan
""
alih-alihnew String()
- Gunakan
0
alih-alihnew Number()
- Gunakan
false
alih-alihnew Boolean()
- Gunakan
{}
alih-alihnew Object()
- Gunakan
[]
alih-alihnew Array()
- Gunakan
/()/
alih-alihnew RegExp()
- Gunakan
function (){}
alih-alihnew Function()
Contoh
let x1 = ""; // new primitive string
let x2 = 0; // new primitive number
let x3 = false; // new primitive boolean
const x4 = {}; // new object
const x5 = []; // new array object
const x6 = /()/; // new regexp object
const x7 = function(){}; // new function object
Waspadalah terhadap Konversi Jenis Otomatis
JavaScript diketik dengan longgar.
Sebuah variabel dapat berisi semua tipe data.
Sebuah variabel dapat mengubah tipe datanya:
Contoh
let x = "Hello"; // typeof x is a string
x = 5; // changes typeof x to a number
Hati-hati bahwa angka dapat secara tidak sengaja diubah menjadi string atau NaN
(Bukan Angka).
Saat melakukan operasi matematika, JavaScript dapat mengonversi angka menjadi string:
Contoh
let x = 5 + 7; // x.valueOf() is 12, typeof x is a number
let x = 5 + "7"; // x.valueOf() is 57, typeof x is a string
let x = "5" + 7; // x.valueOf() is 57, typeof x is a string
let x = 5 - 7; // x.valueOf() is -2, typeof x is a number
let x = 5 - "7"; // x.valueOf() is -2, typeof x is a number
let x = "5" - 7; // x.valueOf() is -2, typeof x is a number
let x = 5 - "x"; // x.valueOf() is NaN, typeof x is a number
Mengurangi string dari string, tidak menghasilkan kesalahan tetapi mengembalikan NaN
(Bukan Angka):
Contoh
"Hello" - "Dolly" // returns NaN
Gunakan === Perbandingan
Operator ==
perbandingan selalu mengonversi (ke tipe yang cocok) sebelum perbandingan.
Operator ===
memaksa perbandingan nilai dan tipe:
Contoh
0 == ""; // true
1 == "1"; // true
1 == true; // true
0 === ""; // false
1 === "1"; // false
1 === true;
// false
Gunakan Default Parameter
Jika suatu fungsi dipanggil dengan argumen yang hilang, nilai argumen yang hilang diatur ke
undefined
.
Nilai yang tidak ditentukan dapat merusak kode Anda. Merupakan kebiasaan yang baik untuk menetapkan nilai default ke argumen.
Contoh
function myFunction(x, y) {
if (y === undefined) {
y = 0;
}
}
ECMAScript 2015 memungkinkan parameter default dalam definisi fungsi:
function (a=1, b=1) { /*function code*/ }
Baca lebih lanjut tentang parameter fungsi dan argumen di Parameter Fungsi
Akhiri Sakelar Anda dengan Default
Selalu akhiri switch
pernyataan Anda dengan default
. Bahkan jika Anda berpikir tidak perlu untuk itu.
Contoh
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;
case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
break;
default:
day =
"Unknown";
}
Hindari Angka, String, dan Boolean sebagai Objek
Selalu perlakukan angka, string, atau boolean sebagai nilai primitif. Bukan sebagai objek.
Mendeklarasikan jenis ini sebagai objek, memperlambat kecepatan eksekusi, dan menghasilkan efek samping yang buruk:
Contoh
let x = "John";
let y = new String("John");
(x === y) // is false because x is a string and y is an object.
Atau bahkan lebih buruk:
Contoh
let x = new String("John");
let y = new String("John");
(x == y) // is false because you cannot compare objects.
Hindari Menggunakan eval()
Fungsi eval()
ini digunakan untuk menjalankan teks sebagai kode. Dalam hampir semua kasus, seharusnya tidak perlu menggunakannya.
Karena memungkinkan kode arbitrer dijalankan, ini juga mewakili masalah keamanan.