Variables

Las variables son una estructura de datos que asigna un nombre representativo a un valor. Pueden contener datos de cualquier tipo.

El nombre de una variable se denomina identificador. Un identificador válido debe seguir estas reglas:

  • Los identificadores pueden contener letras Unicode, signos de dólar ($) y guiones bajos caracteres (_), dígitos (0-9) e incluso algunos caracteres Unicode.
  • Los identificadores no pueden contener espacios en blanco, ya que el analizador los usa para elementos de entrada separados. Por ejemplo, si intentas llamar a una variable my Variable en lugar de myVariable, el analizador ve dos identificadores. my y Variable, y arroja un error de sintaxis ("token inesperado: identificador").
  • Los identificadores deben comenzar con una letra, un guion bajo (_) o un signo de dólar ($). No pueden comenzar con dígitos para evitar confusiones entre números y identificadores:

    let 1a = true;
    
    > Uncaught SyntaxError: Invalid or unexpected token
    

    Si JavaScript permitiera números al comienzo de un identificador, esto permitiría identificadores compuestos únicamente por números, lo que causa conflictos entre los números que se utilizan como Números y números que se usan como identificadores:

    let 10 = 20
    
    10 + 5
    > ?
    
  • "Palabras reservadas" que ya son sintácticamente significativos no se pueden usar como identificadores.

  • Los identificadores no pueden contener caracteres especiales (! . , / \ + - * =).

Las siguientes no son reglas estrictas para crear identificadores, pero son las prácticas recomendadas de la industria que facilitan el mantenimiento de tu código. Si tu cliente proyecto tiene diferentes estándares, síguelos en su lugar para mantener la coherencia.

A continuación del ejemplo establecido por los métodos y las propiedades integradas de JavaScript, camelCase (también estilizado como “camelCase”) es una convención muy común para identificadores compuestos por varias palabras. El uso de mayúsculas mediales es la práctica de mayúsculas en la primera letra de cada palabra, excepto en la primera letra de la legibilidad sin espacios.

let camelCasedIdentifier = true;

Algunos proyectos usan otras convenciones de nomenclatura según el contexto y la naturaleza de los datos. Por ejemplo, la primera letra de una clase por lo general, está en mayúsculas, por lo que los nombres de clase de varias palabras a menudo usan una variante de camel. caso comúnmente llamado "mayúsculas mediales" o Mayúscula Pascal.

class MyClass {

}

Los identificadores deben describir de manera concisa la naturaleza de los datos que contienen (por ejemplo, currentMonthDays es un nombre mejor que theNumberOfDaysInTheCurrentMonth) y leer de un vistazo con claridad (originalValue es mejor que val). El Los identificadores myVariable que se usan en este módulo funcionan en el contexto de ejemplos aislados, pero no serían útiles en el código de producción porque tienen no brindan información sobre los datos que contienen.

Los identificadores no deben ser demasiado específicos sobre los datos que contienen, sus valores pueden cambiar en función de cómo actúan las secuencias de comandos en función de esos datos o de las decisiones que toman los encargados de mantenimiento del futuro. Por ejemplo, una variable dada originalmente por es posible que deba cambiarse el identificador miles a un valor en kilómetros más adelante en en el proyecto y se les solicita a los encargados de mantenimiento que cambien cualquier referencia a esa variable por evitar confusiones en el futuro. Para evitar esto, usa distance como tu identificador. en su lugar.

JavaScript no otorga ningún privilegio o significado especial a los identificadores que comienzan con guiones bajos (_), pero suelen usarse para mostrar que una variable, un método o una propiedad es "privado", lo que significa que solo está pensado para usarse dentro del contexto del objeto que lo contiene y no deben a las que se accede o modifican fuera de ese contexto. Esta es una convención que se transfiere de otros lenguajes de programación y es anterior a la incorporación de JavaScript propiedades privadas.

Declaración de una variable

Hay varias formas de hacer que JavaScript conozca un identificador, un proceso llamada “declaración” una variable. Una variable se declara mediante los objetos let, const o var.

let myVariable;

Usa let o var para declarar una variable que se puede cambiar en cualquier momento. Estos le indican al intérprete de JavaScript que una cadena de caracteres es una identificador que puede contener un valor.

Cuando trabajes en una base de código moderna, usa let en lugar de var. var aún funciona en navegadores actualizados, pero tiene algunos comportamientos poco intuitivos que se definieron en las primeras versiones de JavaScript y, luego, no era posible cambiar para preservar la retrocompatibilidad. Se agregó let en ES6 para solucionar algunos problemas con el diseño de var.

Una variable declarada se inicializa mediante la asignación de un valor a la variable. Usa un signo igual único (=) para asignar o reasignar un valor a una variable. Puedes hacer lo siguiente: esto como parte de la misma declaración que la declara:

let myVariable = 5;

myVariable + myVariable
> 10

También puedes declarar una variable con let (o var) sin inicializarla. de inmediato. Si lo haces, el valor inicial de la variable es undefined hasta que tu código le asigna un valor.

let myVariable;

myVariable;
> undefined

myVariable = 5;

