КОНЬЯКОВ.ру

1. Объекты 1.1. Создание объекта 1.2. Зарезервированные слова 1.3. Ключевые слова 1.4. Создание обьекта на 3 и более элементов
2. Переменные
3. Функции 3.1. Именование функции 3.2. Передача функции в функцию
4. Отступы 4.1. Горизонтальные отступы 4.2. Вертикальные отступы
5. Пробелы
6. Скобки
7. Кавычки
8. Точка с запятой
9. Комментарии

Для создания объекта используйте фигурные скобки. Не создавайте объекты через конструктор new Object().

Хорошо

let item = {};

Плохо

let item = new Object();

Не используйте зарезервированные слова в качестве ключей объектов. Они не будут работать в IE 8.

Подробнее

Хорошо

let superman = {
  defaults: { clark: 'kent' },
  hidden: true
};

Плохо

let superman = {
  default: { clark: 'kent' },
  private: true
};

Не используйте ключевые слова, в том числе изменённые. Вместо них используйте синонимы.

Хорошо

let superman = {
  type: 'alien'
};

Плохо

let superman = {
  class: 'alien'
};

При создании объектов, равно как и массивов, содержащих большое количество свойств (элементов) и тем самым образующих строки длиной более 20 символов, нужно выполнять ряд условий:

• открывающая скобка располагается на той же строке,
• каждое свойство оформляется на новой строке,
• после двоеточия ставится пробел,
• закрывающая скобка располагается на новой строке.

Хорошо

let superman = {
  defaults: { clark: 'kent' },
  type: 'alien',
  hidden: true
};

Плохо

let superman = {
  defaults:{clark:'kent'},
  type:'alien',
  hidden:true
};

Плохо

let superman = {defaults: { clark: 'kent' }, type: 'alien', hidden: true};

Для именования переменных используйте существительные на английском языке.

• Не используйте транслит (слова на русском языке латинскими буквами).
• Имя переменной должно быть осмысленным.
• Имя переменной не должно состоять из одной буквы (кроме итераторов циклов i и j).
• Для имён, состоящих из нескольких слов, используйте camelCase.

Имя может состоять из букв, цифр, символов $ и _, не должно начинаться с цифры.

Хорошо

let vegetables;
let hasPositiveSaldoAccount;

Плохо

let rrfgov;
let ovoschi;
let HasPositiveSaldoAccount;
let has_positive_saldo_account;
let a;

Имя функции должно быть глаголом (кроме функций-конструкторов) на английском языке или начинаться с него.

• Не используйте транслит (слова на русском языке латинскими буквами).
• Имя функции должно быть осмысленным.
• Для имён, состоящих из нескольких слов, используйте camelCase. Исключение — функции конструкторы.

Хорошо

function editName() {
  // Тело функции
};

function Vehicle(name) {
  // Тело функции
}

Плохо

function pravkaspiska() {
  // Тело функции
};

function GetVehicle(name) {
  // Тело функции
}

Передавая функцию как аргумент в другую функцию, оформляйте код, как в примере ниже:

let arr = ['Яблоко', 'Апельсин', 'Груша'];
arr.forEach(function(item, i, arr){
  alert(i + ': ' + item + ' (массив:' + arr + ')');
});

arr.forEach((item, i, arr) => alert(i + ': ' + item + ' (массив:' + arr + ')'));

Отступ при вложенности — 2 пробела на каждый уровень вложенности.

• Не используйте символы табуляции.
• Отступы должны быть равномерными. Для каждого вложенного блока отступ должен увеличиваться ровно на 2 пробела. По одному отступу должно быть понятно, к какому блоку относится действие.
• В редакторе кода символ табуляции можно заменить на 2 пробела.
• Включите отображение невидимых символов.
• Для корректности отступов желательно использовать расширение indent-rainbow, которое раскрашивает блоки отступов в разные цвета. С этим расширением не должно быть отступов, выделенных красным цветом.

Хорошо

if (age < 98) {
  let a = 15;
  for (let i = 0, iMax = items.length; i < iMax; ++i) {
    // Тело цикла
    if(i < 15) {
      // Тело условной конструкции
      let b = 30;
      let c = a + b;
      console.log(c * 2);
    }
  }
}

Плохо

if (age < 98) {
for (let i = 0, iMax = items.length; i < iMax; ++i) {
// Тело цикла
let a = 15;
if(i < 15) {
// Тело условной конструкции
let b = 30;
let c = a + b;
console.log(c * 2);
}
}
}

Плохо

if (age < 98) {
 for (let i = 0, iMax = items.length; i < iMax; ++i) {
 // Тело цикла
 let a = 15;
    if(i < 15) {
 // Тело условной конструкции
 let b = 30;
let c = a + b;
   console.log(c * 2);
 }
}
}

Плохо

// Присутствуют символы табуляции
if (age < 98) {
 for (let i = 0, iMax = items.length; i < iMax; ++i) {
  console.log(i);
 }
}

// Присутствуют как символы табуляции, так и символы пробелов
if (age < 98) {
    for (let i = 0, iMax = items.length; i < iMax; ++i) { // На этой строке отступ сделан табуляцией
    console.log(i); // На этой строке отступ сделан сначала пробелами, а затем табуляцией
  } // На этой строке отступ сделан пробелами
}

Между логическими блоками — циклами, функциями и т. д. — следует оставлять пустую строку. Это делает код более читабельным. Избегайте блоков кода более 9 строк подряд. Не добавляйте пустую строку после каждого действия.

Хорошо

let iMax = items.length;
for (let i = 0; i < iMax, ++i) {
  // Тело цикла
}

function showName() {
  // Тело функции
}

Плохо

let iMax = items.length;

for (let i = 0; i < iMax, ++i) {
  // Тело цикла
}
function showName() {
  // Тело функции
}

Плохо

let a = 15;

let b = 30;

let c = a + b;

console.log(c * 2);

• Используйте пробелы между параметрами и не используйте между именем функции и скобкой.

Хорошо

function edit(name, age) {
  // Тело функции
}

Плохо

function edit (name,age) {
  // Тело функции
}

• При создании анонимной функции (функции без имени) ставьте пробел перед скобкой.

Хорошо

function (name, age) {
  // Тело функции
}

Плохо

function(name,age) {
  // Тело функции
}

• Используйте пробелы вокруг операторов.

Хорошо

if (age < 100) {
  // Тело условной конструкции
}

Плохо

if (age<100) {
  // Тело условной конструкции
}

• Открывающая фигурная скобка располагается на той же строке.
• Перед скобкой ставится пробел.
• Закрывающая скобка располагается на новой строке.
• Всегда добавляйте фигурные скобки для циклов и условных конструкций, даже когда блок состоит из одного действия.

Хорошо

function edit(name, age) {
  if (age < 100) {
    // Тело условной конструкции
  }
}

Плохо

function edit(name, age)
{
  if (age < 100) {/*Тело условной конструкции*/}
}

Плохо

function edit(name, age)
{
  if (age < 100) /*Тело условной конструкции*/
}

Плохо

function edit(name, age)
{
  if (age < 100) 
    /*Тело условной конструкции*/
}

В коде скрипта всегда используйте одинарные кавычки, если не требуется иного. Двойные кавычки допустимы, если в этой же строке используется апостроф ( ‘ ) или одинарные кавычки для других целей.

Хорошо

let string = 'строка';
let phrase = "you're next";

Плохо

let string = "строка";

В конце выражения обязательна точка с запятой.

Хорошо

alert('Привет');
alert('Мир');

Плохо

alert('Привет')
alert('Мир')

Для пояснения кода используются комментарии. Комментарии не исполняются интерпретатором JavaScript.

• Однострочные комментарии начинаются с двойного слеша (//). За ним обязательно должен идти пробел.
• Многострочные комментарии располагаются между /* и */. За символом начала комментария обязательно должен идти пробел. Символ конца комментария располагается на новой строке.
• Никогда не оставляйте закомментированный код. Комментарии должны использоваться для пояснения программы, а не для скрытия другой реализации действий.

Хорошо

/* Пример комментария.
Многострочного комментария
*/

// Пример однострочного комментария

Плохо

/*Пример комментария.
Многострочного комментария*/

//Пример однострочного комментария