print - variables int en javascript

Declarar múltiples variables en JavaScript

Question

En JavaScript, es posible declarar múltiples variables como esta:

var variable1 = "Hello World!";
var variable2 = "Testing...";
var variable3 = 42;

...o así:

var variable1 = "Hello World!",
    variable2 = "Testing...",
    variable3 = 42;

¿Un método es mejor / más rápido que el otro?

Answer 1

Además de la capacidad de mantenimiento, la primera forma elimina la posibilidad de creación de variables globales de accidentes:

(function () {
var variable1 = "Hello World!" // semicolon is missed out accidently
var variable2 = "Testing..."; // still a local variable
var variable3 = 42;
}());

Mientras que la segunda vía es menos indulgente:

(function () {
var variable1 = "Hello World!" // comma is missed out accidently
    variable2 = "Testing...", // becomes a global variable
    variable3 = 42; // a global variable as well
}());

Answer 2

Aunque ambos son válidos, el uso de la segunda desalienta a los desarrolladores sin experiencia de colocar declaraciones var en todo el lugar y causar problemas de elevación. Si solo hay una var por función, en la parte superior de la función, entonces es más fácil depurar el código en su totalidad. Esto puede significar que las líneas donde se declaran las variables no son tan explícitas como a algunas les pueden gustar.

Siento que la compensación vale la pena, si eso significa destetar a un desarrollador para que deje caer ''var'' en cualquier lugar que desee.

La gente puede quejarse de JSLint, yo también, pero muchas de ellas están orientadas no a solucionar problemas con el idioma, sino a corregir los malos hábitos de los codificadores y, por lo tanto, a prevenir problemas en el código que escriben. Por lo tanto:

"En idiomas con alcance de bloque, generalmente se recomienda que las variables se declaren en el sitio de primer uso. Pero como JavaScript no tiene alcance de bloque, es más inteligente declarar todas las variables de una función en la parte superior de la función. Es recomendó que se use una única sentencia var por función ". - http://www.jslint.com/lint.html#scope

Answer 3

Creo que antes de que comenzáramos a usar ES6, el enfoque con declaración de var individual no era bueno ni malo (en caso de que tengas linters y ''use strict'' . Realmente era una preferencia de sabor. Pero ahora las cosas cambiaron para mí. favor de la declaración multilínea:

1. Ahora tenemos dos nuevos tipos de variables, y var volvió obsoleto. Es una buena práctica usar const todas partes hasta que realmente lo necesite. Entonces, con bastante frecuencia, su código contendrá declaraciones de variables con una asignación en medio del código, y debido al alcance del bloque, con frecuencia moverá las variables entre bloques en caso de pequeños cambios. Creo que es más conveniente hacerlo con declaraciones de varias líneas.

2. La sintaxis de ES6 se hizo más diversa, obtuvimos destructores, cadenas de plantillas, funciones de flecha y funciones opcionales. Cuando utilizas mucho todas las funciones con declaraciones de var. Única, daña la legibilidad.

Answer 4

Creo que es una cuestión de preferencia personal. Prefiero hacerlo de la siguiente manera:

   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 */;

Answer 5

Creo que la primera forma (múltiples vars) es la mejor, ya que de otro modo podrías terminar con esto (desde una aplicación que usa Knockout), que es difícil de leer en mi opinión:

    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;
        });

Answer 6

ECMAScript6 introdujo la tarea de desestructuración que funciona bastante bien:

[a, b] = [1, 2] a será igual a 1 y b será igual a 2 .

Answer 7

El concepto de "Cohesion over Coupling" se puede aplicar de manera más general que solo objetos / módulos / funciones. También puede servir en esta situación:

El segundo ejemplo que sugirió el OP ha acoplado todas las variables en la misma declaración, lo que hace que sea imposible tomar una de las líneas y moverla a otro lugar sin romper cosas (acoplamiento alto). El primer ejemplo que dio hace que las asignaciones de variables sean independientes entre sí (acoplamiento bajo).

"El acoplamiento bajo es a menudo un signo de un sistema informático bien estructurado y un buen diseño, y cuando se combina con una alta cohesión, apoya los objetivos generales de alta legibilidad y mantenimiento".

http://en.wikipedia.org/wiki/Coupling_(computer_programming)

Así que elige el primero.

Answer 8

Es común usar una declaración var por alcance para la organización. La forma en que todos los "ámbitos" siguen un patrón similar que hace que el código sea más legible. Además, el motor los "eleva" a todos de todos modos. Así que mantener sus declaraciones juntas imita lo que realmente sucederá más de cerca.

Answer 9

Es mucho más legible cuando lo haces de esta manera:

var hey = 23;
var hi = 3;
var howdy 4;

Pero toma menos espacio y líneas de código de esta manera:

var hey=23,hi=3,howdy=4;

Puede ser ideal para ahorrar espacio, pero deje que los compresores de JavaScript lo manejen por usted.

Answer 10

Es solo una cuestión de preferencia personal. No hay diferencia entre estas dos formas, excepto unos pocos bytes guardados con la segunda forma si elimina el espacio en blanco.

Answer 11

La primera forma es más fácil de mantener. Cada declaración es una sola declaración en una sola línea, por lo que puede agregar, eliminar y reordenar fácilmente las declaraciones.

Con la segunda forma, es molesto eliminar la primera o la última declaración porque contienen la palabra clave var y el punto y coma. Y cada vez que agregue una nueva declaración, debe cambiar el punto y coma en la línea anterior a una coma.

Answer 12

Mi único, pero esencial uso para la coma es en un bucle for:

for (var i = 0, n = a.length; i < n; i++) {
  var e = a[i];
  console.log(e);
}

Fui aquí para ver si esto está bien en JavaScript.

Incluso viéndolo funcionar, quedaba una pregunta si n es local a la función.

Esto verifica, n es local:

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");

Por un momento no estaba seguro, cambiando entre idiomas.

Answer 13

Otra razón para evitar la versión única de la sentencia ( var individual) es la depuración. Si se lanza una excepción en cualquiera de las líneas de asignación, el seguimiento de pila muestra solo una línea.

Si tenía 10 variables definidas con la sintaxis de coma, no tiene forma de saber directamente cuál fue el culpable.

La versión de declaración individual no sufre de esta ambigüedad.

Answer 14

Tal vez asi

var variable1 = "hello world"
, variable2 = 2
, variable3 = "how are you doing"
, variable4 = 42;

Excepto al cambiar la primera o la última variable, es fácil de mantener y leer.

Answer 15

Use ES6 Destructura asignación : Desempaquetará valores de arrays, o propiedades de objetos, en variables distintas.

let [variable1 , variable2, variable3] = 
["Hello World!", "Testing...", 42];

console.log(variable1); // Hello World!
console.log(variable2); // Testing...
console.log(variable3); // 42

Answer 16

var variable1 = "Hello World!";
var variable2 = "Testing...";
var variable3 = 42;

es más legible que:

var variable1 = "Hello World!",
    variable2 = "Testing...",
    variable3 = 42;

Pero hacen lo mismo.