Blog de programación, errores, soluciones

javascript / functions – Funciones en Javascript

Una función es un subprograma o rutina el cual cumple con una tarea en especifico capaz de ser llamada y también reutilzada. En javascript las funciones son objetos y pueden ser tratadas como tal, es decir objeto function.

En este post veremos desde cómo declarar  la función con nombre hasta como crear funciones de distinto tipo como pueden ser funciones con múltiples argumentos,funciones de expresión y funciones IIFE.

Función básica en javascript

Para declarar una función tenemos que hacer uso de la palabra clave function veamos un ejemplo:

function a(){
   alert("estoy dentro de a");
   return "devuelvo este texto que esta dentro de a";
}

La palabra clave return la usamos para que la función nos devuelva algo en este caso devolverá el string «devuelvo este texto que esta dentro de a»

Tome en cuenta que la función en si son estas líneas:

function a(){

}

Lo demás son sentencias que se encuentran dentro de esta función, en consecuencia podemos decir que una función es un conjunto de sentencias que juntas realizan una tarea.

Para llamar a la función la llamaremos de la siguiente manera a(), haremos un pequeño ejemplo:

<html>
   <head>
      <title> funciones en javascript </title>
   <head>
   <body>
   <button onclick="b()">click me</button>
   <script type="text/javascript">
      function a(){
         return "devuelvo este texto que está dentro de a";
      }
      function b(){
         alert(a());
      }
   </script>
   </body>
</html>

Ejemplo aqui.

Creando una función con múltiples argumentos.

Para crear una función a la cual le pasamos múltiples argumentos en esta tenemos que usar arguments.length por ejemplo si queremos sumar todos los argumentos.

function Suma(arguments[]) {
      var temporalVar = 0;
      for (var i = 1; i < arguments.length; i++) {
         temporalVar+= arguments[i];
      }
      return temporalVar;
}

Funciones anónimas y funciones expresión .

Si una función es colocada donde se espera una expresión esta es tratada como una expresión. Por lo que los valores que están antes de la función pueden tener incidencia en el valor que nos dará la función.

Funciones anónimas

Las funciones anónimas no tienen un nombre con las cuales llamarlas por lo general se las guarda en una variable.

Puede correr el siguiente ejemplo aquí. En este ejemplo le pasamos los valores 1 y2 atravez de los parametros b y c.

<script type ="text/javascript">
      var suma;
      // esta es  una función de expresión y anónima(en a se espera una expresión la cual nos dará un valor)
      var a = function(b,c){
         return( b + c );
      }
      suma = a(1,2);//nos devolvera 3
      alert(suma);
</script">

funciones expresión

Intentemos algo diferente esta vez no vamos a pasarle los valores por parametros para demostrar que la funcion es tratada como una expresión.

<script type ="text/javascript">
      var b = 4;
      var c = 4;
      var sum;
      var a = function(){
         return( b + c );
      }
      sum = a();//nos devolvera 8?
      alert(suma);
</script">

Puede probar el ejemplo aquí.

Funciones IIFE(inmediate invoke function expresion).

Esta es la última que veremos el post funciones en javascript, tiene la particularidad de que se ejecuta inmediatamente llegado a esa sentencia y se define de la siguiente manera.

<script type ="text/javascript">
      var stringA = "luis";
      /*
      esta es  una función de expresión y anónima
      (en a se espera una expresión la cual nos dará un valor)
      */
      var a = (function(){
         alert("hola" + stringA );
      }());
</script">

Vea cómo funciona aquí.

Cómo puede ver en este código hemos marcado de 2 colores diferentes a los paréntesis () que intervienen en la función, primero en verde están los paréntesis que se aseguran que esta función se utilizará como una expresión y en segundo lugar azul los que se aseguran que la función sea ejecutada inmediatamente.

Ayudame: Por favor deja un comentario antes de irte, tu opinión es bienvenida. Si te gusta el contenido comparte.

Deja una respuesta

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

Last 4 post in same category