Cerrar menu
Tutoriales En Linea
  • Tutoriales
    • Aprendizaje
    • Video Tutorial
    • Manuales
    • Hagalo usted mismo
    • Explorar todo
  • Adobe
    • After Effects
    • Dreamweaver
    • Premiere Pro CC
    • Photoshop
    • Photoshop Mix
    • Lightroom
    • Illustrator
    • Adobe Muse
    • Creative Cloud
  • Android
    • Developer Android
    • Aplicaciones
    • Android Studio
    • Android Wear
    • Desarrolladores
    • SDK Platform-Tools
    • ADB...depuración Bridge
    • Fastboot
    • Root
    • Recovery
  • Apple
    • iPhone y iPad
    • iPhone
    • iPad
    • Mac OS
    • iCloud
    • iTunes
  • Cursos
    • Actívate
    • Autoempleo
    • Idiomas
    • Curso De HTML
    • Curso de C++
    • Javascript
    • jQuery
    • Matematicas
    • Programacion
    • Python
    • Udacity
    • Diseño Web adaptativo
  • Ciberseguridad
    • Malware
    • Ransomware
    • Virus
    • Troyano
    • Dorkbot
    • Filecoders
    • keylogger
    • Spyware
    • Jackware
    • DDoS
    • HackerOne
    • Interpol
  • Criptomonedas
    • Blockchain
    • Mineria de Criptomonedas
    • Bitcoin (BTC)
    • Bitcoin Cash (BCH)
    • DASH (Dash)
    • Dogecoin (Doge)
    • Ethereum (ETH)
    • Litecoin (LTC)
    • Monero (XMR)
    • Ripple (XRP)
    • Zcash (ZEC)
    • Forex
    • Trading
  • Desarrollo Web
    • Sistema de gestion de contenidos
    • AMP
    • Datalife Engine
    • Blogger
    • WordPress
    • Joomla
    • Bootstrap
    • Plantillas
    • @font-face
    • Schema
    • Website
    • Desarrolladores
    • Lenguaje Web
  • Diseño Web
    • Web Responsive
    • Lenguaje Web
    • Datos estructurados
    • HTML
    • CSS3
    • JavaScript
    • Ajax
    • jQuery
    • PHP
  • Entretenimiento
  • Encuestas
    • GlobalTestMarket
    • Centro de opinion
    • Ipsos i-Say
    • Triaba
    • opinea
    • Toluna
    • YouGov
    • ClixSense
    • ySense
    • Cint
    • Beruby
  • Electricidad
  • Electronica
  • Ganar dinero comprando
    • CashbackDeals
    • Cashback
    • Por ir de compras
    • Aklamio
    • Intercambio de tráfico
    • Justificante de pagos
    • Webs estafas
  • Google
    • Google Pay
    • Adsense
    • Gmail
    • Google Apps
    • Google Chrome
    • Google Cloud Platform
    • Google Consumer Surveys
    • Google Desarrolladores
    • Google Fit
    • Google Maps
    • Google Photos
    • Google Play
    • Google Translation
    • DoubleClick
    • YouTube
    • Chromebooks
  • Marketing
    • SEM
    • SEO
    • Posicionamiento
    • Contenido
    • Publisuites
    • Space Content
    • Coobis
    • Marketing
  • Computadora u ordenador
    • Sistemas operativos
      • Windows
      • Mac OS
      • Android
      • Linux
      • Ubuntu
      • Kali Linux
      • Wifislax
    • hardware
    • Software
    • BIOS
    • Unidad de disco duro
    • Programacion
    • Dispositivos
    • Internet
  • Ofimática
    • Microsoft
    • Suite Ofimatica
    • Access
    • Word
    • Excel
    • Powerpoint
    • Outlook
    • Microsoft Publisher
  • PTC
    • No pierdas tiempo con estas web
  • Redes Sociales
    • Delicious
    • Facebook
    • Instagram
    • linkedin
    • Snapchat
    • TikTok
    • Twitter
    • Pinterest
    • Spotify
    • Vkontakte - VK
    • WhatsApp
  • Smartphone
    • Telefonos
    • Telefonia movil y telecomunicaciones
    • Desbloquear
    • Códigos NCK
    • Liberar
    • Tarjeta SIM
    • Tablet
  • Sitio Web
    • Dominios
    • Hosting
    • Servidores
    • Demo DLE
    • Documentación sobre Datalife Engine
    • Modulos DLE
    • Hack
    • Optimizacion
    • Google Adsense
    • Plantillas
  • Tips
    • Cabello
    • Consejos
    • Cremas
    • Cosmético
    • Cuerpo
    • Dieta
    • Exfoliantes
    • Entrenamiento
    • Ejercicio
    • Estilo
    • Fitness
    • Habitos
    • Hidratante
    • Look
    • Maquillaje
    • Moda
    • Piel Radiante
    • Recetas
    • Ropa
    • Rutina
    • Salud
    • Tratamientos
  • Trabajos
    • Atencion al cliente
    • Asistente virtual
    • Transcripcíon
    • Transcripcíones medica
    • Entrada de datos
    • De edicion y correccion
    • Mystery Shopping
    • Micro trabajos
    • Contabilidad
    • Tutoria y aprendizaje
    • Mas ingresos extras
    • Git
    • GitHub
    • Criptografia
    • Deep Web
    • Hacker
    • FTP
    • Indexar
    • Newsletter
    • Redes y VPN
    • Herramientas online
  • Windows
    • Skype
    • Windows
    • Windows 11
    • Windows 10
    • Windows 8
    • Windows 7
    • Puerta trasera de Windows
    • Microsoft Edge
