Función de flecha ES6

Una expresión o sintaxis de función de flecha es una versión simplificada y más compacta de una expresión o sintaxis de función regular o normal. y aunque es más fácil de implementar en comparación con las funciones normales, tiene algunas limitaciones y no se puede utilizar en todos los casos.

Sintaxis:

Para un solo argumento:

let function_name = argument1 => expression

Para múltiples argumentos:

let function_name = (argument1, argument2 , ...) => expression

Nota: en el caso de múltiples argumentos, debe incluir los argumentos entre corchetes.

Ejemplo 1: En este ejemplo, multiplicaremos dos números utilizando la sintaxis de función tradicional (o expresión), así como la sintaxis de función de flecha. En el siguiente código, creamos una función llamada multiplicar donde devolvemos el producto de dos números.

JavaScript

<script>
      
    //  Normal function for multiplication
    // of two numbers
    function multiply(a, b) {
        return a * b;
    }
    console.log(multiply(3, 5));
</script>

Producción:

15

Arrow function ES6

Usos de la función de flecha: La función de flecha es una sola línea que no necesitamos usar la palabra clave de retorno.

JavaScript

<script>
 
    // Arrow function for multiplying two numbers
    value = (a, b) => a * b;
    console.log(value(3, 5));
</script>

Producción:

15

Arrow function ES6

Ejemplo 2: Cuando hay más de dos líneas para procesar

Del ejemplo anterior, podemos ver que cuando hay una sola línea de código para ejecutar, no usamos la palabra clave de retorno, pero si hay más de dos líneas para procesar, necesitamos usar una palabra clave de retorno. demostremos eso con un ejemplo:

JavaScript

<script>
   number = (a, b) => {
      c = 5;
      return (a + b) * c;
   };
   console.log(number(2, 3));
</script>

Producción:

Arrow function ES6

Ejemplo 3: función de flecha sin parámetros. En el siguiente código, usamos una función de flecha sin ningún parámetro y devolvemos la palabra «geeksforgeeks», ya que es una declaración única que no necesitamos usar la palabra clave de retorno.

Sintaxis:

()=>{ expressions}

JavaScript

<script>
    // Arrow function with no parameters
    const string = () => "geeksforgeeks";
    console.log(string);
</script>

Producción:

Arrow function ES6

Ejemplo 4: Uso de la función de flecha dentro de otra función. En este ejemplo, busquemos la longitud de las strings en una array. usamos la función de flecha dentro de la función map() para realizar esta tarea. La función de flecha devuelve la longitud de cada string.

JavaScript

<script>
 
    // Initializing an array of strings
    let array = ["sam", "sarah", "john"];
    
    // Map function used to find the length of strings
    let lengths = array.map((string) => string.length);
 
    console.log(lengths); // [3,5,4]
</script>

Producción:

Arrow function ES6

Diferencias y restricciones de las funciones de flecha de las funciones normales:

  • No debe usarse como método porque carece de sus propios enlaces a this o super.
  • Dentro de su cuerpo, no puede usar yield.
  • No se usa mientras las declaraciones de retorno están presentes.
  • palabra clave a la que apuntar (es decir, let, var, const)
  • No es adecuado para métodos como call, apply y bind, que requieren establecer un alcance.
  • No podemos usar una nueva palabra clave para crear un nuevo objeto.
  • No pueden ser utilizados como constructores.
  • no tiene argumentos objeto y propiedad prototipo.

Publicación traducida automáticamente

Artículo escrito por isitapol2002 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

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