was bedeutet das? setTimeOut (() => this.active = true, 0)

Question

Ich übe angularjs2 und ich bemerke diesen Satz, kann aber nicht verstehen, was das bedeutet.

@Component({ 
    selector: 'hero-form', 
    templateUrl: 'app/hero-form.component.html' 
}) 

export class HeroFormComponent { 

    model = new Hero(18, 'Dr IQ', this.powers[0], 'Chuck Overstreet'); 

    active = true; 

    newHero() { 
     this.model = new Hero(42, '', ''); 
     this.active = false; 
     setTimeOut(()=> this.active=true, 0)* 
    } 

} 

ich in JavaScript weiß, es ist ein Funktionsname setTimeOut aber die () nicht verstehen kann und Pfeil => ...

Vielen Dank im Voraus!

Answer 1

Dies ist die neue JavaScript arrow function Notation. Die Linie, die Sie zitiert ist fast gleichbedeutend mit diesem Stück Code in der traditionellen Funktion Notation:

setTimeout(function() { 
    this.active = true; 
}, 0); 

jedoch in der traditionellen Notation wird this auf das globale Objekt (außerhalb der strengen Modus gebunden werden - im Strict-Modus, Sie wird eine ReferenceError erhalten, aufgrund der wie diese in Ausführungskontexten funktioniert. Die traditionelle Problemumgehung vor der Einführung der Pfeil Funktionen wäre:

var self = this; 
setTimeout(function() { 
    self.active = true; 
}, 0) 

Pfeil Funktionen lösen dieses Problem durch lexikalisch this Bindung, ebenso wie jede andere Variable, anstatt ihre eigenen definieren. Neben der Behandlung von this definieren Pfeilfunktionen implizit auch nicht ihre eigenen Variablen arguments oder super, sondern binden sie lexikalisch.

---

Graben tiefer, was macht newHero() tun? Es ist eine Konstruktorfunktion. Wenn Sie es aufrufen, wird ein neues Objekt zugeordnet, auf das innerhalb des Funktionskörpers durch die Variable this verwiesen werden kann. Der Konstruktor legt zwei Eigenschaften für das Objekt this fest; Diese Eigenschaften sind .model und .active, wobei spezifische Werte angegeben werden.

Der Ausdruck (() => this.active = true) erstellt ein Funktionsobjekt. Es beschreibt, was zu einem späteren Zeitpunkt ausgeführt werden sollte. Wenn das Funktionsobjekt aufgerufen wird, wird der Körper ausgeführt. Die Codezeile erstellt also das Funktionsobjekt und gibt es an setTimeout(), das das Funktionsobjekt nach der angegebenen Zeit - in diesem Fall 0 Millisekunden - aufrufen wird.