Rumah hujung hadapan web tutorial js Memahami Kod Bersih: Nama Bermakna ⚡

Memahami Kod Bersih: Nama Bermakna ⚡

Aug 12, 2024 pm 08:30 PM

Understanding Clean Code: Meaningful Names ⚡

Apabila menulis kod, salah satu aspek yang paling diabaikan lagi kritikal ialah penamaan.

Nama yang kami pilih untuk pembolehubah, fungsi, kelas dan entiti lain dalam kod kami boleh memberi kesan ketara kebolehbacaan, kebolehselenggaraan dan kualiti keseluruhan.

Bab 2 Kod Bersih menyelidiki seni dan sains memilih nama yang bermakna, menyediakan satu set garis panduan yang boleh membantu pembangun menulis kod yang ekspresif dan boleh difahami.

Dalam catatan blog ini, kami akan meneroka perkara penting daripada bab ini, menggambarkan setiap konsep dengan contoh dalam JavaScript.


?1. Gunakan Nama Yang Menzahirkan Niat

Nama yang anda pilih hendaklah dengan jelas menyatakan maksud di sebalik pembolehubah, fungsi atau kelas. Pembaca seharusnya dapat memahami perkara yang dilakukan oleh kod tanpa memerlukan konteks tambahan.

// Bad
let d; 

// Good
let daysUntilDeadline;
Salin selepas log masuk

Dalam contoh pertama, d adalah kabur dan tidak memberikan konteks. Versi yang dipertingkatkan, daysUntilDeadline, dengan jelas menunjukkan perkara yang diwakili oleh pembolehubah.


?2. Elakkan maklumat yang salah

Nama tidak boleh mengelirukan. Elakkan daripada menggunakan nama yang mungkin membayangkan makna yang berbeza daripada apa yang sebenarnya dilakukan oleh kod tersebut.

// Bad
let accountList = new Map();

// Good
let accountsMap = new Map();
Salin selepas log masuk

Di sini, senarai akaun mungkin mengelirukan kerana ia mencadangkan senarai (yang merupakan koleksi tersusun), manakala struktur data sebenar ialah Peta. Menggunakan accountsMap adalah lebih tepat.


?3. Buat Perbezaan Bermakna

Jika anda perlu membezakan antara pembolehubah, fungsi atau kelas yang serupa, lakukan dengan cara yang menjadikan perbezaan itu jelas dan bermakna.

// Bad
getUserInfo();
getUserData();

// Good
getUserProfile();
getUserSettings();
Salin selepas log masuk

Dalam contoh pertama, getUserInfo dan getUserData terlalu serupa dan tidak menyatakan perbezaannya dengan jelas. Contoh kedua menjelaskan perbezaan dengan menamakan fungsi berdasarkan perkara yang dikembalikan.


?4. Gunakan Nama Yang Boleh Disebut

Nama hendaklah mudah dibaca dan disebut. Ini menjadikan perbincangan kod dengan orang lain lebih mudah.

// Bad
let genymdhms;

// Good
let generationTimestamp;
Salin selepas log masuk

genymdhms ialah nama yang tidak boleh disebut yang sukar untuk diingati atau dibincangkan. generationTimestamp, bagaimanapun, adalah jelas dan mudah untuk disebut.


?5. Gunakan Nama Boleh Dicari

Dalam pangkalan kod yang lebih besar, adalah penting untuk menggunakan nama yang mudah dicari. Elakkan daripada menggunakan nama satu huruf atau nama yang terlalu disingkatkan.

// Bad
let e = document.getElementById('email');

// Good
let emailInputElement = document.getElementById('email');
Salin selepas log masuk

e tidak mudah dicari dan ia tidak menyampaikan apa yang diwakilinya. emailInputElement adalah lebih deskriptif dan lebih mudah ditemui dalam pangkalan kod.


?6. Elakkan Pengekodan