myVariable + myVariable
> 10

Una variable con un valor undefined es diferente de una variable no definida cuyo identificador aún no se declaró. Hacer referencia a una variable declarado causa un error.

myVariable
> Uncaught ReferenceError: myVariable is not defined

let myVariable;

myVariable
> undefined

La asociación de un identificador con un valor generalmente se denomina “vinculación”. La sintaxis que sigue a las palabras clave let, var o const se denomina «lista de enlace», y permite múltiples declaraciones de variables separadas por comas (que termina con el punto y coma esperado). De esta forma, los siguientes fragmentos de código funcionalmente idéntico:

let firstVariable,
     secondVariable,
     thirdVariable;
let firstVariable;
let secondVariable;
let thirdVariable;

Reasignar el valor de una variable no usa let (ni var), porque JavaScript ya sabe que la variable existe:

let myVariable = true;

myVariable
> true

myVariable = false;

myVariable
> false

Puedes reasignar a las variables valores nuevos en función de sus valores existentes:

let myVariable = 10;

myVariable
> 10

myVariable = myVariable * myVariable;

myVariable
> 100

Si intentas volver a declarar una variable con let en un entorno de producción, recibirás un error de sintaxis:

let myVariable = true;
let myVariable = false;
> Uncaught SyntaxError: redeclaration of let myVariable

Navegadores herramientas para desarrolladores son más permisivas sobre la redeclaración de let (y class), por lo que es posible que no ven el mismo error en Play Console.

Para preservar la compatibilidad de los navegadores heredados, var permite redeclaraciones innecesarias sin errores en ningún contexto:

var myVariable = true;
var myVariable = false;

myVariable\
> false

const

Usa la palabra clave const para declarar una constante, un tipo de variable que debe se inicializan y no se pueden cambiar. Identificadores de constantes sigue las mismas reglas que las variables declaradas con let (y var):

const myConstant = true;

myConstant
> true

No se puede declarar una constante sin asignarle inmediatamente un valor, porque constantes no se pueden reasignar una vez creadas, por lo que cualquier no constante se mantendría como undefined para siempre. Si intentas declarar una constante sin inicializarlo, obtendrás un error de sintaxis:

const myConstant;
Uncaught SyntaxError: missing = in const declaration

Intentas cambiar el valor de una variable declarada con const como lo harías cambiar el valor de una variable declarada con let (o var) provoca un tipo error:

const myConstant = true;

myConstant = false;
> Uncaught TypeError: invalid assignment to const 'myConstant'

Sin embargo, cuando una constante se asocia con un objeto, las propiedades de esa objeto puede alterarse.

const constantObject = { "firstvalue" : true };

constantObject
> Object { firstvalue: true }

constantObject.secondvalue = false;

constantObject
> Object { firstvalue: true, secondvalue: false }

Una constante que contiene un objeto es una forma referencia a un valor de datos mutable. Si bien no se puede cambiar la constante en sí, las propiedades de las se puede modificar, agregar o quitar el objeto:

const constantObject = { "firstvalue" : true };

constantObject = false
> Uncaught TypeError: invalid assignment to const 'constantObject'

Cuando no esperes que se reasigne una variable, es una práctica recomendada hacerla una constante. El uso de const informa a tu equipo de desarrollo o futuros encargados de mantenimiento de un proyecto no cambie ese valor, para evitar romper las suposiciones que tu código sobre cómo se usa, por ejemplo, que una variable finalmente se en comparación con un tipo de datos esperado.

Alcance de la variable

El alcance de una variable es la parte de la secuencia de comandos en la que esa variable está disponible. Fuera del alcance de una variable, no se definirá ni como un identificador Contener un valor undefined, pero como si no se hubiera declarado.

Según la palabra clave que uses para declarar una variable y el contexto en el que lo defines, puedes definir el alcance de variables para bloquear sentencias (alcance de bloque), funciones individuales (alcance de la función) o toda la aplicación de JavaScript (alcance global).

Alcance del bloque

El alcance de cualquier variable que declares mediante let o const se corresponda con su valor más cercano con una instrucción de bloqueo lo que significa que solo se puede acceder a la variable dentro de ese bloque. ¿Estás intentando acceder a una variable con alcance de bloque fuera del bloque que la contiene causa la misma cuando intenta acceder a una variable que no existe:

{
    let scopedVariable = true;
    console.log( scopedVariable );
}
> true

scopedVariable
> ReferenceError: scopedVariable is not defined

En lo que respecta a JavaScript, no existe una variable con alcance de bloque. fuera del bloque que lo contiene. Por ejemplo, puedes declarar una constante dentro de un bloque, y declara otra constante fuera de ese bloque que usa el mismo identificador:

{
  const myConstant = false;
}
const myConstant = true;

scopedConstant;
> true

Aunque una variable declarada no puede extenderse a su bloque superior, Está disponible para todos los bloques subordinados:

{
    let scopedVariable = true;
    {
    console.log( scopedVariable );
    }
}
> true

El valor de una variable declarada se puede cambiar desde un bloque subordinado:

