La versión ES6 de TypeScript proporciona una función de flecha que es la taquigrafía sintaxis para definir la función anónima, es decir, para expresiones de función. Omite la palabra clave de función. Podemos llamarlo flecha gruesa (porque -> es una flecha delgada y => es un ' gordo ' flecha). También se le llama un función lambda . La función de flecha tiene un alcance léxico de ' este ' palabra clave.
La motivación para la función de flecha es:
- Cuando no necesitamos seguir escribiendo la función.
- Capta léxicamente el significado de esta palabra clave.
- Capta léxicamente el significado de los argumentos.
Sintaxis
Podemos dividir la sintaxis de una función de Flecha en tres partes:
(parameter1, parameter2, ..., parameterN) => expression;
Si utilizamos el flecha gorda (=>) notación, no es necesario utilizar la función palabra clave. Los parámetros se pasan entre corchetes () y la expresión de la función se incluye entre llaves {}.
Hay dos formas de escribir una función en el estilo de codificación ES5 y ES6.
// ES5: Without arrow function var getResult = function(username, points) { return username + ' scored ' + points + ' points!'; }; // ES6: With arrow function var getResult = (username: string, points: number): string => { return `${ username } scored ${ points } points!`; }
Función de flecha con parámetro
El siguiente programa es un ejemplo de función de flecha con parámetros.
let sum = (a: number, b: number): number => { return a + b; } console.log(sum(20, 30)); //returns 50
En el ejemplo anterior, el suma es una función de flecha, ' a: número, b: número ' es un tipo de parámetro, ' : número ' es el tipo de retorno, la notación de flecha => separa el parámetro de función y el cuerpo de la función.
Después de compilar el programa TypeScript anterior, el código JavaScript correspondiente es:
let sum = (a, b) => { return a + b; }; console.log(sum(20, 30)); //returns 50
Producción:
Función de flecha sin parámetro
El siguiente programa es un ejemplo de función de flecha sin parámetros.
let Print = () => console.log('Hello JavaTpoint!'); Print();
Producción:
En la función de flecha, si el cuerpo de la función consta de una sola declaración, entonces no hay necesidad de las llaves ni de la palabra clave return. Podemos entenderlo con el siguiente ejemplo.
let sum = (a: number, b: number) => a + b; console.log('SUM: ' +sum(5, 15));
Producción:
Función de flecha en una clase
Podemos incluir la función de flecha como propiedad en una clase. El siguiente ejemplo ayuda a entenderlo más claramente.
class Student { studCode: number; studName: string; constructor(code: number, name: string) { this.studName = name; this.studCode = code; } showDetail = () => console.log('Student Code: ' + this.studCode + ' Student Name: ' + this.studName) } let stud = new Student(101, 'Abhishek Mishra'); stud.showDetail();
Producción: