forked from extern/naming-cheatsheet
Update README.md
This commit is contained in:
parent
1099890560
commit
c9a1d0a4e3
29
README.md
29
README.md
@ -7,16 +7,16 @@
|
|||||||
# Naming cheatsheet
|
# Naming cheatsheet
|
||||||
Naming things is hard. Let's make it easier.
|
Naming things is hard. Let's make it easier.
|
||||||
|
|
||||||
The purpose of this document is to break down and systematize the concepts and patterns commonly used for variable naming. Beware that *variable* in this document refers to variables, methods, and generally anything created during your programming work.
|
This document contains systematized concepts and patterns often used when naming variables.
|
||||||
|
|
||||||
## Summary
|
## Summary
|
||||||
* [Guidelines](#guidelines)
|
* [Guidelines](#guidelines)
|
||||||
* [HC/LC Pattern](#hclc-pattern)
|
* [HC/LC Pattern](#hclc-pattern)
|
||||||
* **[Actions](#actions)**
|
* **[Actions](#actions)**
|
||||||
* [get](#get)
|
* [get](#get)
|
||||||
* [fetch](#fetch)
|
|
||||||
* [set](#set)
|
* [set](#set)
|
||||||
* [reset](#reset)
|
* [reset](#reset)
|
||||||
|
* [fetch](#fetch)
|
||||||
* [remove](#remove)
|
* [remove](#remove)
|
||||||
* [delete](#delete)
|
* [delete](#delete)
|
||||||
* [compose](#compose)
|
* [compose](#compose)
|
||||||
@ -29,7 +29,7 @@ The purpose of this document is to break down and systematize the concepts and p
|
|||||||
* [prev/next](#prevnext)
|
* [prev/next](#prevnext)
|
||||||
|
|
||||||
## Guidelines
|
## Guidelines
|
||||||
* Pick **one** naming convention and follow it. Whether it is `likeThis`, or `like_this`, or anyhow else, it does not matter. What matters is consistency in your work.
|
* Pick **one** naming convention and follow it. Whether it is `likeThis`, or `like_this`, or anyhow else, it does not matter. What matters is consistency in your code.
|
||||||
|
|
||||||
```js
|
```js
|
||||||
/* Bad */
|
/* Bad */
|
||||||
@ -94,6 +94,8 @@ const isDisabled = (itemsCount <= 3);
|
|||||||
return (<Button disabled={isDisabled} />);
|
return (<Button disabled={isDisabled} />);
|
||||||
```
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## HC/LC Pattern
|
## HC/LC Pattern
|
||||||
There is a useful pattern you may follow when naming your methods:
|
There is a useful pattern you may follow when naming your methods:
|
||||||
|
|
||||||
@ -113,6 +115,8 @@ To illustrate, take a look at how this pattern may be applied in the table below
|
|||||||
> **Note:** The order of the contexts affects the core meaning of a method. For example, `shouldUpdateComponent` means *you* are about to update a component, while `shouldComponentUpdate` tells you that *component* will update on itself, and you are but controlling whether it should do that right now.
|
> **Note:** The order of the contexts affects the core meaning of a method. For example, `shouldUpdateComponent` means *you* are about to update a component, while `shouldComponentUpdate` tells you that *component* will update on itself, and you are but controlling whether it should do that right now.
|
||||||
In other words, **high context emphasizes the meaning of the variable**.
|
In other words, **high context emphasizes the meaning of the variable**.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## Actions
|
## Actions
|
||||||
Chosing a proper action name may grant explicit descriptiveness to your methods. This is a good place to start when naming your methods.
|
Chosing a proper action name may grant explicit descriptiveness to your methods. This is a good place to start when naming your methods.
|
||||||
|
|
||||||
@ -123,13 +127,6 @@ function getFruitsCount() {
|
|||||||
return this.fruits.length;
|
return this.fruits.length;
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
#### `fetch`
|
|
||||||
Requests for a data, which takes time (i.e. async request).
|
|
||||||
```js
|
|
||||||
function fetchPosts(postCount) {
|
|
||||||
return fetch('https://api.dev/posts', { ... });
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
#### `set`
|
#### `set`
|
||||||
Declaratively sets a variable with value `A` to value `B`.
|
Declaratively sets a variable with value `A` to value `B`.
|
||||||
@ -162,6 +159,14 @@ resetFruits();
|
|||||||
console.log(fruits); // 5
|
console.log(fruits); // 5
|
||||||
```
|
```
|
||||||
|
|
||||||
|
#### `fetch`
|
||||||
|
Requests for a data, which takes time (i.e. async request).
|
||||||
|
```js
|
||||||
|
function fetchPosts(postCount) {
|
||||||
|
return fetch('https://api.dev/posts', { ... });
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
#### `remove`
|
#### `remove`
|
||||||
Removes something *from* somewhere.
|
Removes something *from* somewhere.
|
||||||
|
|
||||||
@ -213,8 +218,10 @@ function handleLinkClick(event) {
|
|||||||
link.addEventListener('click', handleLinkClick);
|
link.addEventListener('click', handleLinkClick);
|
||||||
```
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## Prefixes
|
## Prefixes
|
||||||
Prefixes enhance variables and methods, indicating an additional meaning behind them.
|
Prefixes act as enhancers, indicating additional meaning behind variables.
|
||||||
|
|
||||||
#### `is`
|
#### `is`
|
||||||
Describes certain characteristic or state of the current context (returns `Boolean`).
|
Describes certain characteristic or state of the current context (returns `Boolean`).
|
||||||
|
Loading…
Reference in New Issue
Block a user