Pasar una variable por valor y por referencia en JavaScript

Autor: | Última modificación: 18 de julio de 2022 | Tiempo de Lectura: 2 minutos
Temas en este post:

Las funciones en JavaScript pueden escribirse de muchas maneras usando una combinación de diversos elementos para crear sus instrucciones. En este post, te explicaremos la diferencia entre pasar una variable por valor y por referencia en JavaScript a la hora de crear una función.

¿Qué es pasar una variable por valor y por referencia en JavaScript?

Cuando hablamos de pasar una variable por valor y por referencia en JavaScript nos referimos a pasar una variable usando un valor primitivo o un valor no primitivo. Entonces, pasar una variable por valor se refiere a asignarle uno de los siete elementos con valores primitivos de JavaScript. Por su parte, pasar una variable por referencia quiere decir que estamos asignándole un elemento con un valor no primitivo, sea un objeto, un array o una función.

¿Cuál es la diferencia?

La diferencia entre pasar una variable por valor y por referencia en JavaScript es su relación con lo que sucede dentro y fuera de la función. Cuando pasamos una variable por referencia, lo que «ocurre» dentro de la función «repercute» fuera de ella. Mientras tanto, cuando pasamos una variable por valor, lo que «ocurre» dentro de la función, «se queda» en la función, sin alterar el resto del código.

A continuación, te mostramos un ejemplo:

Supongamos que generamos la siguiente función usando valores primitivos, es decir, que la pasamos por valor:

let numero = 21;

const funcionValor = (value) => {

value = value * 10;

console.log (‘Dentro de la función, value es ${value}’);

}

funcionValor (numero);

console.log (‘Fuera de la función, value es ${numero}’);

Entonces, como hemos pasado la variable value por un valor primitivo (es decir, por valor), lo que suceda dentro de la función «se queda» dentro de ella y no afecta lo que se pinta fuera de la misma. El resultado de estas líneas de código es el siguiente:

Dentro de la función value es 210

Fuera de la función, value es 21

Ahora, veamos una función con una variable pasada por referencia. Como hemos visto, un array funciona como referencia. Entonces, a continuación, te presentamos una función hecha con elementos array:

let arrNumeros = [numero]

const funcionReferencia = (value) => {

value [0] * 10;

console.log (‘Dentro de la función, value [0] es ${value[0]}’);

}

funcionReferencia (arrNumeros)

console.log (‘Fuera de la función, arrNumeros [0] es ${arrNumeros [0]}’);

Como esta variable ha sido pasada por un array (es decir, por referencia), lo que sucede dentro de la función repercute en lo que se pinta fuera de ella. A continuación, te presentamos el resultado de estas líneas de código:

Dentro de la función, value [0] es 210

Fuera de la función, arrNumeros [0] es 210

Ya que una imagen vale más que mil palabras, te invitamos a ver este gif en el que se resume fácilmente el efecto de pasar una variable por valor y por referencia en JavaScript.

¿Qué sigue?

Ahora que sabes cómo pasar una variable por valor y por referencia en JavaScript, el siguiente paso es seguir aprendiendo sobre este lenguaje de programación web para crear tus propias líneas de código. Por ello, te invitamos a ser parte de nuestro Desarrollo Web Full Stack Bootcamp, donde aprenderás todo lo necesario para desarrollar en JavaScript y ejecutarás tu propio proyecto. ¡Te esperamos!

👉 Descubre más del Desarrollo Web Full Stack Bootcamp ¡Descarga el temario!

👉 Prueba el Bootcamp Gratis por una Semana ¡Empieza ahora mismo!

👉 Conoce nuestros otros Bootcamps en Programación y Tecnología

[email protected]

¿Sabías que hay más de 40.000 vacantes para desarrolladores de software sin cubrir en España? 

En KeepCoding llevamos desde 2012 guiando personas como tú a áreas de alta empleabilidad y alto potencial de crecimiento en IT con formación de máxima calidad.

 

Porque creemos que un buen trabajo es fuente de libertad, independencia, crecimiento y eso ¡cambia historias de vida!


¡Da el primer paso! 

¿Sabías que hay más de 40.000 vacantes para desarrolladores web sin cubrir en España? 

En KeepCoding llevamos desde 2012 guiando personas como tú a áreas de alta empleabilidad y alto potencial de crecimiento en IT con formación de máxima calidad.

 

Porque creemos que un buen trabajo es fuente de libertad, independencia, crecimiento y eso ¡cambia historias de vida!


¡Da el primer paso!