Facebook X (Twitter) Instagram
  • Sobre nosotros
  • Últimos artículos
  • Herramientas SEO
  • Ver mas temas
  • Más sitios que te gustarán
Facebook X (Twitter) Instagram Pinterest Youtube
  • Secciones
    1. Android
    2. Adobe
    3. Bricolaje
    4. Bachillerato
    5. Cursos
    6. Criptomonedas
    7. Criptografia
    1. Diseño Web
    2. Encuestas
    3. Empleo
    4. Electricidad
    5. Electronica
    6. Forex
    7. Fisica
    1. Google
    2. Hardware
    3. Herramientas Ofimaticas
    4. Herramientas
    5. Internet
    6. Idiomas
    7. IPTV
    1. Programacion
    2. Libros
    3. Microsoft
    4. Manuales
    5. Matematica
    6. Newsletter
    7. Optimizacion
    1. Redes Sociales
    2. Software
    3. Seguridad
    4. Telefonia
    5. WebSite
    6. Ver todas las categorias
    7. Post promocionado
  • Smartphone

    Comprendre les Différences entre les Chargeurs USB et les Chargeurs USB-C : Un Guide Complet

    Huawei Smartphones: Las Mejores Ofertas del Black Friday para Aprovechar

    Gadgets imprescindibles para tu configuración de oficina en casa

    ¡Descubre las tendencias más emocionantes en el mundo de los videojuegos!

    Tendencias en sistemas operativos en smartphone

  • Tecnología
    1. Móviles
    2. Ordenadores
    3. Software
    4. Hardware
    5. Seguridad
    6. Ver todo

    Comprendre les Différences entre les Chargeurs USB et les Chargeurs USB-C : Un Guide Complet

    Huawei Smartphones: Las Mejores Ofertas del Black Friday para Aprovechar

    Gadgets imprescindibles para tu configuración de oficina en casa

    ¡Descubre las tendencias más emocionantes en el mundo de los videojuegos!

    Cómo limpiar la unidad C de archivos innecesarios

    Descubre el misterioso mundo del hash de archivos: ¡todo lo que necesitas saber!

    Los componentes fundamentales que todo PC debería tener

    Que es la tecla TAB

    Cifrado | Seguridad Local

    Maximiza tu productividad: Descubre el sistema interactivo que revolucionará la gestión de proyectos en tu empresa

    Cómo limpiar la unidad C de archivos innecesarios

    Como jugar online y resolver un sudoku

    Que es la tecla TAB

    Cómo deshabilitar la desfragmentación de SSD y HDD en Windows 10 y 11

    Benefits Of Vertical Dual Monitors For Coding And Programming

    AMD ha identificado la causa de la quema de los procesadores Ryzen 7000 y ha lanzado un nuevo AGESA para corregir el problema

    Cifrado | Seguridad Local

    Descubre el misterioso mundo del hash de archivos: ¡todo lo que necesitas saber!

    Virus en el sistema DataLife Engine (DLE) y cómo tratarlos

    La ciberseguridad: Vital Para Las Apuestas Online en España

    ¡Descubre las tendencias más emocionantes en el mundo de los videojuegos!

    ¿Aburrido de tu viejo televisor? Descubre las últimas tendencias en televisores

    Generador de Video IA: La Revolución en la Creación Audiovisual

    Los últimos celulares para que estés a la última

  • Estilo de vida
    1. Entrenamiento
    2. Maquillaje
    3. Dieta
    4. Moda
    5. Trucos y tips
    6. Ver todo

    Desarrolla un cuerpo fuerte y saludable

    ¿Qué es la forma física?

    Mejora los resultados de tu entrenamiento de estabilidad y fuerza

    Consejos para maximizar las caminatas diarias

    ¿Por qué es importante preparar la piel antes de maquillarla?

    Consejos para aplicar pestañas postizas

    Consejos para una piel perfecta este invierno

    La nutrición y un cabello saludable

    Cosas que le pasan a tu cuerpo cuando comes salmón todos los días

    Batidos de proteínas pueden ayudar a mejorar sus hábitos alimenticios

    Batidos de proteinas - Una guía para principiantes

    Snacks nutritivos para cada antojo

    Inspiración de traje de otoño

    La dura verdad sobre las modelos de talla grande

    Razones por las que las marcas de moda de lujo son tan caras

    Cuales son las mejores frutas para adelgazar

    Como enseñar a leer y a escribir

    Como generar cuentas Disneyplus

    Calcular porcentajes con la Calculadora de Windows 10

    Bricolaje para la decoración del hogar

    Top 10 de posturas de yoga

    ¿Por qué es importante preparar la piel antes de maquillarla?

    Inspiración de traje de otoño

    Consejos de belleza para lucir fresca en el verano

  • Marketing

    ¿Sirven de algo los diseñadores Web?… ¿y los redactores de contenido?

    ¿Qué es un Link Dofollow?

    ¿Qué es Nofollow?

    ¿Qué es el remarketing?

    ¿Qué es el posicionamiento web (SEO) y lo necesito para mi sitio web?

  • Juegos

    Para qué se pueden usar las Gafas VR PS4

    La nueva generación de realidad virtual de PlayStation®VR2 y PlayStation®5

    Colaboración entre Sony INZONE y EXCEL Esports

    Sony prohíbe cuatro juegos de terceros en Xbox

    Prepárate para el futuro: Project Trinity llega a finales de 2024

  • Herramientas
