Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 27.10.2009, 22:54
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

JavaScript style guide, JSLint, Strict Warnings
Наверное, у всех есть какой-то свой собственный стиль написания кода. Некоторое время назад мне пришлось адаптироваться к принятому в проекте стилю, который сильно отличался от моего, первое время было очень неудобно, потом привык, но не очень нравилось. В итоге выработался следующий стиль кодирования:

FD:
function callee(arg) {
    // …
}

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

FE:
var callee = function(arg) {
    // …
};

• между function и открывающей скобочкой нет пробела

Объект:
var obj = {
    property: value,
    method: function(arg) {
        // …
    }
};

• двоеточие не отделяется пробелом от имени свойства или метода

Ветвления:
if(…) {
    // …
}
else if(…) {
    // …
}
else {
    // …
}

• else/else-if yачинаются с новой строки
• пробела между if и открывающей скобочкой нет

Циклы:
while(…) {
    // …
}

do {
    // …
}
while(…);

for(…) {
    // …
}

• for только в качестве for-in

Конструкторы:
(new Date).getTime()

• скобки функции-конструктора не ставятся, когда возможно

Операторы:
typeof variable

if(!variable && "property" in object) {…}

var a = b ? c : d;

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

Переменные:
var a = 1, b = 2, c = 3;

var key, obj = {…};
for(key in obj) {…}

var a;
while(…) {
    a = i;
}


function(event) {
    event = event || window.event;
    var target = …;
}

• один var для нескольких переменных
• если до этого есть var, писать еще один внутри for ни к чему
• var не ставится внутри цикла (знаю, что интерпритированы они будут сразу)
• var не ставится, где попало, только в начале логических блоков
• существующие переменные не переопределяются с помощью var

Другое:
• все имена в camelStyle
• для отступов используется знак табуляции
• избавляемся от strict warnings в консоли Firefox
• не опускаем фигурные скобки
_____________________________

Только недавно догнал, что Firefox ругается только на такие функции:
function() {
    if(…) {
        return …;
    }
}

а не на все функции, которые ничего не возвращают


На некоторые вещи ругается JSLint, думаю, стоит ли следовать всем рекомендациям или это никому ненужные ограничения?

Ссылки:
MDC: JavaScript style guide
JSLint — The JavaScript Code Quality Tool

Вот, просто мысли в слух

Последний раз редактировалось Octane, 28.10.2009 в 13:50.
Ответить с цитированием
  #2 (permalink)  
Старый 27.10.2009, 23:15
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

У меня так же, кроме:
Цитата:
else/else-if yачинаются с новой строки
Цитата:
пробела между if и открывающей скобочкой нет
Цитата:
скобки функции-конструктора не ставятся, когда возможно
Цитата:
var не ставится внутри цикла (знаю, что интерпритированы они буду сразу)
Цитата:
не опускаем фигурные скобки

И частично:
Цитата:
var не ставится, где попало, только в начале логических блоков
В циклах свободно использую.


Цитата:
for только в качестве for-in
тоже while люблю, но for иногда просто напрашивается.
Ответить с цитированием
  #3 (permalink)  
Старый 28.10.2009, 08:48
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

У нас на первом курсе в первом семестре преподаватель не принимал плохо оформленные программы. Тогда все бесились, но щас я ему очень даже благодарен -- основные принципы в подкорке мозга зашиты. Собственно отличия, как правило, у всех только где ставить открывающую фигурную скобку, отступы табуляциями или пробелами, наименование переменных и еще может что по мелочи. Поэтому некоторые пункты удивляют.

Сообщение от Octane
• else/else-if yачинаются с новой строки
Так обычно делается, как раз, если открывающая скобка на новой строке.

Сообщение от Octane
• пробела между if и открывающей скобочкой нет
У if и вообще у всех операторов со скобками пробелы обычно ставятся.

Сообщение от Octane
• скобки функции-конструктора не ставятся, когда возможно
Вообще смысл непонятен. В результате в твоем примере скобки все равно есть, но хуже.

Сообщение от Octane
• разделяются пробелами, но не отбиваются пробелами от скобок
Унарные операторы тоже не видел никогда, чтобы пробелами отделялись. Минус унарный, я так понимаю, тоже с пробелом пишется?

Сообщение от Octane
• если до этого есть var, писать еще один внутри for ни к чему
На это я раньше внимания особо не обращал, но щас IDEA ругается, redeclare говорит.
Ответить с цитированием
  #4 (permalink)  
Старый 28.10.2009, 13:09
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

Сообщение от Kolyaj
Сообщение от Octane
• else/else-if начинаются с новой строки
Так обычно делается, как раз, если открывающая скобка на новой строке.
В MDC так рекомендуют и заключать в комментарии так удобнее.

Сообщение от Kolyaj
Сообщение от Octane
• пробела между if и открывающей скобочкой нет
У if и вообще у всех операторов со скобками пробелы обычно ставятся.
Вот тут не определюсь, после function в FE тоже тогда пробел нужно ставить будет по идее.

