Делать обычное дело хорошо — это обычное дело. Делать обычное дело хорошо — это экстраординарно.
1. Введение
Если в информатике есть только две сложные проблемы: инвалидация кеша и именование. Тогда я думаю, что трудностей в назывании всего две: лексика и настойчивость в выполнении установленных норм.
Недавно видел это на Zhihu:Как программист, есть ли какие-либо названия программ, которые заставят вас потерять дар речи и вылететь?. Сразу же я испытал много эмоций, потому что нейминг — сложная проблема для программистов, иногда из-за нейминга он может ввести в заблуждение и сомнения у других, а влияние на эффективность разработки и качество проекта может быть большим или маленьким. Сегодня я также делюсь привычкой именования, которую я использую в последнее время, конечно, это просто личная привычка. Я надеюсь увидеть метод именования, рекомендованный всеми в области комментариев, учиться друг у друга и общаться.
Что касается всего содержания, в основном есть два упоминания:
1. Как писать имена, понятные другим
2. Для разных объектов используйте формат именования объектов
2. Запишите эти трудночитаемые имена
Во-первых, окружающим сложно понять некоторые способы именования. Когда вы видите эти ситуации, вы должны стараться избегать их в разработке.
2-1. Слова с ошибками
Например
//提交表单（把 Form 写成了 From ）
submitFrom(){...}
Как я уже писал ранее, я сказал, что правильное написание слов можно назвать практическим результатом. Если в слове написана ошибка, например, form и from являются правильными словами, но имеют совершенно разные значения, если вы пишете form as from , люди, которые прочитают код позже (возможно, вы сами), скорее всего, будут сбиты с толку.
2-2. Смешанное использование китайского и английского языков
Ошибка орфографии Word будет вводить в заблуждение других, китайскую и английскую смесью этот метод именования можно сказать, что люди чувствуют себя в тумане в облаке, не будут вводить в заблуждение, только не понимают.
Например, следующее
let chanpinList=[];
Это имя переменной, я сначала не знал, что это такое, и комментариев не было, это совершенно сбивало с толку. Посмотрев на требования, я понял, что это означает: список продуктов.
2-3.Имена 1-9, а-я
Я думаю, что все сталкивались с такой ситуацией, например, на странице есть несколько кнопок, некоторые называют их btn1, btn2, btn3, btn4.... Или бтнА, бтнБ, бтнС, бтнД. Такое именование может показаться простым, но на самом деле из этих именований нельзя прочитать никакой информации, что может оказаться более болезненным в будущем.
2-4. Смешанные форматы именования
Можно сказать, что это не так уж и ненавистно, но смотреть на это неудобно, например, это означает список комментариев, одно место называется так: комментарии, другое место так и называется: комментарий-список, а он называется так: commentList. Смешивая несколько норм вместе, это кажется нестандартным.
Бывает и ситуация, которая обычно не встречается, но тоже встречается. Например, в месте есть кнопка для добавления поставщиков: addSupplier. Так же есть такая же функциональная кнопка в другом месте, точно такая же, и результат называется: addSupplierInfo. В то время я думал, что эти две функции не являются одной и той же функцией, что вызвало недопонимание.
2-5. Обязательное название китайского пиньинь
Некоторые существительные, созданные китайцами (Taobao-taobao, Weibo-weibo), не имеют английского перевода. Его можно назвать на китайском языке пиньинь, а другим предлагается на английском языке.
Но иногда, даже если есть английские слова, некоторые люди все еще используют китайский пиньинь для их названия, например, список статей, многие люди просто не используют articleList и пишут напрямую wenzhangliebiao. Но когда вы посмотрите его, вы будете ошеломлены на некоторое время.
2-6 Обязательная стенография
Хотя введение может сделать название более лаконичным, оно иногда встречается с обязательными сокращенными именами, такими как функция, которая отправляет информацию о комментарии пользователя. Первоначально предполагалось, что это будет: handleCommentSubmit/submitComment/publishComment. Результаты смотрите позже --tjyhpl. Обязательной аббревиатурой по-прежнему остается аббревиатура пиньинь, позже его попросили изменить на ас. Позже, когда я спросил, я понял, что то, что он хотел выразить, было addComment, и он почти начал это в то время.
2-7. Нет различия между единственным и множественным числом
Ситуация неплохая, это просто норма, раньше было две функции работы, одна загрузка всех данных заказа, а другая загрузка данных текущего заказа. Но имена двух функций, одна — downloadOrderData, а другая — downloadOrder. Это тоже создавало некоторую путаницу.
Столкнувшись с такой ситуацией, рекомендуется различать заказы во множественном числе, downloadOrder, downloadOrderAll/downloadOrderList. Именование единственного и множественного числа различается.Если есть возвращаемое значение, оно также может быть известно другим.Единственное число может возвращать одну запись, а множественное число может возвращать массив.
2-8. Неправильное использование антонимов
Эта ситуация такая же, как и выше, она неплохая, ее можно расценивать только как неправильную. Например: есть две рабочие функции, одна для отображения всплывающего окна, а другая для закрытия всплывающего окна. Результат назван выше, один из них — showEditDialog. Другой — closeEditDialog.
В приведенном выше случае показать и закрыть, одно — отобразить, а другое — закрыть, очевидно, что они не являются синонимами. Должны появиться следующие жесты: showEditDialog и hideEditDialog или openEditDialog и closeEditDialog.
2-9. Назовите как хотите
Есть и другие забавные имена, ситуация, увиденная на Чжиху, и ситуация, с которой столкнулись другие. Давайте перейдем к Zhihu, это не повторяется слишком много.
3. Именование родственных форматов
Закончив называть первое, названное слово должно быть написано правильно. Давайте поговорим о родственном формате именования.Прежде чем говорить о вашем собственном именованном экземпляре, давайте поговорим о разных именованных объектах, а также о разных методах именования. детали следующим образом:
| предмет, который нужно назвать | Рекомендуемое имя |
|---|---|
| картина | строчные буквы, разделенные "-" или "_" |
| CSS (класс, ID) | '-' расколоть |
| файл, переменная | имя горба |
| js-класс (класс) | имя большого горба |
| постоянный | Столичные буквы, сегментация '_' |
| временная переменная, частная переменная | Начинается с '_', верблюжий регистр |
4. HTML-именование
Прежде чем говорить об именовании HTML-нейминга, давайте поговорим о трех концепциях верстки: модуле (module) и компоненте (unit).
Модуль: множество общих модулей веб-контента, обычно большего размера, которые можно использовать повторно, например навигация, меню, слайд-шоу, графические списки и т. д. Рекомендуется, чтобы имя предварялосьm-
Компоненты: различные общие компоненты веб-контента, такие как кнопки, заголовки, поля ввода и т. д. Рекомендуется, чтобы имя предварялосьu-
Отношения между ними, модуль содержит компоненты, а компоненты образуют модуль.
небольшой пример
См. небольшое всплывающее окно выше. Все всплывающее окно рассматривается как модуль. В качестве компонентов можно использовать заголовки, подсказки и кнопки. Код HTML выглядит следующим образом, код CSS, JS не будет опубликован. модульm-, компонент занимаетu-
<div class="m-alert">
<div class="m-box">
<div class="m-box-inner">
<div class="u-title">提示2</div>
<div class="u-content">这里是提示内容2</div>
</div>
<div class="m-box-buttons">
<span class="u-btn-success">确定</span>
</div>
</div>
</div>
Что же касается преимуществ и недостатков такого способа написания, а также вопросов, требующих внимания, я не буду здесь их обсуждать, а напишу статью позже.
5. Именование JavaScript
В js-нейминге должно быть только четыре метода именования: маленький горб (productList), большой горб (ProductList), символы верхнего регистра, разделение подчеркивания (PRODUCT_LIST), начало подчеркивания + маленький горб (_productList)
5-1. Название по типу
5-1-1.Небольшой горб
При написании js самое главное — небольшое горбовое именование. Переменные и функции обычно именуются с использованием маленького верблюжьего регистра.
//登录处理函数
let handleLogin=function(){}
5-1-2 Большой горб
До es6 в js не было понятия класса, но он не мог организовать разработчиков для имитации класса. Теперь, когда есть классы, естественно, соглашения об именах классов еще более неразделимы. Что касается соглашения об именах классов, многие люди должны привыкнуть называть их с большим верблюжьим регистром.
//创建一个类
class Person{
//...
}
5-1-3. Константы
Постоянные рекомендации или заглавные буквы + подчеркнутое имя.
//配置最大金额
const PRICE_MAX=10000;
5-1-4.Частные переменные
Частные переменные относятся к внешней области, чтобы различать, является ли переменная общедоступной или частной. Рекомендуется различать приведенные выше имена, а для приватных переменных рекомендуется использовать метод именования подчеркивания + горба.
let myObj={
name:'守候',
setName(){
//保存当前的this
let _this=this;
setTimeOut(function(){
alert(_this.name)
},1000)
}
}
5-2. Именование по обязанностям
Имена функций обычно начинаются с глаголов.
5-2-1. Получите ценность
Если функция должна получить значение (функция вернет значение в конце), рекомендуется получить перед функцией.
//根据 ID 获取用户信息
function getUserInfo(id){
}
5-2-2 Значение настройки
Если функция должна установить значение (функция вернет значение в конце), а выполнение функции должно присвоить значение переменной, рекомендуется установить перед функцией.
//设置用户信息
function setUserInfo(){
}
5-2-3. Действия по обработке
Если функция предназначена для обработки некоторых операций, таких как вход в систему, регистрация, отображение списка и т. д. Тогда рекомендуется, чтобы имя предварялось дескриптором.
//分页操作
handleChangeCurrent(val){
}
//注册操作
handleRegister(){
}
Это действие обработки, некоторые разработчики также используют для запуска непосредственно с действия. openDialog, closeDialog и т. д.
6. Имя каталога, файла, изображения
6-1 Каталог, правила именования имен файлов
Унифицированный маленький верблюжий кейс.
Следующий пример:
| каталог, файл | предложенное название |
|---|---|
| титульная страница | индекс, index.html |
| страница поиска | поиск, search.html |
| Список продуктов | список продуктов, список продуктов.html |
| Страница сведений о продукте | productDetail, productDetail.html |
| список новостей | список новостей, список новостей.html |
| Страница сведений о новостях | новости, новости.html |
| список комментариев | список комментариев, список комментариев.html |
| насчет нас | о, о.html |
Если вы считаете, что название слишком длинное, вы можете договориться о формате аббревиатуры в команде: например, product сокращается как pro.
6-2 Соглашение об именах изображений
Если это изображение общего назначения, такое как ЛОГОТИП, меню, боковая панель, фон и т. д., назовите его непосредственно строчными буквами. Например: logo.jpg, menu.jpg, aside.jpg, bg.jpg.
Если это не общая картина, рекомендуетсяКатегория-Модуль-Функцияформат. Используйте строчные буквы, '-' или '_' для разделения, как в следующем примере:
| имя изображения | значимость |
|---|---|
| btn-submit-comment.jpg | кнопка оставить отзыв |
| bg-product-list.jpg | Фон модуля списка товаров |
| icon-views.png | Значок просмотров |
| icon-btn-vote.png | кнопка голосования |
| ad-news-aside.jpg | Рекламное изображение в сайдбаре новостей |
7. Ссылки
Некоторые предложения по написанию внешнего интерфейса
Соглашения об именах CSS для командной работы
8. Резюме
Что касается именования, то это легко и сложно. Это также беспокоит многих разработчиков, включая меня. Метод именования в этой статье также является личным методом именования, который я использую, и я надеюсь, что он принесет пользу всем. Конечно, есть еще много недостатков, я надеюсь, что вы можете дать больше указателей или порекомендовать метод именования, который вы предлагаете.
Что касается соглашений об именах, у каждой компании есть свои собственные соглашения о кодировании, но очень немногие компании могут серьезно реализовать свои собственные соглашения, что приводит к путанице в именах. Итак, сложность именования, я не думаю, что само именование сложно, сложность заключается в проекте, перед лицом различных объектов, которые необходимо назвать, настаивать на использовании набора форматов именования и правильно называть каждое имя .
------------------------- Великолепная разделительная линия --------------------
Если вы хотите узнать больше, общаться со мной и продвигать вакансии, добавьте меня в WeChat. Или обратите внимание на мой паблик WeChat: В ожидании книжного магазина