Amalan Terbaik Saya – JavaScript

1. Nyahaktifkan cache

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

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

2. Biarkan konsol JS sentiasa terbuka

Dalam DevTools, buka tab Console dan biarkan ia terbuka supaya langkah 1 kekal berkesan, dan supaya anda juga perasan ralat rangkaian dan ralat JS.

Plugin ini juga disyorkan, kerana ia memaparkan ralat JS dengan lebih jelas lagi sekiranya anda sendiri terlupa:

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

• You Don't Know JS (1st Edition)
• Menerangkan mengapa this patut dielakkan
• Menerangkan mengapa perkara yang kelihatan pelik kadangkala berlaku dalam JS (kata kunci: skop leksikal, closure)

4. Koma bertitik

• Sentiasa letakkan
• Ia tidak wajib, tetapi boleh membantu, contohnya untuk mengelakkan perangkap ini: Stack Overflow
• JavaScript menyisipkan koma bertitik secara automatik:

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

// JavaScript Interpretation:
return;
5;

5. Operator logik && dan ||

• Dalam Java, a && b dan a || b dinilai mengikut algebra Boolean. a dan b mestilah nilai boolean.
• Dalam JavaScript:
  • Bagi a && b, b dipulangkan jika a bernilai true
  • Bagi a || b, b dipulangkan jika a bernilai false

Ungkapan juga boleh dirangkaikan dengan cara ini, lalu menghasilkan pernyataan if yang paling ringkas pernah wujud – gula sintaks:

• isAdmin && showDeleteButton();
• (Sebenarnya ini bukan lagi satu pernyataan)

Cara ini juga sering digunakan untuk nilai lalai:

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

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

Dalam JavaScript, jawapannya agak 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);

Kod ini menghasilkan output berikut:

10
changed
unchanged

Jika obj1 langsung bukan rujukan, mengubah obj1.item tidak akan memberi sebarang kesan kepada obj1 di luar fungsi.

Jika argumen itu rujukan sebenar, semuanya akan berubah: num akan menjadi 100, dan obj2.item akan mengandungi “changed”. Sebaliknya, num kekal 10 dan obj2.item kekal “unchanged”.

Sebenarnya, item itu dihantar mengikut nilai. Namun, nilai yang dihantar itu sendiri ialah satu rujukan. Dari segi teknikal, ini dipanggil call-by-sharing.

Secara praktikal, ini bermakna: jika anda mengubah parameter itu sendiri (seperti num dan obj2), ia tidak menjejaskan objek asal yang dihantar ke dalam fungsi. Tetapi jika anda mengubah nilai dalaman parameter itu, perubahan tersebut akan kekal (seperti pada obj1).