genericas - lista de objetos typescript

¿Cuál es el significado de "=>" en TypeScript?(Flecha gorda)

Question

Acabo de empezar a aprender TypeScript, y vi que hay mucho código usando esta sintaxis => . Investigué un poco leyendo la Especificación de TypeScript Versión 1.6 y buscando en Google. Todavía no puedo entender el significado de => .
Para mí, se siente como un puntero en C ++. Pero no puedo confirmarlo. Si alguien puede explicar los siguientes ejemplos, será genial. ¡Gracias!

Estos son los ejemplos que encontré cuando estaba leyendo la especificación de Typecript:

Tipos de objeto

var MakePoint: () => {
x: number; y: number;
};

Pregunta: ¿Qué está haciendo este código? ¿Crear un objeto llamado MakePoint , donde los campos xey son de tipo numérico ? ¿Es este un constructor o una función para MakePoint ?

Tipos de funciones

function vote(candidate: string, callback: (result: string) => any) {
// ...
}

Pregunta: ¿Cuál es el significado de => any ? ¿Tienes que devolver un tipo de cadena?

¿Alguien puede explicarme la diferencia o el propósito de estos ejemplos en inglés simple? ¡Gracias por tu tiempo!

Answer 1

Como un hombre sabio dijo una vez: "Odio JavaScript, ya que tiende a perder el significado de esto con demasiada facilidad".

Se llama flecha gorda (porque -> es una flecha delgada y => es una flecha gorda) y también se llama función lambda (debido a otros idiomas). Otra característica comúnmente utilizada es la función de flecha gorda ()=>something . La motivación para una flecha gorda es:

1. No necesita seguir escribiendo la function .
2. Captura léxicamente el significado de this .
3. Captura léxicamente el significado de los arguments

function Person(age) {
this.age = age;
this.growOld = function() {
this.age++;
}
}
var person = new Person(1);
setTimeout(person.growOld,1000);
setTimeout(function() { console.log(person.age); },2000); // 1, should have been 2

Si ejecuta este código en el navegador, esto dentro de la función apuntará a la ventana porque la ventana será lo que ejecutará la función growOld. La solución es usar una función de flecha:

function Person(age) {
this.age = age;
this.growOld = () => {
this.age++;
}
}
var person = new Person(1);
setTimeout(person.growOld,1000);
setTimeout(function() { console.log(person.age); },2000);// 2

Answer 2

Directamente desde el enlace en OP:

En este ejemplo, el segundo parámetro para ''votar'' tiene el tipo de función

(resultado: cadena) => cualquiera, lo que significa que el segundo parámetro es una función que devuelve el tipo ''cualquiera'' que tiene un único parámetro de tipo ''cadena'' llamado ''resultado''.

Answer 3

En una posición de tipo, => define un tipo de función donde los argumentos están a la izquierda de => y el tipo de retorno está a la derecha. Entonces callback: (result: string) => any significa " callback es un parámetro cuyo tipo es una función. Esa función toma un parámetro llamado result del tipo string , y el valor de retorno de la función es del tipo any ".

Para la construcción de nivel de expresión, vea ¿Cuál es el significado de "=>" (una flecha formada a partir de igual y mayor que) en JavaScript?

Answer 4

Es una función de flecha, también conocida como función de flecha gorda.

Leer más: ingrese la descripción del enlace aquí

Answer 5

Quizás esté confundiendo información de tipo con una declaración de función. Si compila lo siguiente :

var MakePoint: () => {x: number; y: number;};

verá que produce:

var MakePoint;

En TypeScript, todo lo que viene después de : pero antes de un = (asignación) es la información de tipo. Entonces, su ejemplo dice que el tipo de MakePoint es una función que toma 0 argumentos y devuelve un objeto con dos propiedades, x e y , ambos números. No está asignando una función a esa variable. En contraste, compilando:

var MakePoint = () => 1;

produce:

var MakePoint = function () { return 1; };

Tenga en cuenta que en este caso, la flecha gorda => viene después del operador de asignación.

Answer 6

Se llama una "flecha gorda". Fue agregado en EcmaScript6 y reemplaza la palabra clave de función entre otras cosas.

Más se puede leer here .

Answer 7

Simplemente se ha utilizado en lugar de funciones anónimas.

El siguiente código

function(argument){
return argument. Length
}

se transformará en argument => {argument.length};

Para una mejor comprensión, consulte lo siguiente: https://codecraft.tv/courses/angular/es6-typescript/arrow/

Answer 8

var MakePoint: () => {
x: number; y: number;
};

MakePoint es una variable. Su tipo es una función que no toma argumentos y produce números x e y. ¿Ahora tiene sentido la flecha?