Сообщение от Kolyaj
Сообщение от Octane
• скобки функции-конструктора не ставятся, когда возможно
Вообще смысл непонятен. В результате в твоем примере скобки все равно есть, но хуже.
Вроде так нагляднее.

Сообщение от Kolyaj
Сообщение от Octane
• разделяются пробелами, но не отбиваются пробелами от скобок
Унарные операторы тоже не видел никогда, чтобы пробелами отделялись. Минус унарный, я так понимаю, тоже с пробелом пишется?
Не не не, это конечно же без пробелов:
i++;
++j;

a += -1 + k--;
Ответить с цитированием
  #5 (permalink)  
Старый 28.10.2009, 13:19
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

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

Сообщение от Octane
Вот тут не определюсь, после function в FE тоже тогда пробел нужно ставить будет по идее.
У функций пробел перед скобкой не ставится, пробел перед именем относится к имени, нет имени -- нет пробела. Все логично

Сообщение от Octane
Вроде так нагляднее.
По сути, это в одном ряду с точками с запятой стоит, те тоже необязательны.

Сообщение от Octane
Не не не, это конечно же без пробелов:
В первом посте опечатка?
Ответить с цитированием
  #6 (permalink)  
Старый 28.10.2009, 13:51
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

Сообщение от Kolyaj
В первом посте опечатка?
ты про это:
! variable

?

Без пробела обычно пишу, поправил.
Ответить с цитированием
  #7 (permalink)  
Старый 28.10.2009, 14:16
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,021

Мой стиль вы все прекрасно видели
Никаких пробелов, минимум переноса строк и скобок... Не завидую наследнику моего кода
Для таких ситуаций многие IDE имеют функцию форматирования. В DW для JS этого нет

Не понимаю людей, которые вставляют пробелы и переносы везде, где можно... Окно на весь экран, а смысла никакого не видно...

Последний раз редактировалось B~Vladi, 28.10.2009 в 14:19.
Ответить с цитированием
  #8 (permalink)  
Старый 28.10.2009, 14:16
Профессор
Отправить личное сообщение для Dmitry A. Soshnikov Посмотреть профиль Найти все сообщения от Dmitry A. Soshnikov
 
Регистрация: 25.02.2008
Сообщений: 707

Сообщение от Kolyaj
У функций пробел перед скобкой не ставится, пробел перед именем относится к имени, нет имени -- нет пробела. Все логично
А можно отнести имя к выражению вызова (CallExpression), тогда исчезает только имя, а пробел остаётся.

function foo() {...}  // описание функции с именем
foo(); // вызов

(function() {}); // без проблела - похоже на вызов
(function () {}); // а так - описание функции, исчезло только имя


Вот тут давно тоже было.

Что касается style-guide - это очень важная тема. Здесь приоритеты следующие (по убывающей, первые пункты - приоритет выше):

1. Style-guide принятый локально в компании. Главное - соблюдать единообразие кода.

2. Официальный Style-guide технологии. Профессиональный код (на международном уровне) должен выглядеть так. Автор технологии имеет право определять style-guide (в идеале, советуясь со сторонними мнениями и учитывая пожелания).

3. Локальная привычка. Любительский уровень, как правило используется новичками при начальном изучении. Также, может использоваться псевдо-гуру, которые хотят в этом моменте обособиться (aka, "мы не следуем за толпой и всякими там стайл-гайдами"), что является ещё большим пафосом; как правило - тоже любитель, знающий технологию ненамного глубже посредственного программера. Однако, первый пункт (с высшим приоритетом), может выбираться также конкретным человеком, исходя из своей локальной привычки и, если такой код сильно расходится с пунктом (2) - это неправильно уже.

Если не задан локальный стиль в компании, то стоит придерживаться официального стиля технологии - независимо от локальных привычек. Так, например, я привык к camelCase-у в именах переменных, но, программируя на Python-e, я использую underscore_case (т.к. это рекомендация официального style-guide-а Python) - несмотря на мою привычку из ES.
__________________
Тонкости ECMAScript

Последний раз редактировалось Dmitry A. Soshnikov, 28.10.2009 в 14:31.
Ответить с цитированием
  #9 (permalink)  
Старый 28.10.2009, 15:29
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

А как лучше:
if(typeof addEventListener != "undefined") {…}

или
if(typeof window.addEventListener != "undefined") {…}

или
if(window.addEventListener) {…}

или
if("addEventListener" in window)  {…}

?

Dmitry A. Soshnikov, можешь объяснить, почему и как работает такая конструкция:
typeof X // "undefined"

когда переменная X нигде не определена? Нормально ли так делать?

Последний раз редактировалось Octane, 28.10.2009 в 15:38.
Ответить с цитированием
  #10 (permalink)  
Старый 28.10.2009, 15:36
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Сообщение от Octane
А как лучше:
В таких (в конце файла), например, случаях без разницы, все равно работать не будет
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск