Heim > Web-Frontend > js-Tutorial > Welche Regeln gelten für die Benennung von Variablen und Ordnern?

Welche Regeln gelten für die Benennung von Variablen und Ordnern?

王林
Freigeben: 2024-08-13 14:30:40
Original
815 Leute haben es durchsucht

What are the rules for naming variables and folders?

Die Benennung von Variablen und Ordnern in einem Projekt ist sehr wichtig, um die Lesbarkeit und Ordnung des Codes aufrechtzuerhalten. Hier sind einige allgemeine Namenskonventionen und Regeln:

Benennen von Variablen

  1. Verwenden Sie camelCase: für Variablen, Funktionen und Namen von Requisiten oder Zustandsvariablen, wie zum Beispiel:

    • Benutzername
    • isLoggedIn
    • handleClick
  2. Benennen Sie sie klar: Der Name einer Variablen sollte ihre Funktion oder die Informationen, die sie enthält, klar zum Ausdruck bringen, zum Beispiel:

    • cartItems (für Artikel im Warenkorb)
    • authToken (für Authentifizierungstoken)
  3. Verwenden Sie einen beschreibenden Namen für den Datentyp: Wenn mehrere Datentypen in derselben Variablen vorhanden sind, zum Beispiel:

    • userAge (wenn es mehrere Variablen über den Benutzer gibt)
    • Produktpreis
  4. Abkürzungen vermeiden: Verwenden Sie zur Verdeutlichung vollständige Namen, zum Beispiel:

    • Verwenden Sie userProfile anstelle von usrProf.

Benennung von Ordnern

  1. Verwenden Sie „kebab-case“ oder „snake_case“: für den Namen des Ordners, zum Beispiel:

    • Benutzerprofil (Kebab-Fall)
    • user_profile (snake_case)
  2. Beschreiben Sie ihn.: Der Name des Ordners sollte seinen Inhalt oder seine Funktionalität widerspiegeln, zum Beispiel:

    • Komponenten/ (zum Speichern von React-Komponenten)
    • Services/ (zum Speichern von Servicefunktionen oder API)
    • Haken/ (zur Aufbewahrung benutzerdefinierter Haken)
  3. Verwenden Sie ein einheitliches Format: Behalten Sie projektübergreifend ein einheitliches Benennungsformat bei. Zur Bestellung, wie zum Beispiel:

    • Bei Verwendung der Dönerhülle als Ordner Verwenden Sie für alle Ordner das gleiche Format
  4. Vermeiden Sie generische oder vage Namen: Verwenden Sie Namen, die den Inhalt oder die Funktion des Ordners widerspiegeln, wie zum Beispiel:

    • Verwenden Sie utils/ anstelle von misc/
    • Verwenden Sie „store/“ anstelle von „data/“

Beispiel

Ordner:

src/
├── components/
│   ├── Button.tsx
│   └── Header.tsx
├── hooks/
│   └── useFetch.ts
├── services/
│   └── apiService.ts
├── stores/
│   ├── auth/
│   │   ├── useAuthStore.ts
│   │   └── authTypes.ts
│   ├── user/
│   │   ├── useUserStore.ts
│   │   └── userTypes.ts
│   ├── product/
│   │   ├── useProductStore.ts
│   │   └── productTypes.ts
│   └── cart/
│       ├── useCartStore.ts
│       └── cartTypes.ts
└── index.ts
Nach dem Login kopieren

Variable:

// ตัวอย่างใน useAuthStore.ts
interface AuthState {
  isAuthenticated: boolean;
  user: string | null;
  login: (username: string) => void;
  logout: () => void;
}

// ตัวอย่างใน useUserStore.ts
interface UserState {
  name: string;
  email: string;
  updateUser: (name: string, email: string) => void;
}
Nach dem Login kopieren

Die Verwendung guter Benennungsregeln trägt dazu bei, dass Ihr Code organisierter und verständlicher aussieht

Benennen eines Konfigurationswerts oder einer Konstante wie z DATABASE_CONFIG Es sollten Grundsätze befolgt werden, die es leicht machen, das Ziel zu verstehen und zu erreichen. Hier sind die Regeln für die Benennung von Konfigurationen:

