NOTA : Esta pregunta se hizo desde el punto de vista de ECMAScript versión 3 o 5. Las respuestas podrían quedar desactualizadas con la introducción de nuevas características en el lanzamiento de ECMAScript 6.

¿Cuál es exactamente la función de la varpalabra clave en JavaScript y cuál es la diferencia entre

var someNumber = 2;
var someFunction = function() { doSomething; }
var someObject = { }
var someObject.someProperty = 5;

y

someNumber = 2;
someFunction = function() { doSomething; }
someObject = { }
someObject.someProperty = 5;

?

¿Cuándo usaría alguno de ellos y por qué / qué hace?

Si estás en el ámbito global, entonces no hay mucha diferencia. Lea la respuesta de Kangax para una explicación.

Si está en una función var, creará una variable local, "no var" buscará la cadena de alcance hasta que encuentre la variable o llegue al alcance global (en ese momento la creará):

// These are both globals
var foo = 1;
bar = 2;

function()
{
    var foo = 1; // Local
    bar = 2;     // Global

    // Execute an anonymous function
    (function()
    {
        var wibble = 1; // Local
        foo = 2; // Inherits from scope above (creating a closure)
        moo = 3; // Global
    }())
}

Si no está haciendo una tarea, debe usar var:

var x; // Declare x

Hay una diferencia .

var x = 1 declara variable x en el alcance actual (también conocido como contexto de ejecución). Si la declaración aparece en una función, se declara una variable local; si está en alcance global, se declara una variable global.

x = 1, por otro lado, es simplemente una asignación de propiedad. Primero intenta resolver xcontra la cadena de alcance. Si lo encuentra en algún lugar de esa cadena de alcance, realiza la asignación; si no encuentra x, solo entonces crea una xpropiedad en un objeto global (que es un objeto de nivel superior en una cadena de alcance).

Ahora, observe que no declara una variable global, crea una propiedad global.

La diferencia entre los dos es sutil y puede ser confusa a menos que comprenda que las declaraciones de variables también crean propiedades (solo en un Objeto variable) y que cada propiedad en Javascript (bueno, ECMAScript) tiene ciertos indicadores que describen sus propiedades: ReadOnly, DontEnum y No borrar

Como la declaración variable crea una propiedad con el indicador DontDelete, la diferencia entre var x = 1yx = 1 (cuando se ejecuta en alcance global) es que la primera, la declaración variable, crea la propiedad DontDelete'able, y la segunda no. Como consecuencia, la propiedad creada a través de esta asignación implícita se puede eliminar del objeto global, y la primera, la creada mediante declaración de variable, no se puede eliminar.

Pero esto es solo teoría, por supuesto, y en la práctica hay aún más diferencias entre los dos , debido a varios errores en las implementaciones (como las de IE).

Espero que todo tenga sentido :)

[Actualización 2010/12/16]

En ES5 (ECMAScript 5; recientemente estandarizado, 5ta edición del lenguaje) hay un llamado "modo estricto" - un modo de lenguaje opcional, que cambia ligeramente el comportamiento de las tareas no declaradas. En modo estricto, la asignación a un identificador no declarado es un Error de referencia . La razón de esto fue detectar asignaciones accidentales, evitando la creación de propiedades globales no deseadas. Algunos de los navegadores más nuevos ya han comenzado a admitir el modo estricto. Ver, por ejemplo, mi tabla compat .

Decir que es la diferencia entre " local y global " no es del todo exacto.

Sería mejor pensar en ello como la diferencia entre " local y más cercano ". El más cercano seguramente puede ser global, pero ese no siempre será el caso.

/* global scope */
var local = true;
var global = true;

function outer() {
    /* local scope */
    var local = true;
    var global = false;

    /* nearest scope = outer */
    local = !global;

    function inner() {
        /* nearest scope = outer */
        local = false;
        global = false;

        /* nearest scope = undefined */
        /* defaults to defining a global */
        public = global;
    }
}

Cuando Javascript se ejecuta en un navegador, todo su código está rodeado por una instrucción with, así:

with (window) {
    //Your code
}

Más información sobre with - MDN

Como vardeclara una variable en el alcance actual , no hay diferencia entre declarar var dentro de la ventana y no declararla en absoluto.

La diferencia viene cuando no estás directamente dentro de la ventana, por ejemplo, dentro de una función o dentro de un bloque.

Utilizando var permite ocultar variables externas que tienen el mismo nombre. De esta manera, puede simular una variable "privada", pero ese es otro tema.

Una regla general es usar siempre var , porque de lo contrario corre el riesgo de introducir errores sutiles.

EDITAR: Después de las críticas que recibí, me gustaría enfatizar lo siguiente:

• var declara una variable en el alcance actual
• El alcance global es window
• No usar vardeclara implícitamentevar en el ámbito global (ventana)
• Declarar una variable en el alcance global (ventana) usando var es lo mismo que omitirla.
• Declarar una variable en ámbitos diferentes de la ventana usando var no es lo mismo declarar una variable sinvar
• Siempre declare varexplícitamente porque es una buena práctica

