12 - Funciones
¿Qué es una función?
Es un fragmento de nuestro código que podemos llamar y reutilizar las veces que queramos a lo largo de nuestro script.
Estructura inicial
En nuestra carpeta de proyecto crearemos la siguiente estructura:
/
├── js/
│ └── 12-funciones.js
└── index.htmlY un código sencillo para nuestro HTML:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="./js/12-funciones.js"></script>
<title>12 - Funciones</title>
</head>
<body>
<h1>Temario de JavaScript</h1>
</body>
</html>Estructura de una función
Para crear una función, primero debemos declararla y luego llamarla cada vez que lo deseemos:
function nombreFuncion() {
//Código a ejecutar
}
nombreFuncion()También podemos hacer que reciba parámetros (obligatorios y opcionales) y devuelva valores:
/* z es un parámetro opcional al tener un valor por defecto */
function nombreFuncion(x, y, z = valorPorDefecto) {
//Código a ejecutar
return valorADevolver
}
/* Al ser z opcional, podemos omitirlo al llamar a la función */
let valor = nombreFuncion(x, y) //valorADevolverEjemplos de funciones
function holaMundo() {
console.log("Hola, mundo")
}
function suma(x, y) {
return x + y
}
function esPar(num) {
if(num % 2 === 0) {
return num + " es par."
} else {
return num + " es impar."
}
}
function saludo(nombre, consola = true) {
if(consola) { //Sería lo mismo que poner if(consola == true)
console.log("Hola, " + nombre)
} else {
document.write("Hola, " + nombre)
}
}
holaMundo() //Hola, mundo
let resultado = suma(3, 6)
console.log(resultado) //9
console.log(esPar(4)) //4 es par.
console.log(esPar(7)) //7 es impar.
saludo("Paco") //Aquí podemos omitir el valor de consola porque true es el valor por defecto.
saludo("Luisa", false)