Diterjemahkan untuk Hexlet.io
Dalam pemrograman komputer, konvensi penamaan adalah seperangkat aturan untuk memilih urutan karakter yang akan digunakan untuk pengidentifikasi yang menunjukkan variabel, jenis, fungsi, dan objek lain dalam kode sumber dan dokumentasi - Wikipedia
Mencari nama itu sulit!
Pada artikel ini, kami akan fokus pada teknik penamaan (P) A / HC / LC untuk meningkatkan keterbacaan kode. Panduan ini dapat diterapkan pada bahasa pemrograman apa pun, artikel menggunakan JavaScript sebagai contoh kode.
Apa artinya (P) A / HC / LC?
Praktik ini menggunakan pola berikut untuk menamai fungsi:
? (P) + (A) + (HC) + ? (LC)
Apa singkatan dari prefiks (P)?
Awalan memperluas arti fungsinya.
- is
Menjelaskan properti atau keadaan konteks saat ini (biasanya nilai boolean).
const color = 'blue';
const isBlue = (color === 'blue'); //
const isPresent = true; //
if (isBlue && isPresent) {
console.log('Blue is present!');
}
- has
Menunjukkan apakah konteks saat ini memiliki nilai atau status tertentu (biasanya nilai boolean).
/* */
const isProductsExist = (productsCount > 0);
const areProductsPresent = (productsCount > 0);
/* */
const hasProducts = (productsCount > 0);
- should
Mencerminkan operator bersyarat positif (biasanya nilai Boolean) yang terkait dengan tindakan tertentu.
const shouldUpdateUrl = (url, expectedUrl) => url !== expectedUrl;
Tindakan adalah inti dari fungsi
Tindakan adalah bagian kata kerja dari nama fungsi. Ini adalah bagian terpenting dalam mendeskripsikan apa yang dilakukan suatu fungsi.
- get
( getter ).
function getFruitsCount() {
return this.fruits.length;
}
- set
A B.
let fruits = 0;
const setFruits = (nextFruits) => {
fruits = nextFruits;
};
setFruits(5);
console.log(fruits); // 5
- reset
.
const initialFruits = 5;
let fruits = initialFruits;
setFruits(10);
console.log(fruits); // 10
const resetFruits = () => {
fruits = initialFruits;
};
resetFruits();
console.log(fruits); // 5
- fetch
, (, ).
const fetchPosts = (postCount) => fetch('https://api.dev/posts', {...});
- remove
- -.
, , — removeFilter
, deleteFilter
( ):
const removeFilter = (filterName, filters) => filters.filter((name) => name !== filterName);
const selectedFilters = ['price', 'availability', 'size'];
removeFilter('price', selectedFilters);
- delete
-. .
, , , . delete-post, CMS deletePost
, removePost
.
const deletePost = (id) => database.find({ id }).delete();
- compose
. , .
const composePageUrl = (pageName, pageId) => `${pageName.toLowerCase()}-${pageId}`;
- handle
. .
const handleLinkClick = () => {
console.log('Clicked a link!');
};
link.addEventListener('click', handleLinkClick);
— , .
— -. , , , .
/* , */
const filter = (list, predicate) => list.filter(predicate);
/* , */
const getRecentPosts = (posts) => filter(posts, (post) => post.date === Date.now());
/*
.
, JavaScript (Array).
filterArray .
*/
, .
1. S-I-D
(Short), (Intuitive) (Descriptive).
/* */
const a = 5; // "a"
const isPaginatable = (postsCount > 10); // "Paginatable"
const shouldPaginatize = (postsCount > 10); // - !
/* */
const postsCount = 5;
const hasPagination = (postsCount > 10);
const shouldDisplayPagination = (postsCount > 10); //
2.
Jangan gunakan singkatan. Biasanya mereka hanya memperburuk keterbacaan kode. Menemukan nama yang pendek dan deskriptif bisa jadi sulit, tetapi singkatan tidak bisa dijadikan alasan untuk tidak melakukannya. Sebagai contoh:
/* */
const onItmClk = () => {};
/* */
const onItemClick = () => {};
3. Hindari konteks duplikat
Selalu hapus konteks dari sebuah nama kecuali jika hal itu membahayakan keterbacaan.
class MenuItem {
/* ( "MenuItem") */
handleMenuItemClick(event) {
...
}
/* MenuItem.handleClick() */
handleClick(event) {
...
}
}
4. Merefleksikan hasil yang diharapkan dalam nama
/* */
const isEnabled = (itemsCount > 3);
return <Button disabled={!isEnabled} />
/* */
const isDisabled = (itemsCount <= 3);
return <Button disabled={isDisabled} />
5. Pertimbangkan bentuk tunggal / jamak
Seperti awalan, nama variabel bisa tunggal atau jamak tergantung pada apakah mereka memiliki satu arti atau lebih.
/* */
const friends = 'Bob';
const friend = ['Bob', 'Tony', 'Tanya'];
/* */
const friend = 'Bob';
const friends = ['Bob', 'Tony', 'Tanya'];
6. Gunakan nama yang bermakna dan dilafalkan
/* */
const yyyymmdstr = moment().format("YYYY/MM/DD");
/* */
const currentDate = moment().format("YYYY/MM/DD");