iframe-proxy | Sunbelt Computer Software

Repository navigation

History

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

319

320

321

322

323

324

325

326

327

328

329

330

331

332

333

334

335

336

337

338

339

340

341

342

343

344

345

346

347

348

349

350

351

352

353

354

355

356

357

358

359

360

361

362

363

364

365

366

367

368

369

370

371

372

373

374

375

376

377

378

379

380

381

382

383

384

385

386

387

388

389

390

391

392

393

394

395

396

397

398

399

400

401

402

403

404

405

406

407

408

409

410

411

412

413

414

415

416

417

418

419

420

421

422

423

424

425

426

427

428

429

430

431

432

433

434

435

436

437

438

439

440

441

442

443

444

445

446

447

448

449

450

451

452

453

454

455

456

457

458

459

460

461

462

463

464

465

466

467

468

469

470

471

472

473

474

475

476

477

478

479

480

481

482

483

484

485

486

487

488

489

490

491

492

493

494

495

496

497

498

499

500

501

502

503

504

505

506

507

508

509

510

511

512

513

514

515

516

517

518

519

520

521

522

523

524

525

526

527

528

529

530

531

532

533

534

535

536

537

538

539

540

541

542

543

544

545

546

547

548

549

550

551

552

553

554

555

556

557

558

559

560

561

562

563

564

565

566

567

568

569

570

571

572

573

574

575

576

577

578

579

580

581

582

583

584

585

586

587

588

589

590

591

592

593

594

595

596

597

598

599

600

601

602

603

604

605

606

607

608

609

610

611

612

613

614

615

616

617

618

619

620

621

622

623

624

625

626

627

628

629

630

631

632

633

634

<!DOCTYPE html>

<head>

<title>Стиль кода Академии HTML</title>

</head>

<body>

</a>

<h1>Стиль кода Академии HTML</h1>

<p><a href="https://github.com/htmlacademy/codeguide">github.com/htmlacademy/codeguide</a></p>

</header>

<main>

<h2 id="js-syntax">Синтаксис</h2>

<h3 id="">Отступы, пробелы и переносы</h3>

<p><strong>Для правильного форматирования используйте файл .editorconfig в вашем редакторе.</strong></p>

<ul>

<li>Для отступов используются два пробела. Знак табуляции не используется. При переносах в продолжении строки используется четыре пробела</li>

<li>Запрещено одновременное использование табов и пробелов для отступов</li>

<li>Выражения должны заканчиваться точками с запятой</li>

<li>Внутри строки не используется более одного пробела</li>

<li>Открывающие скобки блоков кода находятся на одной строке с оператором, которых их использует:

<pre class="language-js language-incorrect"><code>if (condition)

{

// code

}

</code></pre>

<pre class="language-js language-correct"><code>if (condition) {

// code

}

</code></pre>

</li>

<li>В однострочных блоках кода, код отделен от открывающей и закрывающей скобки пробелом</li>

<li>В однострочных массивах скобки не отделяются пробелами, первое значение идет непосредственно после закрывающей скобки, а закрывающая скобка идет непосредственно после последнего значения массива</li>

<li>После запятой всегда должен ставиться пробел, если запятая не в конце строки</li>

<li>Запрещено переносить запятую на новую строку при создании множественных переменных через один var, при объявлении массивов и объектов. Запрещено использовать запятую в конце списков, объектов или наоборов параметров функции</li>

<li>Файл должен заканчиваться пустой строкой</li>

<li>Строка не должна заканчиваться пробелами</li>

<li>В однострочных объектах и при деструктуризации фигурные скобки отбиваются пробелами с двух сторон</li>

<li>В коде не используются совместно табы и пробелы</li>

<li>Блоки кода отделяются друг от друга не более чем двумя пустыми строками</li>

<li>В качестве символа переноса строки используется стандартный символ, который используется в системе</li>

<li>При объявлении вычисляемых ключей в объектах с помощью синтаксиса ES2016 в квадратных скобках не используются пробелы</li>

<li>Оператор вызова функции () не отделяется круглыми скобками от названия функции</li>

<li>В объектах после объявления ключа не ставится пробел. После двоеточия, которое отделяет в объектах ключ от значения может стоять только один пробел, выравнивать несколько значений при объявлении многострочного объекта запрещено</li>

<li>Ключевые слова отделяются пробелами. Правило касается всех блоков, которые не оговорены отдельно в других правилах. В частности ключевые слова должны отделяться пробелами для условных операторов, циклов, операторов множественного выбора, блоков try..catch, объявлений классов и т. д.</li>