Búsqueda extendida

Escriba arriba y presione Enter para buscar.

¡Bienvenido de nuevo!

Inicie sesión o Regístrate ahora

VK

o con Email

¿Has olvidado tu contraseña?

Programacion » Diferencias clave entre var, let y const en JavaScript

Diferencias clave entre var, let y const en JavaScript


0 Agosto 07, 2019
Compartir

Compartir
Twitter Pinterest LinkedIn Tumblr WhatsApp Email
variable global y es pasada por referencia a scopes descendientes o herederos:
i = "global";
function foo() {
    i = "local";
    console.log(i); // local
}
foo();
console.log(i); // local
En el snippet anterior se puede ver como la variable i es una variable del ámbito global y es sobreescrita dentro de la función por ser pasada por referencia; la referencia al identificador i dentro y fuera de la función es la misma referencia. Sería equivalente a declarar la variable con el keyword var:
var i = "global";
function foo() {
    i = "local";
    console.log(i); // local
}
foo();
console.log(i); // local
Sin embargo, si declaramos la variable con var también dentro de la función, se crea una variable local cuya visibilidad se reduce a la propia función donde ha sido declarada:
var i = "global";
function foo() {
    var i = "local"; // Otra variable local solo para esta función
    console.log(i); // local
}
foo();
console.log(i); // global
Ahora hay dos variables con el mismo identificador pero en ámbitos diferentes y con referencias en memoria diferentes. La variable i dentro de la función tiene un scope reducido al ámbito de la función y no sobreescribe la variable global.

En resumen, la declaración con var define una variable en el ámbito local actual (lease función) y se hereda a scopes descendientes por referencia. Si la variable es declarada fuera de una función, la variable será una variable global.


Un último apunte sobre el ámbito de var, es que una variable declarada exclusivamente dentro de una función, no existe fuera de la misma, pues sería una variable local para esa función:
function foo() {
    var i = "local";
}
console.log(i); // ReferenceError: i is not defined

Hoisting


Además del ámbito de aplicación visto antes, una variable declarada con var es sometida a hoisting («izamiento» o «levantamiento»): la declaración de la variable es «levantada» hasta el inicio del ámbito de aplicación pero la asignación al valor permanece en el sitio donde se realice.

Si intentamos acceder a su valor antes de que se asigne el valor, obtendremos un valor indefinido (undefined),:
console.log(i); // undefined
var i = 1;
Este comportamiento se puede entender como «la variable i ha sido declarada en el programa pero en el momento de intentar acceder a ella aún no tenía un valor asignado». La interpretación sería similar al siguiente código:
var i; // Variable declarada pero valor no definido
console.log(i); // undefined
i = 1;
console.log(i); // 1
Sin embargo, si la variable no es declarada en absoluto obtendremos un ReferenceError, que no es lo mismo que obtener un valor indefinido:
console.log(x); // ReferenceError: x is not defined
var i = 1;
Debido a este comportamiento, se suele recomendar mover todas las declaraciones de variables al inicio del scope aunque no se asigne valor alguno, de esta forma se evitan estos posibles errores de ejecución.

El hoisting no es posible en variables declaradas con let o const; estas variables siempre darán un ReferenceError si se intenta acceder a ellas antes de que sean declaradas:
console.log(x); // ReferenceError: x is not defined
let x = 1;

Declaración de variables con let y const


let y const son dos formas de declarar variables en jаvascript introducidas en ES6 que reducen el ámbito de la variable a bloques (con var el ámbito era la función actual) y no iten hoisting. Además, las variables declaradas con const no pueden ser reagsinadas (aunque no significa que su valor sea inmutable, como veremos a continuación).

let


Un bloque en jаvascript se puede entender como «lo que queda entre dos corchetes», ya sean definiciones de funciones o bloques if, while, for y loops similares. Si una variable es declarada con let en el ámbito global o en el de una función, la variable pertenecerá al ámbito global o al ámbito de la función respectivamente, de forma similar a como ocurría con var.

Por ejemplo, en el siguiente snippet la variable i es una variable global y la variable j es una variable local:
let i = 0;
function foo() {
    i = 1;
    let j = 2;
    if(true) {
        console.log(i); // 1
        console.log(j); // 2
    }
}
foo();
Pero si declaramos una variable con let dentro un bloque que a su vez está dentro de una función, la variable pertenece solo a ese bloque:
function foo() {
    let i = 0;
    if(true) {
        let i = 1; // Sería otra variable i solo para el bloque if
        console.log(i); // 1
    }
    console.log(i); // 0
}
foo();
Fuera del bloque donde se declara con let, la variable no está definida:
function foo() {
    if(true) {
        let i = 1;
    }
    console.log(i); // ReferenceError: i is not defined
}
foo();
Debido a este comportamiento, muchos desarrolladores se inclinan hacia let como la forma predeterminada de declarar variables en jаvascript y abandonar var (1, 2, 3), pues el scope más específico previene la sobreescritura de variables de forma accidental al declarar variables sin ensuciar el scope superior.

const


El ámbito o scope para una variable declarada con const es, al igual que con let, el bloque, pero si la declaración con let previene la sobreescritura de variables, const directamente prohíbe la reasignación de valores (const viene de constant).

Con let una variable puede ser reasignada:
function foo() {
    let i = 0;
    if(true) {
        i = 1;
     }
     console.log(i); // 1
}
foo();
Con const no es posible; si se intenta reasignar una variable constante se obtendrá un error tipo TypeError:
const i = 0;
i = 1; // TypeError: Assignment to constant variable
Pero que no se puedan reasignar no significa que sean inmutables. Si el valor de una variable constante es «algo» mutable, como un array o un objeto, se pueden cambiar los valores de sus elementos.