กฎในการตั้งชื่อค่าคอนฟิก

  1. ใช้รูปแบบ UPPER_SNAKE_CASE: ชื่อของค่าคอนฟิกหรือค่าคงที่ควรใช้รูปแบบ UPPER_SNAKE_CASE เพื่อแสดงให้เห็นว่านี่คือค่าคงที่และไม่ควรถูกเปลี่ยนแปลง เช่น:

    • DATABASE_CONFIG
    • API_ENDPOINT
    • MAX_RETRY_ATTEMPTS
  2. สื่อความหมายได้ชัดเจน: ชื่อของค่าคอนฟิกควรบ่งบอกถึงการใช้งานหรือวัตถุประสงค์ของมัน เช่น:

    • DATABASE_HOST (สำหรับโฮสต์ของฐานข้อมูล)
    • CACHE_EXPIRATION_TIME (สำหรับเวลาหมดอายุของแคช)
  3. รวมคอนเท็กซ์และการใช้งาน: ค่าคอนฟิกควรมีชื่อที่รวมคอนเท็กซ์หรือการใช้งานเพื่อให้เข้าใจได้ง่าย เช่น:

    • EMAIL_SERVICE_API_KEY (สำหรับคีย์ API ของบริการอีเมล)
    • JWT_SECRET_KEY (สำหรับคีย์ลับของ JSON Web Token)
  4. หลีกเลี่ยงการใช้ชื่อที่คลุมเครือ: ชื่อของค่าคอนฟิกควรเฉพาะเจาะจงและไม่ควรใช้ชื่อที่คลุมเครือหรือทั่วไปเกินไป เช่น:

    • ใช้ DATABASE_PORT แทน PORT
    • ใช้ SESSION_TIMEOUT แทน TIMEOUT
  5. ใช้คำที่สื่อถึงประเภทของค่า: ชื่อค่าคอนฟิกควรสื่อถึงประเภทของค่า เช่น ค่าเชิงตัวเลข, สตริง, หรือ Boolean เป็นต้น เช่น:

    • MAX_CONNECTIONS (ค่าตัวเลขสูงสุดของการเชื่อมต่อ)
    • ENABLE_LOGGING (ค่า Boolean สำหรับเปิดหรือปิดการบันทึก)

ตัวอย่างการตั้งชื่อค่าคอนฟิก

ไฟล์คอนฟิก

// ตัวอย่างในไฟล์ config.ts

export const DATABASE_CONFIG = {
  HOST: 'localhost',
  PORT: 5432,
  USER: 'dbuser',
  PASSWORD: 'password',
  DATABASE_NAME: 'mydatabase'
};

export const API_CONFIG = {
  BASE_URL: 'https://api.example.com',
  TIMEOUT: 5000, // Timeout in milliseconds
  API_KEY: 'your-api-key-here'
};

export const APP_SETTINGS = {
  MAX_RETRY_ATTEMPTS: 3,
  SESSION_TIMEOUT: 3600, // Timeout in seconds
  ENABLE_LOGGING: true
};
Nach dem Login kopieren

การใช้ค่าคอนฟิกในโค้ด

import { DATABASE_CONFIG, API_CONFIG, APP_SETTINGS } from './config';

// การใช้ค่าคอนฟิกในการเชื่อมต่อฐานข้อมูล
const dbConnection = connectToDatabase({
  host: DATABASE_CONFIG.HOST,
  port: DATABASE_CONFIG.PORT,
  user: DATABASE_CONFIG.USER,
  password: DATABASE_CONFIG.PASSWORD,
  database: DATABASE_CONFIG.DATABASE_NAME
});

// การใช้ค่าคอนฟิกสำหรับ API
const fetchData = async () => {
  try {
    const response = await fetch(API_CONFIG.BASE_URL + '/data', {
      method: 'GET',
      headers: {
        'Authorization': `Bearer ${API_CONFIG.API_KEY}`
      },
      timeout: API_CONFIG.TIMEOUT
    });
    const data = await response.json();
    return data;
  } catch (error) {
    if (APP_SETTINGS.ENABLE_LOGGING) {
      console.error('Error fetching data:', error);
    }
    throw error;
  }
};
Nach dem Login kopieren

การใช้หลักการเหล่านี้จะช่วยให้คุณตั้งชื่อค่าคอนฟิกอย่างมีระเบียบและเข้าใจง่ายครับ

Das obige ist der detaillierte Inhalt vonWelche Regeln gelten für die Benennung von Variablen und Ordnern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage