Организация файлов

• Все файлы javascript должны размещаться в общей папке проекта '''script'''
• Используемые файлы сторонних библиотек должны размещаться в папке '''script/lib'''
• Переиспользуемые пользовательские модули должны размещаться в папке '''script/commons'''. Если переиспользуемый модуль включает несколько подфайлов, необходимо создать отдельную папку модуля
• Файлы Javascript, используемые отдельными модулями страниц, должны размещаться в папке '''script/{module_name}'''
• Данные JSON, имитируемые проектом, должны размещаться в папке '''script/json''', при этом для каждой страницы создаются отдельные подпапки
• При использовании MVC-фреймворка в JavaScript используемые файлы шаблонов должны размещаться в папке '''script/templates''', при этом для каждой страницы создаются отдельные подпапки

Форматирование

• Общие принципы см. в [PhpGuideline PHP Coding Standards]
• Всегда используйте var для определения переменных

var global = '';

function method() {
    var local = '';
}

• Всегда завершайте инструкцию объявления точкой с запятой
• Не используйте лишнюю "," для массивов и объектов (для совместимости с IE)

//wrong
var arr = [1,2,];
var person = {
    name: 'name',
    age: 20,
};
//wrong
var arr = [1,2];
var person = {
    name: 'name',
    age: 20
};

• Определите пространство имен верхнего уровня, например inBike, и определите пользовательские приватные пространства имен внутри пространства имен верхнего уровня, разделенные по модулям
• Весь код модуля должен быть помещен в анонимные самовызывающиеся функции, экспонируемые путем присваивания значений пользовательским пространствам имен под объектом window

if (!window.inBike) {
    window.inBike = {};
}
window.inBike.rideway = rideway;

• Код привязки событий должен выполняться в функции готовности DOM

$(function() {
     //bind function is in the init function
     window.inBike.rideway.init();
})

• Поместите пользовательские методы модуля в объект. Сразу после имени метода должно следовать ":". Оставьте один пробел между ":" и "function". Оставьте один пробел между "function()" и следующей "{"

var module = function() {
    method: function() {

    }
};

• Используйте одинарные кавычки для обрамления строк

var str = 'some text';

• Все используемые переменные должны быть определены до использования и инициализированы сразу после определения

var obj = null;
var num = 0;
var arr = [];
var isEmpty = true;

• Проверьте, поддерживается ли он, перед использованием инструмента консоли браузера

if (console) {
    console.log('this is my log');
}

Чтобы задать имя ограничения UNIQUE и применить его к нескольким столбцам, можно использовать следующий синтаксис:

• Общие принципы см. в [PhpGuideline PHP Coding Standards]
• Используйте camelCase для именования переменных и методов, при этом первая буква строчная. В именах классов первая буква должна быть заглавной

var numberList = [1,2];
var util = {
    removeNode: function(){
        ....
    }
};

function Person(name, age) {
    this.name = name;
    this.age = age;
}

• Используйте $name для именования объектов jQuery. Имена нативных DOM-элементов начинаются с "dom". Приватные переменные в объекте начинаются с подчеркивания

var $image = $('#cover');
var domImage = document.getElementById('cover');
var obj = {
    _privateVar: null,
    method: function() {

    }
};

Комментарии

• Общие принципы см. в [PhpGuideline PHP Coding Standards]
• Используйте больше однострочных комментариев, чтобы обозначить смысл логических блоков

// Handle the case where IE and Opera return items
// by name instead of ID
if ( elem.id !== match[2] ) {
    return rootjQuery.find( selector );
}

// Otherwise, we inject the element directly into the jQuery object
this.length = 1;
this[0] = elem;

• Отмечайте метод-конструктор класса

/**
 * @constructor
 */
some.long.namespace.MyClass = function() {
};

• Аннотируйте тип и назначение констант перечисления

/** @enum {string} */
some.long.namespace.Fruit = {
  APPLE: 'a',
  BANANA: 'b'
};

• Используйте комментарии, чтобы отметить видимость методов или переменных — это упрощает статическую проверку

/** @protected */
AA_PublicClass.staticProtectedProp = 31;

/** @private */
AA_PublicClass.prototype.privateMethod_ = function() {};

Лучшие практики

• Избегайте использования eval
• Избегайте использования with для объектов и for-in для массивов
• Используйте замыкания осторожно, чтобы избежать циклических ссылок
• Будьте внимательны к контексту, в котором используется this

var $button = $('#my-button');
$button.click(function(){
    var self = this;
    var util = {
       getVal: function() {
           return self.val();
       }
    }
});

• По возможности используйте сокращённые формы записи, такие как тернарный оператор, логическое переключение, операции инкремента и т. д.

var name = ('undefined' == typeof(name)) ? '' : name;
(age < 0) && (age = 0);
count++;

• Не используйте function в блочной области видимости

// 错误
if (x) {
  function foo() {}
}

// 正确
if (x) {
  var foo = function() {}
}

• Привязывайте обработчики событий к родительскому узлу и обрабатывайте их отдельно в зависимости от источника события
• Для сложных модулей страницы используйте библиотеки управления зависимостями, такие как SeaJS, RequireJS, и MVC-фреймворки, такие как Backbone, Knockout, Stapes, чтобы организовать свой код