├── README.md ├── css-codestyle.md ├── editorconfig.md ├── how-to-pull-request.md ├── html-codestyle.md └── js-codestyle.md /README.md: -------------------------------------------------------------------------------- 1 | # Guides 2 | 3 | - [Как сделать pull request](how-to-pull-request.md) 4 | - [Требования к оформлению HTML](html-codestyle.md) 5 | - [Требования к оформлению CSS](css-codestyle.md) 6 | - [Требования к оформлению JS](js-codestyle.md) 7 | - [Про editorconfig](editorconfig.md) 8 | -------------------------------------------------------------------------------- /css-codestyle.md: -------------------------------------------------------------------------------- 1 | # Требования к оформлению CSS 2 | 3 | * Длина строки не должна превышать **80 символов**. 4 | 5 | * В качестве отступов используем **4 пробела**. 6 | 7 | * В конце файла оставляем пустую строку 8 | 9 | * Имена селекторов должны отражать смысл 10 | 11 | ```css 12 | /* Плохо */ 13 | .a, 14 | .foo, 15 | .red, 16 | {} 17 | 18 | /* Хорошо */ 19 | .logo 20 | {} 21 | ``` 22 | 23 | * В именах селекторов можно использовать только `a-z` и `-` 24 | 25 | ```css 26 | /* Плохо */ 27 | .user_name, 28 | .user-1, 29 | .LOGO 30 | {} 31 | 32 | /* Хорошо */ 33 | .user-name, 34 | .first-user, 35 | .logo 36 | {} 37 | ``` 38 | 39 | * Каждый новый селектор пишем с новой строки 40 | 41 | ```css 42 | /* Плохо */ 43 | .user-name, .first-user, .logo 44 | {} 45 | 46 | 47 | /* Хорошо */ 48 | .user-name, 49 | .first-user, 50 | .logo 51 | {} 52 | ``` 53 | 54 | * Открывающую скобку размещаем с новой строки: 55 | 56 | ```css 57 | /* Плохо */ 58 | .user-name { 59 | font-weight: bold; 60 | } 61 | 62 | /* Хорошо */ 63 | .user-name 64 | { 65 | font-weight: bold; 66 | } 67 | ``` 68 | 69 | * Между наборами правил размещаем одну пустую строку 70 | 71 | ```css 72 | /* Плохо */ 73 | .user-name 74 | { 75 | font-weight: bold; 76 | } 77 | .logo 78 | { 79 | float: left; 80 | } 81 | 82 | /* Хорошо */ 83 | .user-name 84 | { 85 | font-weight: bold; 86 | } 87 | 88 | .logo 89 | { 90 | float: left; 91 | } 92 | ``` 93 | 94 | * Каждое правило размещаем в новой строке 95 | 96 | ```css 97 | /* Плохо */ 98 | .user-name 99 | { 100 | font-weight: bold; color: #f00; 101 | } 102 | 103 | /* Хорошо */ 104 | .user-name 105 | { 106 | font-weight: bold; 107 | color: #f00 108 | } 109 | ``` 110 | 111 | 112 | * Каждое правило обязательно заканчиваем `;` (даже последнее) 113 | 114 | ```css 115 | /* Плохо */ 116 | .user-name 117 | { 118 | font-weight: bold; 119 | color: #f00 120 | } 121 | 122 | /* Хорошо */ 123 | .user-name 124 | { 125 | font-weight: bold; 126 | color: #f00; /* <--- */ 127 | } 128 | ``` 129 | 130 | * Между правилом и значением ставим `:` и один пробел 131 | 132 | ```css 133 | /* Плохо */ 134 | .user-name 135 | { 136 | font-weight : bold; 137 | color:#f00; 138 | } 139 | 140 | /* Хорошо */ 141 | .user-name 142 | { 143 | font-weight: bold; 144 | color: #f00; 145 | } 146 | ``` 147 | 148 | * Не используем `id` в качестве селекторов в CSS 149 | 150 | ```css 151 | /* Плохо */ 152 | #user-name 153 | { 154 | color: #f00; 155 | } 156 | 157 | /* Хорошо */ 158 | .user-name 159 | { 160 | color: #f00; 161 | } 162 | ``` 163 | 164 | ### В HTML 165 | 166 | * Не используем атрибут `style`, вместо него указываем атрибут `class`, 167 | стили пишем в CSS в отдельном файле 168 | 169 | ```html 170 | 171 |
gogoleff
172 | 173 | 174 |
gogoleff
175 | ``` 176 | 177 | ### Рекомендованные правила 178 | 179 | * Рекомендуется не указывать единицы измерения у нулевых значений 180 | 181 | ```css 182 | /* Плохо */ 183 | .user-name 184 | { 185 | width: 0px; 186 | } 187 | 188 | /* Хорошо */ 189 | .user-name 190 | { 191 | width: 0; 192 | } 193 | ``` 194 | * Рекомендуется не указывать 0 в целой части у дробных значений 195 | 196 | ```css 197 | /* Плохо */ 198 | .user-name 199 | { 200 | font-size: 0.5em; 201 | } 202 | 203 | /* Хорошо */ 204 | .user-name 205 | { 206 | font-size: .5em; 207 | } 208 | ``` 209 | 210 | * Рекомендуется в качестве указания цвета использовать HEX строчными буквами, 211 | по возможности сокращая 212 | 213 | ```css 214 | /* Плохо */ 215 | .user-name 216 | { 217 | color: red; 218 | color: #ff0000; 219 | color: #FF0000; 220 | color: rgb(255, 0, 0); 221 | } 222 | 223 | /* Хорошо */ 224 | .user-name 225 | { 226 | color: #f00; 227 | } 228 | ``` 229 | -------------------------------------------------------------------------------- /editorconfig.md: -------------------------------------------------------------------------------- 1 | # EditorConfig 2 | 3 | В каждую задачу мы будем размещать файл `.editorconfig`. Этот файл содержит 4 | __базовые правила__ оформления кода (codestyle), понятные для большинства 5 | редакторов: WebStorm, Notepad++, Sublime, Atom, ... 6 | 7 | Обычно редакторы, обнаруживая этот файл, сами приводят ваш код в порядок. 8 | Для чаще всего необходимо установить модуль для редактора: 9 | 10 | - __WebStorm__ 11 | Он уже там есть, достаточно включить его в настройках «Настройки -> Плагины -> Editorconfig». 12 | 13 | - __Notepad++__ 14 | Устанавливаем через менеджер плагинов «Plugins -> Plugin Manager -> Show Plugin Manager -> Available». 15 | Находим «EditorConfig» и нажимаем «Install». 16 | 17 | - __Sublime__ 18 | Устанавливаем плагин https://packagecontrol.io/search/Editorconfig 19 | 20 | - __Atom__ 21 | Устанавливаем плагин https://atom.io/packages/editorconfig 22 | 23 | Сам файл содержит следующие правила: 24 | 25 | ```ini 26 | # Для всех файлов 27 | [*] 28 | 29 | # Установить кодировку utf-8 30 | charset = utf-8 31 | 32 | # В качестве переноса строки использовать символ LF (line feed) 33 | end_of_line = lf 34 | 35 | # В качестве отступов использовать 4 пробела 36 | indent_size = 4 37 | indent_style = space 38 | 39 | # В конце файла добавить пустую строку 40 | insert_final_newline = true 41 | 42 | # В конце каждой строки удалять лишниее пробелы 43 | trim_trailing_whitespace = true 44 | ``` 45 | 46 | Подробнее можно почитать на http://editorconfig.org/ 47 | 48 | ![](http://editorconfig.org/logo.png) 49 | -------------------------------------------------------------------------------- /how-to-pull-request.md: -------------------------------------------------------------------------------- 1 | # Как сделать pull request 2 | 3 | - [Регистрация на GitHub](how-to-pull-request.md#Регистрация-на-github) 4 | - [Как сделать pull request прямо на GitHub](how-to-pull-request.md#Как-сделать-pull-request-прямо-на-github) 5 | - [Как сделать pull request в windows](how-to-pull-request.md#Как-сделать-pull-request-в-windows) 6 | - [Как сделать pull request в windows, используя Git Shell](how-to-pull-request.md#Как-сделать-pull-request-в-windows-используя-git-shell) 7 | - [Как сделать pull request в linux](how-to-pull-request.md#Как-сделать-pull-request-в-linux) 8 | - [Полезные ссылки](how-to-pull-request.md#Полезные-ссылки) 9 | 10 | ### Регистрация на GitHub 11 | 12 | Если у вас нет аккаунта на Github – регистрируемся по ссылке http://github.com/join 13 | 14 | 15 | Если есть – просто входим по ссылке http://github.com/login 16 | 17 | 18 | ### Как сделать pull request прямо на GitHub 19 | 20 | **Шаг 1.** Заходим в основной репозиторий задачи https://github.com/urfu-2015/verstka-tasks-1 21 | И делаем форк задачи к себе. Для этого жмём «fork» в правом верхнем углу. 22 | 23 | > Форк (fork) можно расматривать, как личную копию основного репозитория. 24 | 25 | **Шаг 2.** Заходим к себе https://github.com/gogoleff/verstka-tasks-1. Вместо gogoleff свой логин. 26 | 27 | 28 | 29 | **Шаг 3.** Нажимаем на файл, который хотим изменить. Затем кнопку редактирования. 30 | 31 | 32 | 33 | **Шаг 4.** Редактируем файл до готовности прямо здесь (или вставляем код из любимого редактора) 34 | 35 | 36 | 37 | **Шаг 5.** Когда всё готов создадим коммит. 38 | Для этого внизу в поле «summary» вводим поясняющий текст, и нажимаем «Commit changes». 39 | 40 | > Коммит (commit) – можно рассматривать, как утверждение кода, создание версии (как в wiki). 41 | К каждой версии можно вернуться. Каждый новый коммит – новая версия вашего кода. 42 | 43 | 44 | 45 | **Шаг 6.** Создаём pull request. Для этого выбираем пункт меню справа «Pull requests». 46 | И нажимаем кнопку «New pull request». 47 | 48 | > Пулл (pull request) - сравнение ветки в личном репозитории с кодом основного. 49 | Так мы увидим изменения, которые вы сделали. Обычно пулл затем вливают в основной репозиотрий, 50 | но мы этого делать не будем :) 51 | 52 | 53 | 54 | **Шаг 7.** Нажимаем кнопку «Create pull request» 55 | 56 | 57 | 58 | **Шаг 8.** Вводим своё ФИО и нажимаем кнопку «Create pull request» 59 | 60 | 61 | 62 | **Готово!** 63 | 64 | Если нужны правки, просто повторяем шаги со 2 по 5. 65 | 66 | ### Как сделать pull request в windows 67 | 68 | **Шаг 1.** Заходим в основной репозиторий задачи https://github.com/urfu-2015/verstka-tasks-1 69 | И делаем форк задачи к себе. Для этого жмём «fork» в правом верхнем углу. 70 | 71 | > Форк (fork) можно расматривать, как личную копию основного репозитория. 72 | 73 | 74 | 75 | **Шаг 2.** Затем скачивание приложение по ссылке https://desktop.github.com/ 76 | 77 | 78 | **Шаг 3.** Устанавливаем. После установки приложение попросит настроить его. Вводим логин и пароль. 79 | 80 | 81 | **Шаг 4.** Затем полное имя и электронную почту (обычно уже верно заполнены). 82 | 83 | 84 | **Шаг 5.** После настройки вы попадёте в приложение. Теперь клонируем репозиторий с задачей. 85 | Для этого нажимаем «+» в левом верхнем углу, выбираем свой логин слева, и репозиторий `verstka-tasks-1` справа. 86 | 87 | > Клон (clone) можно расматривать, как локальную копию личного репозитория. 88 | 89 | 90 | 91 | **Шаг 6.** Выбираем рабочую директорию (обычно уже подходящая). 92 | 93 | 94 | **Шаг 7.** Теперь заходим в директорию (там должны быть файлы index.html и README.md). 95 | 96 | 97 | **Шаг 9.** Решаем задачу, редактируем файлы в **любимом** редакторе до полной готовности. 98 | В приложении видим изменения. 99 | 100 | 101 | 102 | **Шаг 10.** Когда всё готов создадим коммит. 103 | Для этого внизу в поле «summary» вводим поясняющий текст, и нажимаем «Commit to master». 104 | 105 | > Коммит (commit) – можно рассматривать, как утверждение кода, создание версии (как в wiki). 106 | К каждой версии можно вернуться. Каждый новый коммит – новая версия вашего кода. 107 | 108 | 109 | 110 | В результате видим сообщение: 111 | 112 | 113 | **Шаг 11.** Таким образом мы утвердили наши изменения в локальном (склонированном) репозитории. 114 | Теперь необходимо отправить ветку с изменениями в удалённый личный (форк) на github.com и сделать pull request. 115 | В качестве название пулл-реквеста вводим своё ФИО и нажимаем «Send Pull Request». 116 | 117 | > Пулл (pull request) - сравнение ветки в личном репозитории с кодом основного. 118 | Так мы увидим изменения, которые вы сделали. Обычно пулл затем вливают в основной репозиотрий, 119 | но мы этого делать не будем :) 120 | 121 | 122 | 123 | В результате видим сообщение: 124 | 125 | 126 | **Готово!** 127 | 128 | Если нужны правки, повторяем шаги 9 и 10. Затем нажимаем «Sync» в правом верхнем углу. 129 | Приложение отправит коммит в удалённый личный репозиторий (форк), 130 | что автоматически обновит pull request. 131 | 132 | 133 | 134 | ### Как сделать pull request в windows, используя Git Shell 135 | 136 | Здесь два варианта: 137 | 138 | - Устанавливаем Git Bash https://git-scm.com/download/ 139 | 140 | После установки, запускаем Git Bash 141 | (ярлык для запуска можно найти в меню Пуск). 142 | 143 | - Устанавливаем вместе с приложением Git Shell. 144 | Для этого выполняем шаги со 2 по 4 раздела [Как сделать pull request в windows](how-to-pull-request.md#Как-сделать-pull-request-в-windows) 145 | 146 | После установки приложения, запускаем Git Shell 147 | (ярлык для запуска можно найти на рабочем столе). 148 | 149 | Далее смотрим shell команды в разделе [как сделать pull request в linux](how-to-pull-request.md#Как-сделать-pull-request-в-linux). 150 | 151 | ### Как сделать pull request в linux 152 | 153 | Заходим в основной репозиторий задачи https://github.com/urfu-2015/verstka-tasks-1 154 | И делаем форк задачи к себе. Для этого жмём «fork» в правом верхнем углу. 155 | 156 | В linux уже установлен git и обычно настроен. 157 | 158 | **Шаг 1.** Выполняем следующие команды в терминале: 159 | 160 | ```bash 161 | # Клонируем репозиторий (вместо gogoleff – ваш логин) 162 | git clone https://github.com/gogoleff/verstka-tasks-1.git verstka-tasks-1 163 | 164 | # Заходим в созданную папку с клоном 165 | cd verstka-tasks-1 166 | 167 | # Решаем задачу в любимом редакторе... 168 | 169 | # Добавляем все изменённые файлы через пробел 170 | git add index.html 171 | 172 | # Коммитим (утверждаем изменения) 173 | git commit -m "Моё решение задачи" 174 | 175 | # Отправляем ветку с коммитом в удалённый личный (origin) репозиторий 176 | # (может попросить ввод логина и пароля) 177 | git push origin master 178 | ``` 179 | 180 | **Шаг 2.** Заходим в к себе в репозиторий. 181 | 182 | 183 | **Шаг 3.** Создаём pull request. Для этого выбираем пункт меню справа «Pull requests». 184 | И нажимаем кнопку «New pull request». 185 | 186 | > Пулл (pull request) - сравнение ветки в личном репозитории с кодом основного. 187 | Так мы увидим изменения, которые вы сделали. Обычно пулл затем вливают в основной репозиотрий, 188 | но мы этого делать не будем :) 189 | 190 | 191 | 192 | **Шаг 4.** Нажимаем кнопку «Create pull request» 193 | 194 | 195 | 196 | 197 | **Шаг 5.** Вводим своё ФИО и нажимаем кнопку «Create pull request» 198 | 199 | 200 | 201 | **Готово!** 202 | 203 | Если нужны правки. Вносим их в **любимом** редакторе, и снова делаем коммит. 204 | 205 | ```bash 206 | # Добавляем все изменённые файлы через пробел 207 | git add index.html 208 | 209 | # Коммитим 210 | git commit -m "Мои исправления" 211 | 212 | # Отправляем новый коммит в удалённый репозиторий 213 | git push 214 | ``` 215 | 216 | ### Полезные ссылки 217 | 218 | - Можно самостоятельно пройти курс по основам Git на [GitHowTo](http://githowto.com/ru/setup) 219 | -------------------------------------------------------------------------------- /html-codestyle.md: -------------------------------------------------------------------------------- 1 | # Требования к оформлению HTML 2 | 3 | ### Отступы и длина строки 4 | 5 | * Длина строки не должна превышать **110 символов**. 6 | 7 | * В качестве отступов используем **4 пробела**. 8 | 9 | * Не должно быть лишних пустых строк, если это не обусловлено лучше читаемостью: 10 | 11 | ``` html 12 | 13 |

Абзац текст

14 | 15 | 16 |

Ещё один

17 | 22 | 23 | 24 |

Абзац текст

25 |

Ещё один

26 | 30 | ``` 31 | 32 | * Не должно быть лишних пробелов: 33 | 34 | ``` html 35 | 36 | 40 | HP 41 | 42 | 43 | 44 | 48 | HP 49 | ``` 50 | 51 | * Необходимо соблюдать правила вложенности согласно примерам: 52 | 53 | ``` html 54 |
Здесь мало текста, он влезает в 110 символов, не переносим
55 |
56 | А здесь уже более длинный текст, не влезает в 110 символов, переносим его 57 | на новую строку внутри элемента и делаем отступ в 4 пробела. 58 |
59 |
60 |
61 | Вложенные элементы (кроме текстовых) переносим внутрь родительского 62 | элемента на новую строку и делаем отступ в 4 пробела. 63 |
64 | Ещё немного текста 65 |
Ещё один элемент
66 |
67 |
68 |
69 | Текстовые элементы ведут себя как текст, каким бы длинным не было 70 | их содержимое, такие дела. 71 |
72 |
73 | ``` 74 | 75 | ### Именование тегов и атрибутов 76 | 77 | * Пишем теги строчными буквами: 78 | 79 | ``` html 80 | 81 | Яндекс.Блог 82 | 83 | 84 | Яндекс.Блог 85 | 86 | ``` 87 | 88 | * Void elements (одиночные) теги не закрываем, normal elements (парные) **закрываем всегда**: 89 | 90 | ``` html 91 | 92 | 93 | 94 | 98 | 99 | 100 | 101 | 102 | 103 | 107 | ``` 108 | 109 | * Пишем атрибуты строчными буквами: 110 | 111 | ``` html 112 | 113 | HP 114 | 115 | 116 | HP 117 | ``` 118 | 119 | * Одиночные атрибуты пишем без значений, а остальные со значениями **в двойных кавычках**: 120 | 121 | ``` html 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | ``` 131 | 132 | * Зарезервированные значения атрибутов пишем строчными буквами: 133 | 134 | ``` html 135 | 136 | 137 | 138 | 139 | 140 | ``` 141 | 142 | ### Обязательные элементы и атрибуты 143 | 144 | * Всегда указываем: 145 | 146 | - `` 147 | - `` 148 | - `` 149 | - `` 150 | - `` 151 | - `<meta charset="utf-8">` 152 | <br> 153 | <br> 154 | 155 | ``` html 156 | <!-- Хорошо --> 157 | <!DOCTYPE html> 158 | <html lang="ru"> 159 | <head> 160 | <meta charset="utf-8"> 161 | <title>Яндекс.Блог 162 | 163 | 164 | 165 | 166 | 167 | ``` 168 | 169 | * У изображений всегда указываем атрибут `alt=""`: 170 | 171 | ### Запрещённые элементы и атрибуты 172 | 173 | * Устаревшие элементы: `
`, ``, `` и другие 174 | * Элементы визуальной разметки: ``, ``, ``, `` и другие 175 | * Устаревшие атрибуты: `border` для таблиц, `type` для списков, 176 | `align` для выравнивания и другие 177 | 178 | ### Экранирование символов 179 | 180 | * В тексте элементов всегда заменяем символы `<` и `>` на `<` и `>` 181 | 182 | ``` html 183 | 184 |
Текст с <угловыми> скобками
185 | 186 | 187 |
Текст с <угловыми> скобками
188 | ``` 189 | -------------------------------------------------------------------------------- /js-codestyle.md: -------------------------------------------------------------------------------- 1 | # Требования к оформлению JavaScript 2 | Ниже приведен список правил, на которые мы обращаем внимание при приеме домашних заданий. 3 | 4 | ### Переменные 5 | 1. Имена переменных пишутся в `camelCase`, имена констант - заглавными буквами, разделяя подчеркиваниями. 6 | 7 | __Плохо:__ 8 | ``` javascript 9 | var students_count; // В качестве разделителя используется `_` 10 | var Language; // Первая буква - прописная 11 | ``` 12 | 13 | __Хорошо:__ 14 | ``` javascript 15 | var studentsCount; 16 | var language; 17 | var MILLISECONDS_IN_DAY; // Если это константа 18 | ``` 19 | 20 | 2. Для именования переменных использовать только английские слова, не использовать транслит. 21 | 22 | __Плохо:__ 23 | ``` javascript 24 | var cena; 25 | var ssilka; 26 | var процент; 27 | ``` 28 | 29 | __Хорошо:__ 30 | ``` javascript 31 | var price; 32 | var link; 33 | var percent; 34 | ``` 35 | 36 | 3. Название переменной должно нести смысл, быть однозначным и понятным, отражать хранимое значение. 37 | 38 | __Плохо:__ 39 | ``` javascript 40 | var a, b, c; // Из названия непонятно, для чего нужны эти переменные 41 | var array; // Слишком общее название, непонятно, к чему относится 42 | var visible; // Непонятно, данные какого типа хранятся в переменной 43 | ``` 44 | 45 | __Хорошо:__ 46 | ``` javascript 47 | var beginDate, endDate; 48 | var posts; 49 | var isVisible; 50 | ``` 51 | В качестве итераторов цикла допустимо использовать `i`, `j`, ... 52 | 53 | 4. Старайтесь не использовать сокращения в переменных. Но и не пишите слишком длинные имена. 54 | 55 | __Плохо:__ 56 | ``` javascript 57 | var idx; 58 | var btn; 59 | var dateOfFirstPublicationForCurrentPost; 60 | ``` 61 | 62 | __Хорошо:__ 63 | ``` javascript 64 | var index; 65 | var button; 66 | var publishDate; 67 | ``` 68 | 69 | 5. Объявляйте переменные максимально близко к месту использования. 70 | 71 | __Плохо:__ 72 | ``` javascript 73 | var canPublish = ...; // Далеко от места использования 74 | var comments = ...; 75 | var overalRaiting = 0; 76 | 77 | for (var i = 0; i < comments.length; i++) { 78 | overalRaiting += comments[i].raiting; 79 | } 80 | 81 | if (canPublish) { ... } 82 | ``` 83 | 84 | __Хорошо:__ 85 | ``` javascript 86 | var comments = ...; 87 | var overalRaiting = 0; 88 | 89 | for (var i = 0; i < comments.length; i++) { 90 | overalRaiting += comments[i].raiting; 91 | } 92 | 93 | var canPublish = ...; // Максимально близко к месту использования 94 | 95 | if (canPublish) { ... } 96 | ``` 97 | 6. Для именования функций используйте глаголы: 98 | 99 | __Плохо:__ 100 | ``` javascript 101 | function length() { ... } 102 | function title(name) { ... } 103 | function publish() { ... } 104 | ``` 105 | 106 | __Хорошо:__ 107 | ``` javascript 108 | function getLength() { ... } 109 | function setTitle(name) { ... } 110 | function canPublish() { ... } 111 | ``` 112 | 113 | ### Кодстайл 114 | Для проверки кодстайла используем утилиту [JSCS](https://github.com/jscs-dev/node-jscs). Чтобы запустить её на вашем компьютере 115 | необходимо: 116 | 1. Клонировать репозиторий с домашним заданием ([инструкция](https://github.com/urfu-2015/guides/blob/master/how-to-pull-request.md) по работе с GitHub). 117 | 2. Зайти в консоли в папку с клонированными файлами 118 | 3. Выполнить `npm install` для установки JSCS 119 | 4. Выполнить `npm run lint` каждый раз, когда хотим проверить кодстайл. 120 | 121 | Если ваш код полностью удовлетворяет кодстайлу - вы увидите сообщение `No code style errors found.`, иначе – список ошибок. 122 | Если что-то вам не понятно, всегда можно спросить ментора :) 123 | 124 | ### Общие правила 125 | 1. Избегайте большой вложенности 126 | 127 | __Плохо:__ 128 | ``` javascript 129 | function () { 130 | if (...) { // Первый уровень вложенности 131 | if (...) { // Второй уровень вложенности 132 | if (...) { // Третий уровень вложенности 133 | // ... 134 | if (...) { // Десятый уровень вложенности 135 | } 136 | } 137 | } 138 | } 139 | } 140 | ``` 141 | 142 | Старайтесь не использовать больше двух уровней вложенности 143 | 144 | __Хорошо:__ 145 | ``` javascript 146 | function () { 147 | if (...) { // Первый уровень вложенности 148 | if (...) { // Второй уровень вложенности 149 | } 150 | } 151 | } 152 | ``` 153 | 2. Не передавайте в функцию слишком много аргументов: 154 | 155 | __Плохо:__ 156 | ``` javascript 157 | function (title, annotation, body, publishDate, tags, author) { 158 | // ... 159 | } 160 | ``` 161 | 162 | Старайтесь передавать не больше трех параметров 163 | 164 | __Хорошо:__ 165 | ``` javascript 166 | function (postData, author, metaData) { 167 | // ... 168 | } 169 | ``` 170 | 3. Используйте строгий режим. 171 | 172 | ``` 173 | 'use strict'; // Пишем вначале каждого файла 174 | ``` 175 | 4. Если код кажется вам не очевидным - постарайтесь сделать его проще, лучше, читаемее. 176 | Если даже после рефакторинга остались неочевидные места - оставьте комментарий. 177 | 178 | 5. Не повторяйтесь. Не пишите похожий код несколько раз, старайтесь его переиспользовать. 179 | 180 | __Плохо:__ 181 | ``` javascript 182 | console.log('Среднее: ' + (max + min) / 2); 183 | // ... 184 | console.log('Результат: ' + (max + min) / 2); 185 | ``` 186 | 187 | __Хорошо:__ 188 | ``` javascript 189 | var average = (max + min) / 2; 190 | 191 | console.log('Среднее: ' + average); 192 | // ... 193 | console.log('Результат: ' + average); 194 | ``` 195 | --------------------------------------------------------------------------------