<li>В блоках кода первая и последняя строка не должны быть пустыми (код не отбивается от начала блока кода)</li>

<li>После двоеточий и точек с запятым ставятся пробелы. Перед ними — не ставятся</li>

<li>Перед скобками начинающими новый блок кода должен ставиться пробел</li>

<li>При объявлении анонимных функций, скобки с параметрами отделаются пробелом от ключевого слова function. Если функция именована, перед названием ставится пробел, после — нет</li>

<li>В комментариях текст отбивается пробелом от начала комментария</li>

<li>При создании генераторов, звездочка идет сразу после ключевого слова function без пробелов</li>

<li>В spread-операторе точки не отделяются от названия коллекции</li>

<li>Звездочка после ключевого слова yield не отбивается пробелом. После звездочки пробел ставится всегда</li>

</ul>

</div>

</article>

<h3 id="">Строки</h3>

<ul>

<li>В строках, объявленных с помощью одинарных и двойных кавычек запрещено использовать переносы</li>

<li>В строках запрещено указывать код спецсимволов в восьмеричной системе счисления

<pre class="language-js language-incorrect"><code>var foo = "Copyright \251";

</code></pre>

<pre class="language-js language-correct"><code>var foo = "Copyright \u00A9";

</code></pre>

</li>

<li>При создании объектов через литералы свойства должны объявляться в едином стиле: или без кавычек или с ними</li>

<li>В строках используются одинарные кавычки. Разрешено использовать строковые шаблоны. Если позволяет поддержка, предпочтение отдается строковым шаблонам</li>

</ul>

</div>

</article>

<h3 id="">Числа</h3>

<ul>

<li>В числах запрещено опускать ноль в дробной и целой части</li>

<li>Запрещено использовать ведущий ноль при создании чисел, поскольку это приводит к созданию числа в восьмеричной системе счисления</li>

</ul>

</div>

</article>

<h3 id="">Литералы</h3>

<ul>

<li>Массивы должны создаваться через литерал массива, а не через конструктор. Допустимое исключение — создание массива определенной длины</li>

<li>Объекты должны создаваться через литерал объекта, а не через конструктор</li>

<li>При создании объектов запрещено дублирование ключей</li>

<li>При описании функций запрещено дублировать названия параметров</li>

<li>В операторе <code>switch</code> запрещено дублировать условия (case)</li>

</ul>

</div>

</article>

<h3 id="">Операторы</h3>

<ul>

<li>В бинарных и тернарных операторах операнды и символы оператора отделяются пробелами</li>

<li>Унарные операторы не отделяются от операнда пробелом. Исключения составляют операторы, состоящие из слов, а не символов, например оператор <code>typeof</code></li>

</ul>

</div>

</article>

</section>

<h2>Именование</h2>

<ul>

<li>Запрещено объявлять переменные, имена которых совпадают с именами используемых в коде лейблов</li>

<li>Все переменные должны быть названы в верблюжьем регистре (camelCase). Исключения составляют константы которые должны именоваться прописными буквами в змеином регистре (UPPER_SNAKE_CASE)</li>

<li>Запрещено использовать имена переменных, которые используются во внешних областях видимости</li>

<li>Запрещено называть переменные и свойства <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#Keywords" target="_blank">ключевыми словами JS</a></li>

<li>Запрещено использовать переменные, не объявленные ранее. При использовании переменной, объявленной в другом модуле в глобальной области видимости нужно обращаться к ней как в свойству объекта <code>window/global</code></li>

<li>Запрещено объявлять переменные без значения</li>

<li>Запрещено напрямую обращаться к значению <code>undefined</code>. Для проверки типа рекомендуется использовать <code>typeof</code>. Для прямого сравнения с <code>undefined</code> можно использовать конструкцию <code>void 0</code></li>

<li>С заглавной буквы называются только функции-конструкторы</li>

</ul>

</div>

</article>

</section>

<h2>Предотвращение ошибок</h2>

<ul>

<li>Все точки с запятой должны быть проставлены явно, не стоит рассчитывать на автоматическую расстановку точек с запятой ASI (Automatic Semicolon Insertion)</li>

<li>Не рекомендуется использовать указатель <a href="https://en.wikipedia.org/wiki/Byte_order_mark">Unicode BOM</a> в коде, потому что код должен быть сохранен не в кодировке UTF-16, а в кодировке UTF-8, в которой нет указателя порядка бит</li>

<li>Обязательно используются блоки кода даже если в выражении содержится одна строчка</li>

<li>В коде нет пустых блоков кода</li>