Utilice siempre la varpalabra clave para declarar variables. ¿Por qué? Una buena práctica de codificación debería ser una razón suficiente en sí misma, pero omitirla significa que se declara en el ámbito global (una variable como esta se denomina global "implícita"). Douglas Crockford recomienda nunca usar globales implícitos , y de acuerdo con las Pautas de codificación JavaScript de Apple :

Cualquier variable creada sin la var palabra clave se crea en el ámbito global y no se recolecta basura cuando la función regresa (porque no se sale del ámbito), presentando la oportunidad de una pérdida de memoria.

Aquí hay un buen ejemplo de cómo puede quedar atrapado al no declarar variables locales con var:

<script>
one();

function one()
{
    for (i = 0;i < 10;i++)
    {
        two();
        alert(i);
    }
}

function two()
{
    i = 1;
}
</script>

( ise restablece en cada iteración del bucle, ya que no se declara localmente en el forbucle sino globalmente) lo que finalmente da como resultado un bucle infinito

Yo diría que es mejor usar var en la mayoría de las situaciones.

Las variables locales son siempre más rápidas que las variables de alcance global.

Si no usas var para declarar una variable, la variable estará en el ámbito global.

Para obtener más información, puede buscar "JavaScript de cadena de alcance" en Google.

¡No lo uses var!

varera la forma anterior a ES6 para declarar una variable. Ahora estamos en el futuro , y deberías estar codificando como tal.

Uso constylet

constdebe usarse para el 95% de los casos. Hace que la referencia variable no pueda cambiar, por lo que las propiedades de la matriz, el objeto y el nodo DOM pueden cambiar y probablemente deberían serlo const.

letdebe usarse para cualquier variable que espera ser reasignada. Esto incluye dentro de un bucle for. Si alguna vez escribe varName =más allá de la inicialización, use let.

Ambos tienen un alcance de nivel de bloque, como se esperaba en la mayoría de los otros idiomas.

otra diferencia eg

var a = a || [] ; // works 

mientras

a = a || [] ; // a is undefined error.

Usar varsiempre es una buena idea para evitar que las variables desordenen el alcance global y que las variables entren en conflicto entre sí, causando una sobrescritura no deseada.

Sin var- variable global.

Se recomienda encarecidamente SIEMPRE usar la vardeclaración, porque la variable global init en el contexto local es malvada. Pero, si necesita este truco sucio, debe escribir un comentario al comienzo de la página:

/* global: varname1, varname2... */

Este es un código de ejemplo que he escrito para que entiendas este concepto:

var foo = 5; 
bar = 2;     
fooba = 3;

// Execute an anonymous function
(function() {    
    bar = 100;             //overwrites global scope bar
    var foo = 4;           //a new foo variable is created in this' function's scope
    var fooba = 900;       //same as above
    document.write(foo);   //prints 4
    document.write(bar);   //prints 100
    document.write(fooba); //prints 900
})();

document.write('<br/>');
document.write('<br/>');
document.write(foo);       //prints 5
document.write(bar);       //prints 100
document.write(fooba);     //prints 3

@ Chris S dio un buen ejemplo mostrando la diferencia práctica (y el peligro) entre vary novar . Aquí hay otro, considero que este es particularmente peligroso porque la diferencia solo es visible en un entorno asincrónico, por lo que puede pasar fácilmente durante las pruebas.

Como era de esperar, las siguientes salidas de fragmentos ["text"]:

function var_fun() {
  let array = []
  array.push('text')
  return array
}

console.log(var_fun())

Lo mismo ocurre con el siguiente fragmento (tenga en cuenta lo que falta letantes array):

function var_fun() {
  array = []
  array.push('text')
  return array
}

console.log(var_fun())

Ejecutar la manipulación de datos de forma asincrónica todavía produce el mismo resultado con un solo ejecutor:

function var_fun() {
  array = [];
  return new Promise(resolve => resolve()).then(() => {
    array.push('text')
    return array
  })
}

var_fun().then(result => {console.log(result)})

Pero se comporta de manera diferente con múltiples:

function var_fun() {
  array = [];
  return new Promise(resolve => resolve()).then(() => {
    array.push('text')
    return array
  })
}

[1,2,3].forEach(i => {
  var_fun().then(result => {console.log(result)})
})

Usando let sin embargo:

function var_fun() {
  let array = [];
  return new Promise(resolve => resolve()).then(() => {
    array.push('text')
    return array
  })
}

[1,2,3].forEach(i => {
  var_fun().then(result => {console.log(result)})
})

Como alguien que intenta aprender esto, así es como lo veo. Los ejemplos anteriores fueron quizás un poco demasiado complicados para un principiante.

Si ejecuta este código:

var local = true;
var global = true;


function test(){
  var local = false;
  var global = false;
  console.log(local)
  console.log(global)
}

test();

console.log(local);
console.log(global);

La salida se leerá como: falso, falso, verdadero, verdadero

Debido a que ve las variables en la función como separadas de las que están fuera de ella, de ahí el término variable local y esto se debió a que usamos var en la asignación. Si quitas la var en la función, ahora se lee así:

var local = true;
var global = true;


function test(){
  local = false;
  global = false;
  console.log(local)
  console.log(global)
}