{
    let scopedVariable = false;
    {
    scopedVariable = true;
    }
    console.log( scopedVariable );
}
> true

Se puede inicializar una variable nueva con let o const dentro de un elemento subordinado. bloque sin errores, incluso si usa el mismo identificador que una variable en un bloque principal:

{
    let scopedVariable = false;
    {
    let scopedVariable = true;
    }
    console.log( scopedVariable );
}
> false

Alcance de la función

El alcance de las variables declaradas con var se establece en la función contenedora más cercana. (o un bloque de inicialización estática dentro de una clase).

function myFunction() {
    var scopedVariable = true;

    return scopedVariable;
}

scopedVariable;
> ReferenceError: scopedVariable is not defined

Esto sigue siendo así después de que se ha llamado a una función. Si bien el variable se inicializa mientras se ejecuta la función, esa variable sigue disponibles fuera del alcance de la función:

function myFunction() {
    var scopedVariable = true;

    return scopedVariable;
}

scopedVariable;
> ReferenceError: scopedVariable is not defined

myFunction();
> true

scopedVariable;
> ReferenceError: scopedVariable is not defined

Alcance global

Una variable global está disponible en toda la aplicación de JavaScript, dentro de todos los bloques y las funciones, a cualquier secuencia de comandos de la página.

Si bien este puede parecer un valor predeterminado deseable, las variables que cualquier parte de que una aplicación pueda acceder y modificar puede agregar una sobrecarga innecesaria o incluso causar colisiones con variables en otra parte de una aplicación con el mismo identificador. Esto se aplica a todo el código JavaScript involucrado en el procesamiento de una página. como bibliotecas de terceros y estadísticas de usuarios. Por lo tanto, es práctica recomendada para evitar contaminar el alcance global siempre que sea posible.

Cualquier variable declarada con var fuera de una función superior, o bien con let const fuera de un bloque superior, es global:

var functionGlobal = true; // Global
let blockGlobal = true; // Global

{
    console.log( blockGlobal );
    console.log( functionGlobal );
}
> true
> true

(function() {
    console.log( blockGlobal );
    console.log( functionGlobal );
}());
> true
> true

Asignar un valor a una variable sin declararla explícitamente (es decir, nunca usar var, let o const para crearla), eleva una variable al alcance global, incluso cuando se inicializan dentro de una función o un bloque. Una variable que se crea con este patrón a veces se denomina “global implícito”.

function myFunction() {
    globalVariable = "global";

    return globalVariable
}

myFunction()\
> "global"

globalVariable\
> "global"

Elevación de variables

Las declaraciones de variables y funciones se elevan a la parte superior de su alcance. lo que significa que el intérprete de JavaScript procesa cualquier variable declarada en cualquier en una secuencia de comandos y la mueve eficazmente a la primera línea de la secuencia el permiso antes de ejecutar la secuencia de comandos. Esto significa que una variable declarada con Se puede hacer referencia a var antes de declarar la variable sin encontrar un error:

hoistedVariable
> undefined

var hoistedVariable;

Como solo se aloja la declaración de variable, no la inicialización Variables que no se declararon de forma explícita con var, let o const no se elevan:

unhoistedVariable;
> Uncaught ReferenceError: unhoistedVariable is not defined

unhoistedVariable = true;

Como se mencionó anteriormente, una variable declarada, pero no inicializada se le asigna un valor de undefined. Ese comportamiento se aplica a la variable elevada declarativas, pero solo a aquellas declaradas con var.

hoistedVariable
> undefined

var hoistedVariable = 2 + 2;

hoistedVariable\
> 4

Este comportamiento poco intuitivo es, en gran parte, un obstáculo de las decisiones de diseño tomadas en las primeras versiones de JavaScript, y no se pueden cambiar sin el riesgo de romper sitios existentes.

let y const abordan este comportamiento mostrando en cambio un error cuando se variable antes de crearla:

{
    hoistedVariable;

    let hoistedVariable;
}
> Uncaught ReferenceError: can't access lexical declaration 'hoistedVariable' before initialization

Este error es diferente de "elevadVariable no está definida" CANNOT TRANSLATE cuando intentes acceder a una variable no declarada. Debido a que JavaScript elevó la variable, sabe que esta se creará dentro el alcance dado. Sin embargo, en lugar de hacer que esa variable esté disponible antes de su con un valor de undefined, el intérprete arroja un error. Se dice que las variables declaradas con let o const (o class) existen en un "zona sin conexión temporal" (“TDZ”) desde el inicio del bloque que los contiene hasta que punto del código donde se declara la variable.

La zona sin conexión temporal hace que el comportamiento de let sea más intuitivo que var para autores. También es fundamental para el diseño de const. Debido a que las constantes no pueden cambió, una constante elevada a la parte superior de su alcance y a partir de un valor implícito de undefined no se pudieron inicializar con un valor significativo.

Verifica tus conocimientos

¿Con qué tipos de caracteres puedes iniciar un identificador?

Un guion bajo
Un dígito
Una carta

¿Cuál es el método preferido para declarar una variable cuyo valor se puede cambiar en cualquier momento?

const
var
permitir