naming cheatsheet
1.0.0
命名事物很难。该表试图使其更容易。
尽管这些建议可以应用于任何编程语言，但我将使用JavaScript在实践中说明它们。
命名变量和功能时，请使用英语。
/* Bad */
const primerNombre = 'Gustavo'
const amigos = [ 'Kate' , 'John' ]
/* Good */
const firstName = 'Gustavo'
const friends = [ 'Kate' , 'John' ]不管喜欢与否，英语是编程中的主要语言：所有编程语言的语法均以英语以及无数的文档和教育材料编写。通过用英语编写代码，您可以显着提高其凝聚力。
选择一个命名约定并遵循它。它可能是camelCase ， snake_case ，或者无论如何都无关紧要。重要的是要保持一致。
/* Bad */
const pages_count = 5
const shouldUpdate = true
/* Good */
const pageCount = 5
const shouldUpdate = true
/* Good as well */
const page_count = 5
const should_update = true 名称必须简短，直观和描述：
/* Bad */
const a = 5 // "a" could mean anything
const isPaginatable = a > 10 // "Paginatable" sounds extremely unnatural
const shouldPaginatize = a > 10 // Made up verbs are so much fun!
/* Good */
const postCount = 5
const hasPagination = postCount > 10
const shouldDisplayPagination = postCount > 10 // alternatively 不要使用收缩。它们除了降低代码的可读性外，什么都没有贡献。找到一个简短的描述性名称可能很难，但是收缩并不是不这样做的借口。
/* Bad */
const onItmClk = ( ) => { }
/* Good */
const onItemClick = ( ) => { } 名称不应重复定义其定义的上下文。如果没有降低其可读性，请始终从名称中删除上下文。
class MenuItem {
/* Method name duplicates the context (which is "MenuItem") */
handleMenuItemClick = ( event ) => { ... }
/* Reads nicely as `MenuItem.handleClick()` */
handleClick = ( event ) => { ... }
} 名称应反映预期的结果。
/* Bad */
const isEnabled = itemCount > 3
return < Button disabled = { ! isEnabled } />
/* Good */
const isDisabled = itemCount <= 3
return < Button disabled = { isDisabled } />命名功能时有一个有用的模式：
prefix? + action (A) + high context (HC) + low context? (LC)
看看如何在下表中应用此模式。
| 姓名 | 前缀 | 动作（A） | 高环境（HC） | 低环境（LC） |
|---|---|---|---|---|
getPost | get | Post | ||
getPostData | get | Post | Data | |
handleClickOutside | handle | Click | Outside | |
shouldDisplayMessage | should | Display | Message |
注意：上下文的顺序会影响变量的含义。例如，
shouldUpdateComponent意味着您将要更新组件，而shouldComponentUpdate告诉您组件将自行更新，并且您只是在控制何时应更新。换句话说，高环境强调变量的含义。
函数名称的动词部分。最重要的部分负责描述该功能的作用。
get立即访问数据（即内部数据的速记获取）。
function getFruitCount ( ) {
return this . fruits . length
}另请参见组成。
set以声明性的方式设置变量，并具有值A至值B 。
let fruits = 0
function setFruits ( nextFruits ) {
fruits = nextFruits
}
setFruits ( 5 )
console . log ( fruits ) // 5reset将变量设置回其初始值或状态。
const initialFruits = 5
let fruits = initialFruits
setFruits ( 10 )
console . log ( fruits ) // 10
function resetFruits ( ) {
fruits = initialFruits
}
resetFruits ( )
console . log ( fruits ) // 5fetch请求一些数据，这些数据需要一些不确定的时间（即异步请求）。
function fetchPosts ( postCount ) {
return fetch ( 'https://api.dev/posts' , { ... } )
}remove从某个地方删除了一些东西。
例如，如果您在搜索页面上收集了选定的过滤器的集合，则将其中一个从该集合中删除是removeFilter ，而不是deleteFilter （这也是您自然而然地用英语说的）：
function removeFilter ( filterName , filters ) {
return filters . filter ( ( name ) => name !== filterName )
}
const selectedFilters = [ 'price' , 'availability' , 'size' ]
removeFilter ( 'price' , selectedFilters )另请参见删除。
delete完全从存在领域中删除了一些东西。
想象一下，您是内容编辑，并且有您希望摆脱的臭名昭著的帖子。单击闪亮的“删除帖子”按钮后，CMS执行了deletePost操作，而不是removePost 。
function deletePost ( id ) {
return database . find ( { id } ) . delete ( )
}另请参阅删除。
compose从现有数据中创建新数据。主要适用于字符串，对象或功能。
function composePageUrl ( pageName , pageId ) {
return ` ${ pageName . toLowerCase ( ) } - ${ pageId } `
}另请参阅。
handle处理动作。通常在命名回调方法时使用。
function handleLinkClick ( ) {
console . log ( 'Clicked a link!' )
}
link . addEventListener ( 'click' , handleLinkClick ) 函数在运行的域。
功能通常是对某事的动作。重要的是说什么是可操作的域，或至少是预期的数据类型。
/* A pure function operating with primitives */
function filter ( predicate , list ) {
return list . filter ( predicate )
}
/* Function operating exactly on posts */
function getRecentPosts ( posts ) {
return filter ( posts , ( post ) => post . date === Date . now ( ) )
}某些特定于语言的假设可能允许省略上下文。例如，在JavaScript中，
filter在数组上运行很常见。添加显式filterArray是不必要的。
- -
前缀增强了变量的含义。它很少在函数名称中使用。
is描述当前上下文的特征或状态（通常是boolean ）。
const color = 'blue'
const isBlue = color === 'blue' // characteristic
const isPresent = true // state
if ( isBlue && isPresent ) {
console . log ( 'Blue is present!' )
}has描述当前上下文是否具有一定的价值或状态（通常是boolean ）。
/* Bad */
const isProductsExist = productsCount > 0
const areProductsPresent = productsCount > 0
/* Good */
const hasProducts = productsCount > 0should反映了一个积极的条件陈述（通常是boolean ）以及一定的动作。
function shouldUpdateUrl ( url , expectedUrl ) {
return url !== expectedUrl
}min / max代表最小值或最大值。描述边界或限制时使用。
/**
* Renders a random amount of posts within
* the given min/max boundaries.
*/
function renderPosts ( posts , minPosts , maxPosts ) {
return posts . slice ( 0 , randomBetween ( minPosts , maxPosts ) )
}prev / next在当前上下文中指示变量的上一个或下一个状态。描述状态转换时使用。
function fetchPosts ( ) {
const prevPosts = this . state . posts
const fetchedPosts = fetch ( '...' )
const nextPosts = concat ( prevPosts , fetchedPosts )
this . setState ( { posts : nextPosts } )
} 像前缀一样，可变名称可以根据单个值还是多个值制成单数或复数形式。
/* Bad */
const friends = 'Bob'
const friend = [ 'Bob' , 'Tony' , 'Tanya' ]
/* Good */
const friend = 'Bob'
const friends = [ 'Bob' , 'Tony' , 'Tanya' ]