test();

console.log(local);
console.log(global);

La salida es falsa, falsa, falsa, falsa

Esto se debe a que, en lugar de crear una nueva variable en el ámbito o función local, simplemente usa las variables globales y las reasigna a falso.

Veo que la gente se confunde al declarar variables con o sin var y dentro o fuera de la función. Aquí hay un ejemplo profundo que lo guiará a través de estos pasos:

Vea el script a continuación en acción aquí en jsfiddle

a = 1;// Defined outside the function without var
var b = 1;// Defined outside the function with var
alert("Starting outside of all functions... \n \n a, b defined but c, d not defined yet: \n a:" + a + "\n b:" + b + "\n \n (If I try to show the value of the undefined c or d, console.log would throw 'Uncaught ReferenceError: c is not defined' error and script would stop running!)");

function testVar1(){
    c = 1;// Defined inside the function without var
    var d = 1;// Defined inside the function with var
    alert("Now inside the 1. function: \n a:" + a + "\n b:" + b + "\n c:" + c + "\n d:" + d);

    a = a + 5;
    b = b + 5;
    c = c + 5;
    d = d + 5;

    alert("After added values inside the 1. function: \n a:" + a + "\n b:" + b + "\n c:" + c + "\n d:" + d);
};


testVar1();
alert("Run the 1. function again...");
testVar1();

function testVar2(){
    var d = 1;// Defined inside the function with var
    alert("Now inside the 2. function: \n a:" + a + "\n b:" + b + "\n c:" + c + "\n d:" + d);

    a = a + 5;
    b = b + 5;
    c = c + 5;
    d = d + 5;

    alert("After added values inside the 2. function: \n a:" + a + "\n b:" + b + "\n c:" + c + "\n d:" + d);
};

testVar2();

alert("Now outside of all functions... \n \n Final Values: \n a:" + a + "\n b:" + b + "\n c:" + c + "\n You will not be able to see d here because then the value is requested, console.log would throw error 'Uncaught ReferenceError: d is not defined' and script would stop. \n ");
alert("**************\n Conclusion \n ************** \n \n 1. No matter declared with or without var (like a, b) if they get their value outside the function, they will preserve their value and also any other values that are added inside various functions through the script are preserved.\n 2. If the variable is declared without var inside a function (like c), it will act like the previous rule, it will preserve its value across all functions from now on. Either it got its first value in function testVar1() it still preserves the value and get additional value in function testVar2() \n 3. If the variable is declared with var inside a function only (like d in testVar1 or testVar2) it will will be undefined whenever the function ends. So it will be temporary variable in a function.");
alert("Now check console.log for the error when value d is requested next:");
alert(d);

Conclusión

1. No importa si se declara con o sin var (como a, b) si obtienen su valor fuera de la función, conservarán su valor y también se conservarán los demás valores que se agreguen dentro de varias funciones a través del script.
2. Si la variable se declara sin var dentro de una función (como c), actuará como la regla anterior, conservará su valor en todas las funciones de ahora en adelante. O obtuvo su primer valor en la función testVar1 () aún conserva el valor y obtiene un valor adicional en la función testVar2 ()
3. Si la variable se declara con var solo dentro de una función (como d en testVar1 o testVar2), será indefinida cada vez que finalice la función. Por lo tanto, será una variable temporal en una función.

Dentro de un código, si usa una variable sin usar var, entonces lo que sucede es que var var_name se coloca automáticamente en el ámbito global, por ejemplo:

someFunction() {
    var a = some_value; /*a has local scope and it cannot be accessed when this
    function is not active*/
    b = a; /*here it places "var b" at top of script i.e. gives b global scope or
    uses already defined global variable b */
}

Además del problema de los alcances, algunas personas también mencionan el izado , pero nadie dio un ejemplo. Aquí hay uno para el alcance global:

console.log(noErrorCase);
var noErrorCase = "you will reach that point";

console.log(runTimeError);
runTimeError = "you won't reach that point";

Sin usar "var", las variables solo pueden definirse cuando se establece un valor. Por ejemplo:

my_var;

no puede funcionar en alcance global ni en ningún otro alcance . Debe tener un valor como:

my_var = "value";

Por otro lado, puede definir un valor variable;

var my_var;

Su valor es undefined(Su valor no es nully no es igual a nullinteresante).

Debe usar la palabra clave var a menos que tenga la intención de tener la variable asociada al objeto de ventana en el navegador. Aquí hay un enlace que explica el alcance y la diferencia entre el alcance global y el alcance local con y sin la palabra clave var.

Cuando las variables se definen sin el uso de la palabra clave var, lo que parece es una simple operación de "asignación".

Cuando el valor se asigna a una variable en javascript, el intérprete primero intenta encontrar la "declaración de variable" en el mismo contexto / alcance que el de la asignación. Cuando el intérprete se ejecuta dummyVariable = 20, busca la declaración de dummyVariable al comienzo de la función. (Dado que todas las declaraciones de variables se mueven al comienzo del contexto por el intérprete de JavaScript y esto se denomina elevación)

También es posible que desee ver la elevación en javascript