В JavaScript можно объявить несколько переменных следующим образом:
var variable1 = "Hello World!";
var variable2 = "Testing...";
var variable3 = 42;
... или вот так:
var variable1 = "Hello World!",
variable2 = "Testing...",
variable3 = 42;
Является ли один метод лучше/быстрее другого?
Первый способ легче поддерживать. Каждое объявление представляет собой единый оператор в одной строке, поэтому вы можете легко добавлять, удалять и изменять порядок объявлений.
Во втором случае раздражает удаление первого или последнего объявления, поскольку они содержат ключевое слово var и точку с запятой. И каждый раз, когда вы добавляете новое объявление, вы должны изменить точку с запятой в старой строке на запятую.
Помимо ремонтопригодности, первый способ исключает возможность создания глобальных переменных аварии:
(function () {
var variable1 = "Hello World!" // semicolon is missed out accidently
var variable2 = "Testing..."; // still a local variable
var variable3 = 42;
}());
В то время как второй способ менее прост:
(function () {
var variable1 = "Hello World!" // comma is missed out accidently
variable2 = "Testing...", // becomes a global variable
variable3 = 42; // a global variable as well
}());
Общепринято использовать один var оператор для каждой области для организации. То, как все "области" следуют аналогичной схеме, делает код более читаемым. Кроме того, двигатель все равно "поднимает" все в верх. Поэтому сохранение ваших деклараций вместе имитирует то, что на самом деле произойдет более близко.
Это гораздо более читаемо, когда вы делаете это так:
var hey = 23;
var hi = 3;
var howdy 4;
Но занимает меньше места и строк кода таким образом:
var hey=23,hi=3,howdy=4;
Он может быть идеальным для экономии места, но пусть компрессоры JavaScript обрабатывают его для вас.
Это просто вопрос личных предпочтений. Нет разницы между этими двумя способами, кроме нескольких байтов, сохраненных во второй форме, если вы выделяете пустое пространство.
Может быть, это
var variable1 = "hello world"
, variable2 = 2
, variable3 = "how are you doing"
, variable4 = 42;
За исключением изменения первой или последней переменной ее легко поддерживать и читать.
ECMAScript6 представил назначение деструктурирования, которое работает довольно хорошо:
[a, b] = [1, 2] a будет равно 1 а b будет равно 2.
var variable1 = "Hello World!";
var variable2 = "Testing...";
var variable3 = 42;
более читаем, чем:
var variable1 = "Hello World!",
variable2 = "Testing...",
variable3 = 42;
Но они делают то же самое.
Используйте ES6 Destructuring assignment: он распаковывает значения из массивов или свойства из объектов в отдельные переменные.
let [variable1 , variable2, variable3] =
["Hello World!", "Testing...", 42];
console.log(variable1); // Hello World!
console.log(variable2); // Testing...
console.log(variable3); // 42Мое единственное, но основное назначение для запятой - в цикле for:
for (var i = 0, n = a.length; i < n; i++) {
var e = a[i];
console.log(e);
}
Я пошел сюда, чтобы узнать, все ли в порядке. JavaScript.
Даже если это работает, остается вопрос, является ли n локальным для функции.
Это проверяет, n является локальным:
a=[3,5,7,11];
(function l () { for (var i = 0, n = a.length; i < n; i++) {
var e = a[i];
console.log(e);
}}) ();
console.log(typeof n == "undefined" ?
"as expected, n was local" : "oops, n was global");
На мгновение я не был уверен, переключаясь между языками.
Хотя оба варианта действительны, использование второго препятствует неопытным разработчикам размещать инструкции var по всему месту и вызывать проблемы с подъемом. Если в верхней части функции есть только одна переменная, то легче отлаживать код в целом. Это может означать, что строки, в которых объявлены переменные, не так ясны, как некоторые могут понравиться.
Я считаю, что компромисс стоит того, если это означает отлучение разработчика от сброса "var", где бы они ни находились.
Люди могут жаловаться на JSLint, я тоже делаю, но многие из них направлены не на устранение проблем с языком, а на исправление вредных привычек кодеров и, следовательно, предотвращение проблем в коде, который они пишут. Поэтому:
"В языках с областью блока обычно рекомендуется объявлять переменные на сайте первого использования. Но поскольку JavaScript не имеет области блока, разумнее объявить все функциональные переменные в верхней части функции. Для каждой функции рекомендуется использовать один оператор var". - http://www.jslint.com/lint.html#scope
Я думаю, это вопрос личных предпочтений. Я предпочитаю делать это следующим образом:
var /* Vars */
me = this, that = scope,
temp, tempUri, tempUrl,
videoId = getQueryString()["id"],
host = location.protocol + '//' + location.host,
baseUrl = "localhost",
str = "Visit W3Schools",
n = str.search(/w3schools/i),
x = 5,
y = 6,
z = x + y
/* End Vars */;
Еще одна причина, по которой исключить версию одного оператора (single var), - это отладка. Если исключение выбрано в любой из строк назначения, трассировка стека показывает только одну строку.
Если у вас было 10 переменных, определенных с помощью синтаксиса с запятой, у вас нет возможности напрямую узнать, кто из них был виновником.
Версия отдельной версии не страдает от этой двусмысленности.
Понятие "Сплоченность через сцепление" может применяться более широко, чем просто объекты/модули/функции. Он также может служить в этой ситуации:
Второй пример, предложенный OP, соединил все переменные в одном выражении, что делает невозможным взять одну из строк и переместить ее в другое место, не нарушая ничего (высокая связь). В первом примере, который он привел, присваивание переменных не зависит друг от друга (низкая связь).
"Низкая связь часто является признаком хорошо структурированной компьютерной системы и хорошего дизайна, а в сочетании с высокой когезией поддерживает общие цели высокой читаемости и удобства обслуживания".
http://en.wikipedia.org/wiki/Coupling_(computer_programming)
Так что выбирайте первый.
Старый пост, я знаю, но добавлю небольшую деталь перспективы для коллег Google:
Проблема с ремонтопригодностью может быть легко решена с помощью небольшого форматирования.
let
my_var1 = 'foo',
my_var2 = 'bar',
my_var3 = 'baz'
;
Я использую это форматирование строго как личное предпочтение. Я пропускаю этот формат для отдельных объявлений, конечно, или там, где он просто склеивает работы.
Я считаю, что до того, как мы начали использовать ES6, подход с единственной декларацией var не был ни хорошим, ни плохим (в случае, если у вас есть перемычки и 'use strict'. Это было действительно предпочтение вкуса, но теперь все изменилось для меня. пользу многострочной декларации:
Теперь у нас есть два новых вида переменных, и var стал устаревшим. Это хорошая практика, чтобы использовать const всюду, пока вам действительно не нужно let. Поэтому нередко ваш код будет содержать объявления переменных с настройкой в середине кода, а из-за блочного охвата вы часто будете перемещать переменные между блоками в случае небольших изменений. Я думаю, что это более удобно делать с многострочными объявлениями.
Синтаксис ES6 стал более разнообразным, мы получили деструкторы, строки шаблонов, функции стрелок и дополнительные настройки. Когда вы сильно используете все эти функции с помощью отдельных объявлений var, это ухудшает читаемость.
Я думаю, что лучший способ (несколько vars) лучше всего, поскольку в противном случае вы можете это сделать (из приложения, использующего Knockout), которое трудно читать по моему мнению:
var categories = ko.observableArray(),
keywordFilter = ko.observableArray(),
omniFilter = ko.observable('').extend({ throttle: 300 }),
filteredCategories = ko.computed(function () {
var underlyingArray = categories();
return ko.utils.arrayFilter(underlyingArray, function (n) {
return n.FilteredSportCount() > 0;
});
}),
favoriteSports = ko.computed(function () {
var sports = ko.observableArray();
ko.utils.arrayForEach(categories(), function (c) {
ko.utils.arrayForEach(c.Sports(), function (a) {
if (a.IsFavorite()) {
sports.push(a);
}
});
});
return sports;
}),
toggleFavorite = function (sport, userId) {
var isFavorite = sport.IsFavorite();
var url = setfavouritesurl;
var data = {
userId: userId,
sportId: sport.Id(),
isFavourite: !isFavorite
};
var callback = function () {
sport.IsFavorite(!isFavorite);
};
jQuery.support.cors = true;
jQuery.ajax({
url: url,
type: "GET",
data: data,
success: callback
});
},
hasfavoriteSports = ko.computed(function () {
var result = false;
ko.utils.arrayForEach(categories(), function (c) {
ko.utils.arrayForEach(c.Sports(), function (a) {
if (a.IsFavorite()) {
result = true;
}
});
});
return result;
});