Por ejemplo, una variable constante se puede asignar a un objeto con determinadas propiedades. Aunque la variable no se pueda asignar a un nuevo valor, si se puede cambiar el valor de sus propiedades. Esto sería posible:
const  = { name: 'Juan' };
.name = 'Manolo';
console.log(.name); // Manolo
Pero esto no sería posible:
const  = 'Juan';
 = 'Manolo'; // TypeError: Assignment to constant variable
Es decir, la variables declaradas con const son constantes (no reasignables) pero pueden ser mutables. Si es un objeto, incluso se podrían crear nuevas propiedades:
const  = { name: 'Juan' };
.surname = 'Padial';
console.log(); // {name: 'Juan', surname: 'Padial'}

Resumen


  1. var declara una variable de scope global o local para la función sin importar el ámbito de bloque. Permite hoisting.
  2. let declara una variable de scope global, local para la función o de bloque. Es reasignable y no permite hoisting.
  3. const declara una variable de scope global, local para la función o de bloque. No es reasignable, pero es mutable. No permite hoisting.
En general, let sería todo lo que se necesita dentro de un bloque, función o ámbito global. const sería para variables que no van sufrir una reasignación. var se puede relegar para cuando necesitemos hacer hoisting, vamos, casi nunca.
Síguenos en
Google News Flipboard
  • 100
  • 1
  • 2
  • 3
  • 4
  • 5
Comprobar la conexión a internet con JavaScript
Qué es el Shadow DOM
Tutoriales En Linea
Tutoriales En Linea
  • Website
  • Facebook
  • Twitter
  • LinkedIn
  • Pinterest
  • Instagram

Sobre mi: CEO de Tutoriales En Linea:
https://tutorialesenlinea.futbolgratis.org
Fundador y CEO de Tutoriales En Linea...Leer mas...

Artículos Relacionados


Los atributos data y el dataset API

Los atributos data y el dataset API

Qué son las HTTP cookies y como funcionan

Qué son las HTTP cookies y como funcionan

Diferencias entre break y continue en PHP

Diferencias entre break y continue en PHP


Comentarios



Información
s que no esten registrados no pueden dejar comentarios, te invitamos a que te registre!

Destacados

Lista IPTV con canales para colombia

Mayo 23 43 791

Como instalar SS IPTV en una Smart Tv Samsung

Ene 22 10 380

Como podemos conseguir proxies

Jun 21 11 616

Historia de los sistemas operativos

Mayo 16 31 052

Lo mas leidos

Herramientas SEO para posicionamiento de nuestra web 2024

Por 17-06-24

Herramienta online de generador de datos estructurados

Por Tutoriales En Linea 17-06-24

Las 7 mejores páginas para descargar películas en .torrent en español

Por 26-09-24

Etiquetas

Lenguajes De Programacion




Sobre nosotros

Tutoriales En Linea

¡Bienvenidos a Tutoriales En Línea, el sitio web perfecto para encontrar todas las herramientas necesarias para mejorar tus habilidades de forma gratuita! En Tutoriales En Linea se encuentran tutoriales, cursos online y aprendizaje de calidad, muy útiles para desarrollar tus capacidades... Leer mas...

Tiene una pregunta? ar...

Enlaces

  • Sobre nosotros
  • Ultimos tutoriales
  • Publicar tutorial
  • Ver mas temas
  • Ultimos comentarios
  • ¿Preguntas Frecuentes?
  • Derechos de autor
  • Politica de cookies
  • Nuestro equipo
  • Normas

Herramientas online

  • Buscador de recetas
  • Prueba de diseño web
  • Codificar en binarios, hexadecimales...
  • Cual es mi IP
  • Test de velocidad
  • Editor HTML
  • Test de escritura
  • Test de nutricion
  • Descargar Videos
  • Generador de datos estructurados

Recursos

  • Analisis de tus problemas de SEO
  • Herramientas SEO
  • Generar palabras claves
  • Referencia de CSS3
  • Convertir HTML a XML
  • Acortador de URL
  • Selector de colores
  • Contador de palabras
  • Comprimir imagenes
  • Conversor a URI de datos
  • Suscribirse
Facebook Twitter Instagram Pinterest Linkedin Youtube
  • Anunciarse
  • Socios externos
  • Política de privacidad
  • Términos y Condiciones
  • Sobre nosotros
  • ar
© Tutoriales En Linea. Reservados todos los derechos, queda prohibida la reproducción parcial o total sin previa autorización.