Breaking News

Home / JavaScript Basico / JavaScript - Funciones

JavaScript - Funciones

July 05, 2018

JavaScript - Funciones


Una función es un grupo de código reutilizable que se puede llamar en cualquier lugar de su programa. Esto elimina la necesidad de escribir el mismo código una y otra vez. Ayuda a los programadores a escribir códigos modulares. Las funciones le permiten a un programador dividir un gran programa en una cantidad de funciones pequeñas y manejables.
Al igual que cualquier otro lenguaje de programación avanzado, JavaScript también es compatible con todas las características necesarias para escribir códigos modulares utilizando funciones. Debe haber visto funciones como alerta() y escritura() en los capítulos anteriores. Estábamos usando estas funciones una y otra vez, pero habían sido escritas en JavaScript central solo una vez.
JavaScript nos permite escribir nuestras propias funciones también. Esta sección explica cómo escribir sus propias funciones en JavaScript.

Definición de función

Antes de usar una función, necesitamos definirla. La forma más común de definir una función en JavaScript es usar la palabra clave función , seguida de un nombre de función único, una lista de parámetros (que pueden estar vacíos) y un bloque de instrucciones rodeado de llaves..

Sintaxis

La sintaxis básica se muestra aquí.
<script type="text/javascript">
   <!--
      function functionname(parameter-list)
      {
         statements
      }
   //-->
</script>

Ejemplo

Prueba el siguiente ejemplo. Define una función llamada sayHello que no toma parámetros -
<script type="text/javascript">
   <!--
      function sayHello()
      {
         alert("Hello there");
      }
   //-->
</script>

Llamar a una función

Para invocar una función más adelante en el script, simplemente necesitaría escribir el nombre de esa función como se muestra en el siguiente código.

<html>
   <head>
   
      <script type="text/javascript">
         function sayHello()
         {
            document.write ("Hello there!");
         }
      </script>
      
   </head>
   <body>
      <p>Click the following button to call the function</p>
      
      <form>
         <input type="button" onclick="sayHello()" value="Say Hello">
      </form>
      
      <p>Use different text in write method and then try...</p>
   </body>
</html>

Salida


Parámetros de función

Hasta ahora, hemos visto funciones sin parámetros. Pero hay una facilidad para pasar diferentes parámetros al llamar a una función. Estos parámetros pasados se pueden capturar dentro de la función y cualquier manipulación puede realizarse sobre esos parámetros. Una función puede tomar múltiples parámetros separados por coma.

Ejemplo

Prueba el siguiente ejemplo. Hemos modificado nuestra función sayHello aquí. Ahora toma dos parámetros.
<html>
   <head>
   
      <script type="text/javascript">
         function sayHello(name, age)
         {
            document.write (name + " is " + age + " years old.");
         }
      </script>
      
   </head>
   <body>
      <p>Click the following button to call the function</p>
      
      <form>
         <input type="button" onclick="sayHello('Zara', 7)" value="Say Hello">
      </form>
      
      <p>Use different parameters inside the function and then try...</p>
   </body>
</html>

Salida


La declaración de devolución

Una función de JavaScript puede tener una declaración return opcional. Esto es obligatorio si desea devolver un valor de una función. Esta declaración debería ser la última declaración en una función.
Por ejemplo, puede pasar dos números en una función y luego puede esperar que la función devuelva su multiplicación en su programa de llamada.

Ejemplo

Prueba el siguiente ejemplo. Define una función que toma dos parámetros y los concatena antes de devolver la resultante en el programa de llamada.

<html>
   <head>
      
      <script type="text/javascript">
         function concatenate(first, last)
         {
            var full;
            full = first + last;
            return full;
         }
         
         function secondFunction()
         {
            var result;
            result = concatenate('Zara', 'Ali');
            document.write (result );
         }
      </script>
      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>
      
      <form>
         <input type="button" onclick="secondFunction()" value="Call Function">
      </form>
      
      <p>Use different parameters inside the function and then try...</p>
  
  </body>
</html>

Salida


Hay mucho que aprender sobre las funciones de JavaScript, sin embargo, hemos cubierto los conceptos más importantes en este tutorial.

No comments

Subscribe to: Post Comments ( Atom )