Les funcions son blocs de codi que es poden reutilitzar en altres parts del codi.

Funcions

Muy a menudo necesitamos realizar acciones similares en muchos lugares del script.

Por ejemplo, debemos mostrar un mensaje atractivo cuando un visitante inicia sesión, cierra sesión y tal vez en otros momentos.

Las funciones son los principales “bloques de construcción” del programa. Permiten que el código se llame muchas veces sin repetición.

Ya hemos visto ejemplos de funciones integradas, como alert(message), prompt(message, default) y confirm(question). Pero también podemos crear funciones propias.

Declaración de funciones

Para crear una función podemos usar una declaración de función.

Se ve como aquí:

function showMessage() {
    console.log("Hello everyone!")
}

La palabra clave function va primero, luego va el nombre de la función, luego una lista de parámetros entre paréntesis (separados por comas, vacía en el ejemplo anterior) y finalmente el código de la función entre llaves, también llamado “el cuerpo de la función”.

function name(parameter1, parameter2, ... parameterN) {
 // body
}

Nuestra nueva función puede ser llamada por su nombre: showMessage().

Por ejemplo:

function showMessage() {
    console.log("Hello everyone!")
}

showMessage()
showMessage()

La llamada showMessage() ejecuta el código de la función. Aquí veremos el mensaje dos veces.

Este ejemplo demuestra claramente uno de los propósitos principales de las funciones: evitar la duplicación de código…

Si alguna vez necesitamos cambiar el mensaje o la forma en que se muestra, es suficiente modificar el código en un lugar: la función que lo genera.

Variables locals

Una variable declarada dentro de una función solo es visible dentro de esa función.

Por ejemplo:

function showMessage() {
    let message = "Hello, I'm TypeScript!" // local variable
    alert(message)
}

showMessage() // Hello, I'm JavaScript!
alert(message) // <-- Error! The variable is local to the function

Variables globals

Variables declaradas fuera de cualquier funciónse llaman globales.

El código moderno tiene pocas o ninguna variable global, aunque a veces puede justificarse almacenar algunos datos a nivel de proyecto.

Las variables globales son visibles desde cualquier función

let userName = 'John'

function showMessage() {
    let message = `Hello, ${userName}`
    alert(message)
}

showMessage() // Hello, John

La función tiene acceso completo a la variable externa.

Puede modificarlo también:

let userName = 'John'

function showMessage() {
    userName = 'Bob'
    let message = `Hello, ${userName}`
    alert(message)
}

showMessage() // Hello, Bob

La variable externa solo se usa si no hay una local.

Si una variable con el mismo nombre se declara dentro de la función, le hace sombra a la externa.

Por ejemplo, en el siguiente código la función usa la variable local userName i la variable exterior se ignora:

let userName = 'John'

function showMessage() {
    let userName = 'Alice'
    let message = `Hello, ${userName}`
    alert(message)
}

showMessage() // Hello, Alice

Parámetros

Podemos pasar datos arbitrarios a funciones usando parámetros.

En el siguiente ejemplo, la función tiene dos parámetros: from y text.

function showMessage(from: string, text: string) { // parameters: from, text
    console.log(`${from}: ${text} `)
}

showMessage('Ann', 'Hello!') // Ann: Hello! (*)
showMessage('Ann', "What's up?") // Ann: What's up? (**)

Cuando la función se llama (*) y (**), los valores dados se copian en las variables locales from y text.

Y la función las utiliza.

Aquí hay un ejemplo más: tenemos una variable from y la pasamos a la función. Tenga en cuenta: la función cambia from, pero el cambio no se ve afuera, porque una función siempre obtiene una copia del valor:

function showMessage(from, text) {

from = '' + from + ''; // hace que "from" se vea mejor

alert( from + ': ' + text ); }

let from = "Ann";

showMessage(from, "Hola"); // Ann: Hola

// el valor de "from" es el mismo, la función modificó una copia local alert( from ); // Ann

Cuando un valor es pasado como un parámetro de función, también se denomina argumento.

Para poner los términos claros:

Un parámetro es una variable listada dentro de los paréntesis en la declaración de función (es un término para el momento de la declaración) Un argumento es el valor que es pasado a la función cuando esta es llamada (es el término para el momento en que se llama).

Declaramos funciones listando sus parámetros, luego las llamamos pasándoles argumentos.

En el ejemplo de arriba, se puede decir: “la función showMessage es declarada con dos parámetros, y luego llamada con dos argumentos: from y "Hola"”.

TODO

Avançat

TODO Moure a objectes

En Javascript una función es un tipo de objeto y se puede utlizar como cualquier otro objeto.

Por ejemplo, puedes asignar una función a una variable o añadir una propiedad a la función:

const hello = function() {
    console.log("Hello ${this.name}!")
}

hello()
hello.name = "David"
hello()

Como las funciones son objetos, Javascript es un lenguaje que permite la programación funcional porque se pueden pasar funciones como argumentos de otras funciones:

const array = [1,2,3]

array.forEach(function(e) {
    console.log(e + 3)
}

async

TODO