<li>Код работает в строгом режиме: в начале всех файлов явно прописана директива <code>'use strict'</code></li>

</ul>

</div>

</article>

<h3 id="">Условные операторы</h3>

<ul>

<li>Запрещена "проверка Йоды" — в условных операторах в блоке условия при сравнении переменной или свойства со значением сначала идет переменная или свойство объекта и только потом значения, а не наоброт.

<pre class="language-js language-incorrect"><code>if (1 === myValue) {}

</code></pre>

<pre class="language-js language-correct"><code>if (myValue === 1) {}

</code></pre></li>

<li>При сравнении двух значений используется оператор строгого сравнения вместо оператора нестрогого сравнения</li>

<li>В условных операторах не используется оператор присвоения</li>

<li>В условиях не используется небезопасное отрицание, например использование <code>!</code> в <code>in</code> или <code>instanceof</code> без скобок</li>

<li>Запрещено сравнение с <code>NaN</code>. Для проверки, является результат операции числовым, нужно использовать <code><a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Number/isNaN" target="_blank">Number.isNaN</a></code></li>

<li>Запрещено использовать <code>case</code> без <code>break</code> или <code>return</code> в блоках <code>switch</code></li>

<li>Не используются вложенные тернарные операторы</li>

</ul>

</div>

</article>

<h3 id="">Функции</h3>

<ul>

<li>

<p>Если в функции используется ветвление, в котором есть возврат значения (<code>return</code>), <code>return</code> должен быть добавлен и в остальных ветках.</p>

<pre class="language-js language-incorrect"><code>var do = function() {

if (cond) {

return 1;

} else {

doSomethingElse();

}

};

</code></pre>

<pre class="language-js language-correct"><code>var do = function() {

if (cond) {

return 1;

} else {

return 2;

}

};

</code></pre>

<p>Это правило предотвращает создание функций, при использовании которых непонятно, вернут ли они какое-то значение. В первом примере, функция <code>do</code> может вернуть значение <code>1</code>, а может <code>undefined</code></p>

</li>

<li>В <code>return</code> не используется оператор присваивания</li>

<li>В стрелочных функциях всегда используются скобки для параметров, даже если параметр один</li>

</ul>

</div>

</article>

<h3 id="">Операторы</h3>

<ul>

<li>В конструкторе классов-наследников обязательно вызывается <code>super()</code></li>

<li>В конструкторе нет обращения к <code>this</code> до того, как будет вызван <code>super()</code></li>

</ul>

</div>

</article>

<h3 id="">Объявление переменных и функций</h3>

<ul>

<li>При объявлении переменных предпочтение отдается ключевым словам <code>let</code> и <code>const</code>. Переменные объявляются через <code>var</code> только при наличии проблем с поддержкой кода</li>

<li>Запрещено переопределять с помощью ключевого слова ранее созданные переменные</li>

<li>Запрещено использовать множественное объявление через одно ключевое слово. Для каждой переменной используется отдельный <code>var</code>, <code>let</code> или <code>const</code>.

<pre class="language-js language-incorrect"><code>var a = 1, b = 2;

</code></pre>

<pre class="language-js language-correct"><code>var a = 1;

var b = 2;

</code></pre>

</li>

</ul>

<h4 id="">Объявление функций</h4>

<ul>

<li>Запрещено переопределение функций, созданных с помощью функционального объявления (function declaration)

<pre class="language-js language-incorrect"><code>function myFunc() {};

myFunc = 2;

</code></pre></li>

<li>Запрещено объявление значений внутри блоков</li>

<li>Новые функции не создаются с помощью конструктора <code>Function</code></li>

<li>Вместо коллекции <code>arguments</code>, используется rest-оператор, если это позволяет версия языка</li>

<li>Вместо вызова функции через <code>apply</code> используется spread-оператор, если это позволяет версия языка

<pre class="language-js language-incorrect"><code>Math.max.apply(null, [1, 100, 15, 1000]);

</code></pre>

<pre class="language-js language-correct"><code>Math.max(...[1, 100, 15, 1000]);

</code></pre>

</li>

</ul>

<h4 id="">Создание значений</h4>

<ul>

<li>Не вызываются служебные конструкторы, создающие объекты из глобальной области видимости <code>Math()</code>, <code>JSON()</code>, <code>Reflect()</code></li>

<li>При создании непустых массивов запрещено опускать пустые значения (ставить подряд несколько запятых)</li>

<li>При создании непустых объектов и массивов не используются «висячие» запятые</li>

