Skip to content
This repository has been archived by the owner on Jan 17, 2020. It is now read-only.

Javascript: Code Style

Vladimir Pavlikov edited this page Jun 30, 2014 · 9 revisions

Этот гайд является форком гайда для node.js.

Пробелы для отступов

Один отступ = 4 пробела

Переносы строк

Символ новой строки должен быть в UNIX-стиле (\n). Виндовые окончания (\r\n) запрещены.

Никаких trailing whitespace

Настройте свой редактор на очистку trailing whitespaces. Пустая строка в конце файла допустима, но странно там видеть пять пустых строк подряд. Также следует настроить удаление trailing whitespaces в конце строк.

Используйте точки с запятыми

Не забывайте ставить ;, например, после определения переменных

var Animal = function(name) {
	this.name = name;
};

Animal.prototype.showName = function() {
	$('#animal-name').text(this.name);
};

80 символов на строку

Следует ограничить строки кода 80-ю символами. Да, экраны стали больше за последние годы, а ваш мозг - нет. Используйте свободное место для split screen.

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

Используйте одинарные кавычки, кроме тех случаев, когда вы пишите JSON.

Правильно:

var foo = 'bar';

Неправильно:

var foo = "bar";

Открывающиеся фигурные скобки должны быть на той же строке

Открывающиеся фигурные скобки должны быть на той же строке, что и выражение

Правильно:

if (true) {
	console.log('winning');
}

Неправильно:

if (true)
{
	console.log('losing');
}

Также обратите внимание на использование пробела до и после условного выражения.

Объявляйте одну переменную с помощью выражения var за раз

Одно выражение var = одна переменная. Так легче менять строки местами.

Правильно:

var keys   = ['foo', 'bar'];
var values = [23, 42];

var object = {};
while (keys.length) {
	var key = keys.pop();
	object[key] = values.pop();
}

Неправильно:

var keys = ['foo', 'bar'],
		values = [23, 42],
		object = {},
		key;

while (keys.length) {
	key = keys.pop();
	object[key] = values.pop();
}

Используйте lowerCamelCase для переменных, свойств и имен функций

Переменные, свойства и имена функций должны быть в верблюжейНотации. Также они должны быть говорящими. Переменные из одного символа и необычные аббревиатуры в общем случае использоваться не должны (односимвольные переменные допустимы в качестве счетчиков внутри циклов, например).

Правильно:

var adminUser = db.query('SELECT * FROM users ...');

Неправильно:

var admin_user = db.query('SELECT * FROM users ...');

Используйте UpperCamelCase для именования классов

Названия классов должны быть капитализированы: UpperCamelCase.

Правильно:

function BankAccount() {
}

Неправильно:

function bank_Account() {
}

Используйте UPPERCASE для констант

Константы должны быть объявлены как обычные переменные или статические свойства класса в верхнем регистре.

Правильно:

var SECOND = 1 * 1000;

function File() {
}
File.FULL_PERMISSIONS = 0777;

Неправильно:

const SECOND = 1 * 1000;

function File() {
}
File.fullPermissions = 0777;

Создание Object / Array

Используйте короткие объявления на каждой строке. Оборачивайте ключи в кавычки только если ваш интерпретатор жалуется.

Правильно:

var a = ['hello', 'world'];
var b = {
	good: 'code',
	'is generally': 'pretty',
};

Неправильно:

var a = [
	'hello', 'world'
];
var b = {"good": 'code'
				, is generally: 'pretty'
				};

Используйте оператор ===

Программирование - это не запоминание глупых правил. Используйте оператор тождественного равенства, ведь он работает ровно так, как ожидается.

Правильно:

var a = 0;
if (a === '') {
	console.log('winning');
}

Неправильно:

var a = 0;
if (a == '') {
	console.log('losing');
}

Используйте многострочный тернарный оператор

Тернарный оператор не следует размещать на одной строке, разделите его на несколько.

Правильно:

var foo = (a === b) ? 
          1 :
          2;

Неправильно:

var foo = (a === b) ? 1 : 2;

Не расширяйте встроенные прототипы

Не расширяйте прототипы нативных объектов JavaScript.

Правильно:

var a = [];
if (!a.length) {
	console.log('winning');
}

Неправильно:

Array.prototype.empty = function() {
	return !this.length;
}

var a = [];
if (a.empty()) {
	console.log('losing');
}

Используйте говорящие условия

Любые нетривиальные условия должны быть присвоены говорящим переменным или функциям:

Правильно:

var isValidPassword = password.length >= 4 && /^(?=.*\d).{4,}$/.test(password);

if (isValidPassword) {
	console.log('winning');
}

Неправильно:

if (password.length >= 4 && /^(?=.*\d).{4,}$/.test(password)) {
	console.log('losing');
}

Используйте $ для обозначения переменных jQuery

Правильно:

var $form = $('#myform');

Неправильно:

var form = $('#myform');

Пишите короткие функции

Старайтесь писать короткие функции. Хорошая функция вмещается на слайд, чтобы люди, сидяшще в последнем ряду в большой комнате, могли комфортно ее прочитать. Старайтесь ограничить себя примерно 15-ю строками на функцию.

Используйте return как можно раньше

Чтобы избежать глубокой вложенности if-выражений всегда выполняйте return значения как можно скорее.

Правильно:

function isPercentage(val) {
	if (val < 0) {
		return false;
	}

	if (val > 100) {
		return false;
	}

	return true;
}

Неправильно:

function isPercentage(val) {
	if (val >= 0) {
		if (val < 100) {
			return true;
		} else {
			return false;
		}
	} else {
		return false;
	}
}

В этом конкретном примере можно сократить код еще больше

function isPercentage(val) {
	var isInRange = (val >= 0 && val <= 100);
	return isInRange;
}

Давайте названия вашим замыканиям

Не стесняйтесь давать замыканиям имена. Это показывает, что вы о них заботитесь, и помогает при дебаге.

Правильно:

req.on('end', function onEnd() {
	console.log('winning');
});

Неправильно:

req.on('end', function() {
	console.log('losing');
});

Никаких вложенных замыканий

Используйте замыкания, но не вкладывайте их друг в друга. Иначе ваш код превратится в кашу.

Правильно:

setTimeout(function() {
	client.connect(afterConnect);
}, 1000);

function afterConnect() {
	console.log('winning');
}

Неправильно:

setTimeout(function() {
	client.connect(function() {
		console.log('losing');
	});
}, 1000);

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

Используйте слеши как для однострочных, так и для многострочных комментариев. Избегайте комментирования очевидных вещей, но комментируйте нетривиальное, возможно с примерами.

Правильно:

// 'ID_SOMETHING=VALUE' -> ['ID_SOMETHING=VALUE', 'SOMETHING', 'VALUE']
var matches = item.match(/ID_([^\n]+)=([^\n]+)/));

// This function has a nasty side effect where a failure to increment a
// redis counter used for statistics will cause an exception. This needs
// to be fixed in a later iteration.
function loadUser(id, cb) {
	// ...
}

var isSessionValid = (session.expires < Date.now());
if (isSessionValid) {
	// ...
}

Неправильно:

// Execute a regex
var matches = item.match(/ID_([^\n]+)=([^\n]+)/));

// Usage: loadUser(5, function() { ... })
function loadUser(id, cb) {
	// ...
}

// Check if the session is valid
var isSessionValid = (session.expires < Date.now());
// If the session is valid
if (isSessionValid) {
	// ...
}