Hoy en nuestro Curso Profesional de JavaScript Avanzado uno de nuestros amigos nos preguntó sobre la diferencia entre “parámetros” y “argumentos” así que decidí dejar aquí la explicación para futura referencia.
Pregunta
Hola Alex! Tengo una preguntita que me da un poco de vergüenza preguntar porque es como muy básica y ya debería saber la respuesta.
Pero desafortunadamente no la sé, y siempre es fuente de confusión para mí. Tiene que ver con los métodos en JS.
Cuando creo un método que toma dos argumentos, cada vez que llamo a ese método tengo necesariamente que meterle esos dos argumentos, ¿verdad?
Luego quería preguntarte también, ¿cuál es la diferencia entre “parámetro” y “argumento”?
Respuesta
Que tal esta es una excelente pregunta; y no te preocupes para nada debe darte vergüenza ya que es algo importantísimo de comprender. Aquí te dejo varios puntos referentes a “parámetros” y “argumentos” en JavaScript.
Los parámetros son la lista de variables que ponemos cuando se define una función, por ejemplo, en la siguiente función tenemos dos parámetros “a” y “b”:
function sum(a, b) {
return a + b;
}
Los argumentos son los valores que se pasan a la función cuando ésta es invocada, de esta manera, en el siguiente ejemplo tendríamos que “7”, “4” son los argumentos de nuestra invocación a la función:
const result = sum(7, 4);
Aclarado lo anterior, en las definiciones de funciones suelen haber parámetros que son opcionales, como en este caso en la documentación de la Mozilla Developer Network (MDN) sobre el método filter tenemos: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
var newArray = arr.filter(callback(element[, index[, array]])[, thisArg]);
Lo que quiere decir que el único parámetro requerido por “filter” es un “callback” y a su vez este “callback” tiene como único parámetro requerido al “element” que es precisamente cada uno de los elementos disponibles durante el ciclo (loop). Los parámetros opcionales son los que están entre corchetes”[ ]”
var filtrarNumerosPares = function(numero) {
return numero % 2 === 0;
};
var numerosPares = [3,4, 7, -1].filter(filtrarNumerosPares);
console.log(numerosPares); // 4 es el único número par
De hecho de manera equivalente podríamos escribir nuestro “filter” así:
var filtered = [3,4, 7, -1].filter(function(numero) {
return numero % 2 === 0;
});
Y más aún, en ES2015 podríamos reducir nuestra instrucción a una sola línea, usando un “return” implícito:
var filtered = [12, 5, 8, 130, 44].filter(numero => numero % 2 === 0);
Y el objeto “arguments” ¿para qué sirve?
Otra cosa interesante es que JavaScript tiene una variable local implícita llamada arguments, la cual te da la posibilidad de acceder a los argumentos del llamado a tu función.
Imagina que quieres validar que SIEMPRE te manden un cierto número de argumentos para que tu función se ejecute correctamente, eso lo podrías lograr con algo como esto:
function sum(a, b) {
if(arguments.length !== 2) {
throw new Error("Unable to run, the sum() function needs TWO arguments...");
}
return a + b;
}
/* Mandará un error porque sólo hemos pasado "un solo argumento" */
const result = sum(7);
¿Te gustaría aprender más sobre JavaScript?
Adquiere nuestro Curso Profesional de JavaScript Avanzado y aprende entre otras cosas: patrones de diseño, promesas, ES2015+, y mucho más.
Saludos.
Spoiler alert!