Elakkan memasukkan jenis, awalan atau pengekodan lain dalam nama anda. Biarkan nama itu sendiri cukup deskriptif.

// Bad
let phoneString;

// Good
let phoneNumber;
Salin selepas log masuk

Dalam kes ini, phoneString menyertakan pengekodan jenis yang tidak diperlukan (String). phoneNumber lebih ringkas dan lebih langsung.


?7. Nama Kelas Harus Kata Nama, Nama Fungsi Harus Kata Kerja

Kelas mewakili objek atau konsep, jadi nama mereka hendaklah kata nama. Fungsi, sebaliknya, mewakili tindakan, jadi nama mereka hendaklah kata kerja.

// Class names (Nouns)
class UserAccount {}
class ShoppingCart {}

// Function names (Verbs)
function calculateTotal() {}
function sendEmail() {}
Salin selepas log masuk

Perbezaan ini membantu dalam memahami peranan setiap elemen dalam kod anda.


?8. Elakkan Pemetaan Mental

Jangan paksa pembaca untuk menterjemahkan nama kepada sesuatu yang lebih bermakna. Nama itu harus jelas.

// Bad
let n = 5; // Number of users

// Good
let userCount = 5;
Salin selepas log masuk

n memerlukan pembaca mengingati atau menyimpulkan bahawa ia bermaksud bilangan pengguna, manakala userCount serta-merta jelas.


Kesimpulan ⚡

Memilih nama yang bermakna bukan sekadar soal gaya—ia merupakan amalan asas dalam menulis kod yang bersih dan boleh diselenggara.

Dengan mengikut garis panduan yang digariskan dalam Bab 2 Kod Bersih, anda boleh meningkatkan kebolehbacaan kod JavaScript anda dan memudahkan orang lain (dan anda sendiri) untuk memahami dan mengekalkan.

Ingat, matlamatnya adalah untuk menulis kod yang menyampaikan tujuan dan logiknya, mengurangkan beban kognitif pada pembaca.

Apabila anda menamakan pembolehubah, fungsi atau kelas seterusnya, pertimbangkan prinsip penamaan yang bermakna dan cara ia boleh menyumbang kepada kod yang lebih bersih dan berkesan.

Selamat Pengekodan!

Atas ialah kandungan terperinci Memahami Kod Bersih: Nama Bermakna ⚡. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
2 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Repo: Cara menghidupkan semula rakan sepasukan
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Cara mendapatkan biji gergasi
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Ganti aksara rentetan dalam javascript Ganti aksara rentetan dalam javascript Mar 11, 2025 am 12:07 AM

Ganti aksara rentetan dalam javascript

periksa jQuery jika tarikh sah periksa jQuery jika tarikh sah Mar 01, 2025 am 08:51 AM

periksa jQuery jika tarikh sah

jQuery mendapatkan padding/margin elemen jQuery mendapatkan padding/margin elemen Mar 01, 2025 am 08:53 AM

jQuery mendapatkan padding/margin elemen

10 Tab Accordion JQuery 10 Tab Accordion JQuery Mar 01, 2025 am 01:34 AM

10 Tab Accordion JQuery

10 patut diperiksa plugin jQuery 10 patut diperiksa plugin jQuery Mar 01, 2025 am 01:29 AM

10 patut diperiksa plugin jQuery

HTTP Debugging dengan Node dan HTTP-Console HTTP Debugging dengan Node dan HTTP-Console Mar 01, 2025 am 01:37 AM

HTTP Debugging dengan Node dan HTTP-Console

Tutorial Persediaan API Carian Google Custom Tutorial Persediaan API Carian Google Custom Mar 04, 2025 am 01:06 AM

Tutorial Persediaan API Carian Google Custom

jQuery tambah bar scroll ke div jQuery tambah bar scroll ke div Mar 01, 2025 am 01:30 AM

jQuery tambah bar scroll ke div

See all articles