<li>Не используются конструкторы примитивов, которые используются для автобоксинга <code>String</code>, <code>Number</code>, <code>Boolean</code></li>

<li>Конструкторы вызываются со скобками, даже если у них нет параметров</li>

<li>Символы (<code>Symbol</code>) создаются вызовом функции <code>Symbol</code> без ключевого слова <code>new</code></li>

</ul>

</div>

</article>

<h3 id="">Хорошие практики</h3>

<ul>

<li>Не используется конструкция <code>with</code></li>

<li>Не используются <code>alert</code></li>

<li>Не используется выполнение кода через <code>eval</code></li>

<li>Не используется неявный <code>eval</code> — в функциях, которые поддерживают передачу исполняемого кода как строку, например <code>setTimeout</code></li>

<li>В ссылках используется протокол <code>javascript:</code></li>

<li>Конструкторы не используются без ключевого слова <code>new</code></li>

<li>В функциях не используются обращения к <code>caller</code> и <code>callee</code></li>

</ul>

<h4>Манкипатчинг</h4>

<ul>

<li>Встроенные в язык объекты и прототипы не расширяются в рантайме</li>

<li>Не переопределяются глобальные значения (<code>undefined</code>, <code>null</code>, <code>Object</code>, <code>window</code> и прочие)</li>

</ul>

<h4>Контекст</h4>

<ul>

<li><code>bind</code> не используется вне методов классов</li>

<li>В функциях, которые не являются методами никакого объекта или класса не используется <code>this</code></li>

</ul>

<h4>Переменные</h4>

<ul>

<li>Переменные, объявленные через <code>var</code> не удаляются оператором <code>delete</code></li>

</ul>

</div>

</article>

<h3 id="">Приведение типов</h3>

<ul>

<li>Не используется лишнее приведение к Boolean. Например, нет большого смысла переводить в boolean условия в конструкциях <code>if</code>, <code>while</code>, <code>for</code>, в первом операнде тернарного оператора</li>

<li>Оператор <code>typeof</code> используется корректно — используются только правильные значения, возвращаемые оператором, не производится сравнения со строковыми литералами, которые содержат некорректные значения <code>typeof</code></li>

<li>В <code>parseInt</code> обязательно передается второй параметр — основание системы счисления, даже в случае с десятичной системой счисления</li>

</ul>

<h4>Константы в условиях</h4>

<ul>

<li>В блоки условия операторов <code>if</code>, <code>while</code>, <code>for</code> и тернарного оператора не передается константное значение, которое подразумевает, что условие выполняется (или не выполняется) всегда

<pre class="language-js language-incorrect"><code>if (true) {}

</code></pre>

<pre class="language-js language-correct"><code>if (a > 1) {}

</code></pre>

<pre class="language-js language-incorrect"><code>var ternaryValue = true ? 'a' : 'b';

</code></pre>

<pre class="language-js language-correct"><code>var ternaryValue = isA() ? 'a' : 'b';

</code></pre>

</li>

</ul>

</div>

</article>

</section>

<h2>Чистый код</h2>

<h3 id="">Лишние символы (пробелы, точки с запятой и прочее)</h3>

<ul>

<li>Не используются лишние (множественные) точки с запятой</li>

</ul>

</div>

</article>

<h3 id="">Отладчик и консоль</h3>

<ul>

<li>В коде не используется оставленных выводов в консоль</li>

<li>В коде нет забытых инструкций <code>debugger</code></li>

</ul>

</div>

</article>

<h3 id="">Неиспользуемый код</h3>

<ul>

<li>

В проекте нет недоступного кода, который никогда не выполнится

<pre class="language-js language-incorrect"><code>if (false) {

doSomething();

}

</code></pre>

<pre class="language-js language-correct"><code>if (needToDoSomething()) {

doSomething();

}

</code></pre>

</li>

<li>В коде нет объявленных, но неиспользуемых переменных</li>

<li>

В коде нет выражений, значения которых не записываются в переменные, параметры функций, свойства объектов и не передаются как параметры функций

<pre class="language-js language-incorrect"><code>check === true && doSomething();

</code></pre>

<pre class="language-js language-correct"><code>if (check) {

doSomething();

}

</code></pre>

</li>

</ul>

</div>

</article>

<h3 id="">Обработка ошибок и исключения</h3>

<ul>

<li>

Для выбрасывания исключения в оператор <code>throw</code> передаются только объекты Error. Передавать литералы запрещено.

<pre class="language-js language-incorrect"><code>throw 'Passed value is out of range';

</code></pre>

