Vad betyder "=>" i TypeScript? (Fet pil)

Jag har precis börjat lära mig TypeScript, och jag såg att det finns mycket kod som använder denna syntax =>. Jag gjorde lite forskning genom att läsa Specifikationen för TypeScript Version 1.6 och lite googling. Jag kan fortfarande inte förstå betydelsen av =>.
För mig känns det som en pekare i C++. Men jag kan inte bekräfta det. Om någon kan förklara följande exempel, skulle det vara fantastiskt. Tack!

Nedan är några exempel som jag hittade när jag läste specifikationen för Typescript:

Objekttyper

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

Fråga: Vad gör den här koden? Skapar ett objekt som kallas MakePoint, där x- och y-fälten är av typen number? Är detta en konstruktor eller en funktion för MakePoint?

Funktionstyper

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

Fråga: Vad betyder => any? Måste du returnera en strängtyp?

Kan någon förklara för mig skillnaden eller syftet med dessa exempel på enkel engelska? Tack för din tid!

Svar #1

Kanske förväxlar du typinformation med en funktionsdeklaration. Om du kompilerar följande:

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

du kommer att se att det producerar:

var MakePoint;

I TypeScript är allt som kommer efter : men innan ett = (tilldelning) typinformationen. Så ditt exempel säger att typen av MakePoint är en funktion som tar 0 argument och returnerar ett objekt med två egenskaper, x och y, båda nummer. Det är inte att tilldela en funktion till den variabeln. Däremot, att kompilera:

var MakePoint = () => 1;

producerar:

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

Observera att i det här fallet kommer => feta pilen efter tilldelningsoperatorn.

Svar #2

I en typposition definierar => en funktionstyp där argumenten står till vänster om => och returtypen står till höger. Så callback: (result: string) => any betyder "callback är en parameter vars typ är en funktion. Den funktionen tar en parameter som heter result av typen string, och returvärdet av funktionen är av typen any".

För uttrycksnivå-konstruktionen, se Vad betyder "=>" (en pil som bildas av lika med och större än) i JavaScript?

Svar #3

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

MakePoint är en variabel. Dess typ är en funktion som inte tar några argument och producerar talen x och y. Nu, är pilen meningsfull?

Svar #4

Som en vis man en gång sa "Jag hatar JavaScript eftersom det tenderar att förlora meningen med allt detta alldeles för lätt".

Det kallas för fat arrow (eftersom -> är en tunn pil och => är en tjock pil) och kallas också för en lambda-funktion (på grund av andra språk). En annan ofta använd funktion är fat arrow-funktionen ()=>något. Motivationen för en fat arrow är:

  1. Du behöver inte fortsätta skriva function.
  2. Det fångar lexikalt betydelsen av this.
  3. Det fångar lexikalt betydelsen av 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

Om du kör den här koden i webbläsaren kommer detta inom funktionen att peka på fönstret eftersom fönstret är det som kommer att köra funktionen growOld. Lösningen är att använda en pilfunktion:

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

Relaterade artiklar