コンピュータープログラミングでは、命名規則は、ソースコードおよびドキュメント内の変数、タイプ、関数、およびその他のオブジェクトを示す識別子に使用される文字のシーケンスを選択するための一連のルールです -Wikipedia
名前を思いつくのは難しいです！
この記事では、コードの可読性を向上させるために、（P）A / HC / LCの命名手法に焦点を当てます。これらのガイドラインは任意のプログラミング言語に適用できます。この記事では、コード例としてJavaScriptを使用しています。
（P）A / HC / LCはどういう意味ですか？
この方法では、関数の命名に次のパターンを使用します。
? (P) + (A) + (HC) + ? (LC)
接頭辞（P）は何の略ですか？
プレフィックス は、関数の意味を拡張します。
- is
現在のコンテキストのプロパティまたは状態（通常はブール値）を記述します。
const color = 'blue';
const isBlue = (color === 'blue'); //
const isPresent = true; //
if (isBlue && isPresent) {
console.log('Blue is present!');
}
- has
現在のコンテキストに特定の値または状態（通常はブール値）があるかどうかを示します。
/* */
const isProductsExist = (productsCount > 0);
const areProductsPresent = (productsCount > 0);
/* */
const hasProducts = (productsCount > 0);
- should
特定のアクションに関連付けられた正の条件演算子（通常はブール値）を反映します。
const shouldUpdateUrl = (url, expectedUrl) => url !== expectedUrl;
アクションは機能の中心です
アクション は、関数名の動詞部分です。これは、関数の機能を説明する上で最も重要な部分です。
- 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.
略語は使用しないでください。通常、それらはコードの可読性を悪化させるだけです。短くてわかりやすい名前を見つけるのは難しいかもしれませんが、略語はそうしない言い訳にはなりません。例えば：
/* */
const onItmClk = () => {};
/* */
const onItemClick = () => {};
3.重複するコンテキストを避けます
読みやすさが損なわれない限り、名前からコンテキストを常に削除してください。
class MenuItem {
/* ( "MenuItem") */
handleMenuItemClick(event) {
...
}
/* MenuItem.handleClick() */
handleClick(event) {
...
}
}
4.期待される結果を名前に反映します
/* */
const isEnabled = (itemsCount > 3);
return <Button disabled={!isEnabled} />
/* */
const isDisabled = (itemsCount <= 3);
return <Button disabled={isDisabled} />
5.単数形/複数形を検討します
接頭辞と同様に、変数名は、意味が1つ以上であるかどうかに応じて、単数形または複数形にすることができます。
/* */
const friends = 'Bob';
const friend = ['Bob', 'Tony', 'Tanya'];
/* */
const friend = 'Bob';
const friends = ['Bob', 'Tony', 'Tanya'];
6.意味のある発音された名前を使用する
/* */
const yyyymmdstr = moment().format("YYYY/MM/DD");
/* */
const currentDate = moment().format("YYYY/MM/DD");