<pre class="language-js language-correct"><code>throw new RangeError('Rassed value is out of range');

</code></pre></li>

</ul>

<ul>

<li>В конструкции <code>try..catch</code> запрещен пустой блок <code>catch</code></li>

</ul>

</div>

</article>

</section>

<h2>Документирование</h2>

При написании jsDoc используются следующие ограничения:

<ul>

<li>необязательно добавлять текстовое описание конструкциям <code>@return</code> и <code>@param</code>, достаточно просто указания типа и названия параметра для <code>@param</code></li>

<li>описание возвращаемного типа <code>@return</code> требуется только в том случае, если функция возвращает какое-то значение. Правило не действует для конструкторов, для них указывать <code>@return</code> необязательно. Также необязательно указывать тег <code>@return</code> для функций, в которых конструкуия <code>return</code> используется без возвращаемого значения для выхода из функции</li>

<li>для описания возвращаемого значения из функции используется тег <code>@return</code>, а не <code><del>@returns</del></code></li>

</ul>

</div>

</article>

</section>

<h2>Прочее</h2>

<ul>

<li>При итерировании по объектам через <code>for..in</code> при работе со свойствами используется конструкция <code>hasOwnProperty</code></li>

<li>В объектах напрямую не переопределяется свойство <code>__iterator__</code></li>

<li>

В объектах напрямую не переопределяется свойство <code>__proto__</code>. Разрешено переопределять <code>__proto__</code> через <code>Object.create</code> или запись в прототип, объектов, созданных другими конструкторами, но напрямую редактировать <code>__proto__</code> нельзя

<pre class="language-js language-incorrect"><code>var obj = {

__proto__: Parent

};

</code></pre>

<pre class="language-js language-correct"><code>var Obj = function() {};

Obj.prototype = new Parent();

var obj = new obj;

var obj = Object.create(Parent.prototype);

</code></pre>

</li>

<li>В коде не используются лейблы. Лейблы используются с конструкциями <code>break</code> и <code>continue</code> для направленного выхода из икла и могут привести к слишком сложному для понимания коду</li>

<li>Блоки, использующиеся в коде должны описывать тело функции, условия, оператора <code>switch</code> и прочие конструкции относящиеся к группировке множественных операций. Блоки не должны использваться сами по себе, любой блок должен быть частью другого выражения</li>

<li>

В коде не используется оператор «запятая» для описания последовательностей действий. Для создания переменных используются отдельные ключевые слова <code>let</code>, <code>const</code>, <code>var</code>, в операторы группировки, условные операторы и прочие конструкции. Исключение составляет начальное условие оператора <code>for</code>

<pre class="language-js language-incorrect"><code>const result = (1, 2); // 2

</code></pre>

<pre class="language-js language-correct"><code>const result = 2;

</code></pre>

<br>

<pre class="language-js language-incorrect"><code>switch (val = getVal(), val) {}

</code></pre>

<pre class="language-js language-correct"><code>val = getVal();

switch(val) {}

for (var i = 0, l = 100; i < l; i++);

</code></pre>

</li>

</ul>

</div>

</article>

<h3 id="">Регулярные выражения</h3>

<ul>

<li>В регулярных выражениях не используются «управляющие выражения»</li>

<li>В регулярных выражениях не используются пустые классы символов <code>[]</code> (блоки, ограниченные квадратными скобками)</li>

<li>В коде регулярные выражения не создаются через конструктор <code>RegExp</code> из строки, которая не может быть разобрана как правильное регулярное выражение</li>

<li>

В регулярных выражениях не используются нескольких последовательных пробелов. Вместо этого предлагается использовать модификаторы количества

<pre class="language-js language-incorrect"><code>/ /.exec(myString);

</code></pre>

<pre class="language-js language-incorrect"><code>/\s\s\s/.exec(myString);

</code></pre>

<pre class="language-js language-correct"><code>/\s{3}/.exec(myString);

</code></pre>

</li>

</ul>

</div>

</article>

<ul>

<li>В Node.js файлах не используется конструкция <code>process.exit</code></li>

</ul>

</div>

</article>

</section>

</main>

</a>

Вконтакте

</a>

Facebook

</a>

Twitter

</a>

Instagram

</a>

</div>

GitHub

</a>

</div>

</footer>

</body>

</html>

Sunbelt Computer Software

PL/B Language Development and Support

Navigation Menu

Repository navigation

javascript.html

javascript.html

Sunbelt Computer Software

PL/B Language Development and Support

FilesExpand file tree

javascript.html

Latest commit

History

javascript.html

File metadata and controls