Functions

publicado en: Articles | 0

muy a menudo necesitamos realizar una acción similar en muchos lugares del script.

por ejemplo, necesitamos mostrar un mensaje atractivo cuando un visitante inicia sesión, cierra sesión y tal vez en otro lugar.

Las funciones son los principales «bloques de construcción» del programa. Permiten que el código sea llamado 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 función

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

Se parece a esto:

function showMessage() { alert( 'Hello everyone!' );}

El function palabra clave va primero, luego va el nombre de la función, a continuación, una lista de parámetros entre paréntesis (separados por comas, vacío en el ejemplo de arriba) y finalmente el código de la función, también denominada «el cuerpo de la función», entre llaves.,

function name(parameters) { ...body...}

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

Por ejemplo:

function showMessage() { alert( '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 principales propósitos de las funciones: evitar la duplicación de código.,

si alguna vez necesitamos cambiar el mensaje o la forma en que se muestra, basta con modificar el código en un solo lugar: la función que lo emite.

variables locales

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

Por ejemplo:

variables Externas

Una función puede acceder a una variable externa como, por ejemplo:

let userName = 'John';function showMessage() { let message = 'Hello, ' + userName; alert(message);}showMessage(); // Hello, John

La función tiene acceso completo a la variable externa. También puede modificarlo.,

por ejemplo:

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, entonces sombrea la externa. Por ejemplo, en el código de abajo la función utiliza el local userName. La externa se ignora:

variables globales

las Variables declaradas fuera de cualquier función, como la externa userName en el código anterior, se llaman globales.

las variables globales son visibles desde cualquier función (a menos que sean sombreadas por locales).,

es una buena práctica minimizar el uso de variables globales. El código moderno tiene pocos o ningún global. La mayoría de las variables residen en sus funciones. A veces, sin embargo, pueden ser útiles para almacenar datos a nivel de proyecto.

parámetros

podemos pasar datos arbitrarios a funciones usando parámetros (también llamados argumentos de función).

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

Cuando se llama a la función en las líneas de (*) y (**), los valores dados se copian a las variables locales from y text. Entonces la función los usa.

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 fuera, porque una función siempre obtiene una copia del valor:

valores predeterminados

Si no se proporciona un parámetro, su valor se convierte en undefined.

Por ejemplo, la mencionada función showMessage(from, text) puede ser llamada con un solo argumento:

showMessage("Ann");

Eso no es un error. Dicha llamada generaría "*Ann*: undefined"., No hay text, por lo que se asume que el text === undefined.,

Si queremos usar un «defecto» text en este caso, podemos especificar que después de =:

function showMessage(from, text = "no text given") { alert( from + ": " + text );}showMessage("Ann"); // Ann: no text given

Ahora, si el text parámetro no es pasado, se obtendrá el valor de "no text given"

Aquí "no text given" es una cadena, pero puede ser una expresión más compleja, que sólo es evaluado y asignado si el parámetro no está presente., Por lo tanto, esto también es posible:

evaluación de parámetros predeterminados

en JavaScript, se evalúa un parámetro predeterminado cada vez que se llama a la función sin el parámetro respectivo.

En el ejemplo anterior, anotherFunction() se llama cada vez showMessage() se llama sin el text parámetro.

parámetros predeterminados alternativos

a veces tiene sentido establecer valores predeterminados para parámetros no en la declaración de la función, sino en una etapa posterior, durante su ejecución.,parámetro, se puede comparar es con la etiqueta undefined:

function showMessage(text) { if (text === undefined) { text = 'empty message'; } alert(text);}showMessage(); // empty message

…O podríamos utilizar la etiqueta || operador:

// if text parameter is omitted or "" is passed, set it to 'empty'function showMessage(text) { text = text || 'empty'; ...}

los Modernos motores JavaScript de apoyo a la nullish coalescente operador ??, es mejor cuando falsy valores, tales como 0, se considera que son regulares:

la Devolución de un valor de

Una función puede devolver un valor en el código de llamada como el resultado.,

El ejemplo más sencillo sería una función que suma dos valores:

function sum(a, b) { return a + b;}let result = sum(1, 2);alert( result ); // 3

La directiva return puede ser en cualquier lugar de la función. Cuando la ejecución llega a ella, la función se detiene, y el valor se devuelve al código de llamada (asignado a result arriba).

Puede haber muchas ocurrencias de return en una sola función. Por ejemplo:

es posible usar return sin valor., That causes the function to exit immediately.

For example:

function showMovie(age) { if ( !checkAge(age) ) { return; } alert( "Showing you the movie" ); // (*) // ...}

In the code above, if checkAge(age) returns false, then showMovie won’t proceed to the alert.,

Nunca agregar un salto de línea entre return y el valor

Durante un largo expresión en el return, puede ser tentador para ponerlo en una línea separada, como este:

return (some + long + expression + or + whatever * f(a) + f(b))

Eso no funciona, debido a que JavaScript se supone un punto y coma después de return. Que va a trabajar de la misma como:

return; (some + long + expression + or + whatever * f(a) + f(b))

Así, se convierte de hecho en un vacío de retorno.,

si queremos que la expresión devuelta se ajuste a través de varias líneas, debemos iniciarla en la misma línea que return. O al menos poner los paréntesis de apertura allí de la siguiente manera:

return ( some + long + expression + or + whatever * f(a) + f(b) )

Y que el trabajo sólo como sería de esperar.

nombrar una función

Las funciones son acciones. Así que su nombre suele ser un verbo. Debe ser breve, lo más preciso posible y describir lo que hace la función, para que alguien que lea el código obtenga una indicación de lo que hace la función.,

es una práctica generalizada iniciar una función con un prefijo verbal que describe vagamente la acción. Debe haber un acuerdo dentro del equipo sobre el significado de los prefijos.

por ejemplo, las funciones que comienzan con "show" generalmente muestran algo.

función que comienza con

ejemplos de tales nombres:

con los prefijos en su lugar, un vistazo al nombre de una función da una comprensión de qué tipo de trabajo hace y qué tipo de valor devuelve.,

Una función de una acción

Una función debe hacer exactamente lo que se sugiere su nombre, no más.

dos acciones independientes generalmente merecen dos funciones, incluso si se llaman juntas (en ese caso podemos hacer una 3ra función que llame a esas dos).

Un par de ejemplos de romper esta regla:

  • getAge – sería malo si muestra un alert con la edad (sólo debe tener).,
  • createForm – sería malo si modifica el documento, agregándole un formulario (solo debería crearlo y devolver).
  • checkPermission – sería malo si muestra el mensaje access granted/denied (solo debe realizar la comprobación y devolver el resultado).

estos ejemplos asumen significados comunes de prefijos. Usted y su equipo son libres de ponerse de acuerdo sobre otros significados, pero por lo general no son muy diferentes. En cualquier caso, debe tener una comprensión firme de lo que significa un prefijo, lo que una función prefijada puede y no puede hacer., Todas las funciones con el mismo prefijo deben obedecer las reglas. Y el equipo debe compartir el conocimiento.

nombres de función ultracortos

Las funciones que se utilizan muy a menudo a veces tienen nombres ultracortos.

por ejemplo, el framework jQuery define una función con $. La biblioteca Lodash tiene su función principal llamada _.

estas son excepciones. Generalmente los nombres de las funciones deben ser concisos y descriptivos.

Funciones == Comentarios

Funciones deben ser cortas y hacen exactamente una cosa., Si esa cosa es grande, tal vez vale la pena dividir la función en algunas funciones más pequeñas. A veces, seguir esta regla puede no ser tan fácil, pero definitivamente es algo bueno.

Una función separada no solo es más fácil de probar y depurar, ¡su propia existencia es un gran comentario!

por ejemplo, compare las dos funciones showPrimes(n) a continuación. Cada uno genera números primos de hasta n.,

La primera variante se utiliza una etiqueta:

function showPrimes(n) { nextPrime: for (let i = 2; i < n; i++) { for (let j = 2; j < i; j++) { if (i % j == 0) continue nextPrime; } alert( i ); // a prime }}

La segunda variante se utiliza una función adicional isPrime(n) para la prueba de primalidad:

La segunda variante es más fácil de entender, ¿no? En lugar de la pieza de código vemos un nombre de la acción (isPrime). A veces la gente se refiere a ese código como autodescripción.

por lo tanto, las funciones se pueden crear incluso si no tenemos la intención de reutilizarlas. Estructuran el código y lo hacen legible.,

Resumen

Una declaración de la función se parece a esto:

function name(parameters, delimited, by, comma) { /* code */}

  • los Valores que se pasan a una función como parámetros se copian a sus variables locales.
  • Una función puede acceder a variables externas. Pero solo funciona de adentro hacia afuera. El código fuera de la función no ve sus variables locales.
  • una función puede devolver Un valor. Si no lo hace, entonces su resultado es undefined.,

para que el código sea limpio y fácil de entender, se recomienda usar principalmente variables y parámetros locales en la función, no variables externas.

siempre es más fácil entender una función que obtiene parámetros, trabaja con ellos y devuelve un resultado que una función que no obtiene parámetros, pero modifica variables externas como un efecto secundario.

nombre de la función:

  • un nombre debe describir claramente lo que hace la función. Cuando vemos una llamada a una función en el código, un buen nombre instantáneamente nos da una comprensión de lo que hace y devuelve.,
  • Una función es una acción, por lo que los nombres de las funciones suelen ser verbales.
  • existen muchos conocidos función de prefijos como create…, show…, get…, check… y así sucesivamente. Úsalos para indicar lo que hace una función.

Las funciones son los principales bloques de construcción de scripts. Ahora hemos cubierto los conceptos básicos, por lo que realmente podemos comenzar a crearlos y usarlos. Pero eso es solo el comienzo del camino. Vamos a volver a ellos muchas veces, profundizando más en sus características avanzadas.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *