¿Que es una función?
Iniciemos con 2 primicias básicas.
-Nos sirven para empaquetar código.
-Nos permiten utilizar este código donde y las veces que lo necesitemos.
Sintaxis básica y ejemplo
-Utilizamos la palabra reservada function
-le ponemos un nombre
-Paréntesis ().- los cuales pueden recibir parámetros
-Corchete {} Código que guardara nuestra función
function Nombre_Funcion (){
console.log("Instruccion guardada")
}
Vamos a notar que al recargar nuestra pagina , la instrucción (console.log) no se ejecuta.
Recordemos ; Una función guarda código , mas no la ejecuta.
Invocar/Ejecutar una Función
Para ejecutar nuestra función ,simplemente debemos escribir su nombre ,seguido de paréntesis ()
Nombre_Funcion();
Código completo
function Nombre_Funcion (){
console.log("Instruccion guardada")
}
Nombre_Funcion();
Bien hasta el momento , Probemos 2 cosas mas
1) Escribiremos mas instrucciones en nuestro empaquetado
function Nombre_Funcion (){
console.log("Instruccion guardada")
console.log("podemos escribir")
console.log("la cantidad de instrucciones")
console.log("que queramos")
}
Nombre_Funcion();
2) Voy a invocar 2 veces nuestra función.
function Nombre_Funcion (){
console.log("Instruccion guardada")
console.log("podemos escribir")
console.log("la cantidad de instrucciones")
console.log("que queramos")
}
Nombre_Funcion();
Nombre_Funcion();
Todo bien hasta este momento
Recapitulemos
Las funciones nos permiten empaquetar codigo/Instrucciones , que podemos invocar donde queramos, y las veces que queramos con tan solo escribir su nombre()
lo cual nos da un código mas legible , fácil de ordenar y reutilizable, lo que significa un código mas simplificado.
Funciones con parámetros
Un parámetro es una variable de tipo local (Que solo funciona dentro de la función). la cual recibe su valor en la invocación , vayamos al ejemplo.
function Nombre_Funcion (parametro_1){
console.log(`Buena dia ${parametro_1}`)
}
Nombre_Funcion("carlos");
Recordatorio ; No se pueden usar los parámetros definidos fuera de la función (tienen un alcance solo local)
function Nombre_Funcion (parametro_1){
console.log(`Buena dia ${parametro_1}`)
}
Nombre_Funcion("carlos");
console.log(parametro_1) //Error
Escribir mas de 1 parámetro.
Podemos escribir tantos parámetros que necesitemos, tan solo en la construcción de la función, hay que separarlos por comas , y al invocarla sus valores también separarlas por comas , estas recibirán sus valores en el orden escrito
Ejemplo
function Nombre_Funcion (par_1,par_2,par_3){
console.log(`Soy ${par_1} tengo ${par_2} monedas de a ${par_3}`)
}
Nombre_Funcion("carlos", 3 , peso);
Ejemplo 2
function Nombre_Funcion (parametro_1,parametro_2,parametro_3){
console.log(`Soy ${parametro_1} tengo ${parametro_2} monedas de a ${parametro_3} ` )
}
Nombre_Funcion("carlos", 3 , "peso");
Nombre_Funcion("Erik", 2 , "dolar");
Nombre_Funcion("Juan", 4 , "franco");
Poco a poco nos damos cuenta la utilidad de las funciones para automatizar código.
Hemos echo una maquina donde construimos la estructura para solo mandarle datos y recibirlos ya procesados , un ejemplo de esto en la vida real es una calculadora.
hagamos una estructura simple de una calculador que suma 2 números.
function Calc_Suma (num_1,num_2){
let suma = num_1 + num_2
console.log(suma)
}
Calc_Suma(3,4); // 7
Calc_Suma(1,2); // 3
Calc_Suma(3,2); // 5
Funciona perfectamente , pero.. si no queremos imprimirlo en consola dentro de la función , y si queremos guardar el resultado para usarla mas adelante , y por mas adelante nos referimos a fuera de la función.
Tal como esta , la variable suma no puede usarse ya que su alcance es local
function Calc_Suma (num_1,num_2){
let suma = num_1 + num_2
}
Calc_Suma(3,4); // 7
console.log(suma) // 7
Return
Esta funcionalidad lo que hará será pasar el valor que le escribamos proveniente dentro de nuestra función a nuestra invocación.
function Calc_Suma (num_1,num_2){
return num_1 + num_2 //Envia valor
}
Calc_Suma(3,4); //Recibe valor
Procedemos a guardarla en una variable , para poder manipular mas a gusto y en este caso la imprimiremos en consola.
function Calc_Suma (num_1,num_2){
return num_1 + num_2 // 7
}
let suma_1 = Calc_Suma(3,4); // 7
console.log(suma_1)
Listo , aprendimos a manipular el resultado de nuestra función fuera de esta.
Haremos un ejemplo; crearemos una función para calcular restas e imprimiremos varias
TRATA DE HACERLO SIN VER EL CODIGO...
function Calc_Resta (num_1,num_2){
return num_1 - num_2
}
let Resta_1 = Calc_Resta(8,1);
let Resta_2 = Calc_Resta(7,2);
let Resta_3 = Calc_Resta(9,5);
let Resta_4 = Calc_Resta(6,2);
console.log(Resta_1)
console.log(Resta_2)
console.log(Resta_3)
console.log(Resta_4)
Conclusión
En este articulo , hemos aprendido lo básico para escribir funciones ,suficiente para seguir avanzando en el curso , iniciar tus primeras practicas e incluso escribir tus primeras aplicaciones web .
A pesar de ser solo lo principal , tienes mucho material de donde practicar y experimentar.
Despedida
Esperemos te haya servido de utilidad este articulo , síguenos en nuestras redes sociales para seguir aprendiendo juntos , compártenos cualquier duda o comentario que te haya surgido , puede ayudarnos a crecer a ambos.
TE DEJAMOS UNA imagen que puedes guardar como apuntes de tu progreso.
No hay comentarios:
Publicar un comentario