Piawaian Pengekodan Umum JavaScript.

Piawaian Pengekodan Umum

1. Nama Bermakna:
   • Gunakan pembolehubah dan nama fungsi yang bermakna dan deskriptif.
   • Elakkan singkatan dan nama huruf tunggal kecuali pembilang gelung.

   // Good
   const userAge = 25;
   function calculateTotalPrice(items) { ... }

   // Bad
   const a = 25;
   function calc(items) { ... }

1. Konvensyen Penamaan Konsisten:
   • Gunakan camelCase untuk pembolehubah dan fungsi.
   • Gunakan PascalCase untuk nama kelas.

   const userAge = 25;
   function calculateTotalPrice(items) { ... }
   class UserProfile { ... }

1. Elakkan Pengulangan:
   • Ikuti prinsip DRY (Jangan Ulangi Diri Sendiri) dengan merangkum kod berulang ke dalam fungsi.

   // Good
   function calculateDiscount(price, discount) { ... }
   const price1 = calculateDiscount(100, 10);
   const price2 = calculateDiscount(200, 20);

   // Bad
   const price1 = 100 - 10;
   const price2 = 200 - 20;

1. Pengendalian Ralat:
   • Balut panggilan API dan operasi tak segerak lain dalam blok cuba-tangkap.

   async function fetchData() {
     try {
       const response = await fetch('api/url');
       const data = await response.json();
       return data;
     } catch (error) {
       console.error('Error fetching data:', error);
     }
   }

1. Sarung Tepi:
   • Sentiasa pertimbangkan kes tepi dan sahkan input.

   function getUserAge(user) {
     if (!user || !user.age) {
       return 'Age not available';
     }
     return user.age;
   }

1. Pemformatan Konsisten:
   • Ikuti gaya pemformatan kod yang konsisten (lekukan, jarak, dll.). Gunakan alat seperti Prettier untuk mengautomasikan ini.

   if (condition) {
     doSomething();
   } else {
     doSomethingElse();
   }

Organisasi Kod

1. Pemodularan:
   • Pecahkan kod kepada modul atau fungsi kecil yang boleh digunakan semula.

   // utils.js
   export function calculateDiscount(price, discount) { ... }

   // main.js
   import { calculateDiscount } from './utils.js';

1. Pemisahan Kebimbangan:
   • Asingkan kebimbangan yang berbeza (cth., logik UI, logik perniagaan, pengendalian data) ke dalam fail atau fungsi yang berbeza.

   // ui.js
   function updateUI(data) { ... }

   // data.js
   async function fetchData() { ... }

   // main.js
   import { updateUI } from './ui.js';
   import { fetchData } from './data.js';

Amalan Terbaik

1. Gunakan Mod Ketat:
   • Sentiasa dayakan mod ketat untuk menangkap ralat pengekodan biasa.

   'use strict';

1. Gunakan Pemalar:
   • Gunakan pemalar untuk nilai yang tidak berubah.

   const MAX_USERS = 100;

1. Elakkan Pembolehubah Global:
   • Meminimumkan penggunaan pembolehubah global untuk mengelakkan konflik dan tingkah laku yang tidak diingini.

   // Good
   (function() {
     const localVariable = 'This is local';
   })();

   // Bad
   var globalVariable = 'This is global';

1. Ulasan dan Dokumentasi:
   • Tulis ulasan dan dokumentasi untuk menerangkan tujuan dan fungsi kod.

   /**
    * Calculates the total price after applying a discount.
    * @param {number} price - The original price.
    * @param {number} discount - The discount to apply.
    * @returns {number} - The total price after discount.
    */
   function calculateTotalPrice(price, discount) { ... }

1. Gunakan Janji dan Async/Tunggu dengan Pengendalian Ralat:
   • Lebih suka menggunakan janji dan async/tunggu untuk operasi tak segerak, dan bungkusnya dalam blok cuba-tangkap untuk pengendalian ralat.

   // Good
   async function fetchData() {
     try {
       const response = await fetch('api/url');
       const data = await response.json();
       return data;
     } catch (error) {
       console.error('Error fetching data:', error);
     }
   }

   // Bad
   function fetchData(callback) {
     fetch('api/url')
       .then(response => response.json())
       .then(data => callback(data))
       .catch(error => console.error('Error fetching data:', error));
   }

1. Pemusnahan Objek:
   • Gunakan pemusnahan objek untuk mengekstrak berbilang sifat daripada objek dengan cara yang ringkas.

   // Good
   const vehicle = { make: 'Toyota', model: 'Camry' };
   const { make, model } = vehicle;

   // Bad
   const vehicleMake = vehicle.make;
   const vehicleModel = vehicle.model;

Dengan mengikut piawaian ini, anda boleh memastikan kod JavaScript anda bersih, boleh diselenggara dan cekap.

Atas ialah kandungan terperinci Piawaian Pengekodan Umum JavaScript.. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!