Best Practices Saya – JavaScript

1. Nonaktifkan cache

Firefox:
Buka Developer Tools -> Buka Settings (F1) -> "Disable HTTP Cache (when toolbox is open)"

Chrome:
Buka Developer Tools -> Buka Settings (F1) -> "Disable cache (while DevTools is open)"

2. Biarkan konsol JS tetap terbuka

Di DevTools, buka tab Console dan biarkan tetap terbuka, agar langkah 1 tetap berlaku dan Anda juga melihat error jaringan maupun JS.

Plugin ini juga layak dipakai, karena menampilkan error JS dengan lebih jelas lagi, untuk saat-saat Anda sendiri lupa memperhatikannya:

3. JavaScript: Bacaan wajib “You Don't Know JS”

• You Don't Know JS (1st Edition)
• Menjelaskan mengapa this sebaiknya dihindari
• Menjelaskan mengapa di JS terkadang terjadi hal-hal yang tampak aneh (kata kunci: lexical scope, closure)

4. Titik koma

• Selalu gunakan
• Tidak wajib, tetapi bisa membantu menghindari jebakan seperti ini, misalnya: Stack Overflow
• JavaScript menyisipkan titik koma secara otomatis:

// you want to return 5 and have ugly formatting:
return
5

// JavaScript Interpretation:
return;
5;

5. Operator logika && dan ||

• Di Java, a && b dan a || b dievaluasi menurut aljabar Boolean. a dan b harus berupa boolean.
• Di JavaScript:
  • Pada a && b, b dikembalikan jika a bernilai true
  • Pada a || b, b dikembalikan jika a bernilai false

Ekspresi juga bisa dirangkai dengan cara ini, sehingga memungkinkan pernyataan if terpendek yang pernah ada – syntax sugar:

• isAdmin && showDeleteButton();
• (Tepatnya, ini sudah bukan statement lagi)

Cara ini juga sering dipakai untuk nilai default:

• let sendNewsletter = form.getNewsletterOptIn() || false;

6. Apakah JavaScript pass-by-reference atau pass-by-value?

Di JavaScript, ini menarik. Contoh:

function changeStuff(a, b, c) {
    a = a * 10;
    b.item = "changed";
    c = {item: "changed"};
}

var num = 10;
var obj1 = {item: "unchanged"};
var obj2 = {item: "unchanged"};

changeStuff(num, obj1, obj2);

console.log(num);
console.log(obj1.item);
console.log(obj2.item);

Menghasilkan output berikut:

10
changed
unchanged

Jika obj1 sama sekali bukan referensi, maka mengubah obj1.item tidak akan berpengaruh apa pun pada obj1 di luar fungsi.

Jika argumennya adalah referensi sungguhan, maka semuanya akan berubah: num akan menjadi 100, dan obj2.item akan berisi “changed”. Kenyataannya, num tetap 10 dan obj2.item tetap “unchanged”.

Sebenarnya, elemen yang dioper diteruskan berdasarkan nilai. Namun, yang diteruskan berdasarkan nilai itu sendiri adalah sebuah referensi. Secara teknis, ini disebut call-by-sharing.

Dalam praktiknya: Jika Anda mengubah parameternya sendiri (seperti pada num dan obj2), hal itu tidak berpengaruh pada objek asli yang dioper ke dalam fungsi. Namun, jika Anda mengubah nilai internal parameter, perubahan tersebut akan ikut terbawa (seperti pada obj1).