Scope: So greifen Sie auf globale Variablen in Typoskript auf

Question

Ich entwickle einen Algorithmus in Typoskript/ionic 2, der eine Funktionshierarchie (Funktionen innerhalb von Funktionen) erfordert. Ich bin 99% sicher, dass es keine Möglichkeit gibt, geschachtelte Funktionen wegen der Google API zu vermeiden (lange Erklärung erforderlich, vertraue mir darauf)

Ich werde eine einfache Demo verwenden, die mein Problem zu vermeiden, 300 Zeilen zu buchen von Code.

Das Problem beinhaltet den Zugriff auf und die Manipulation globaler Variablen innerhalb der verschachtelten Funktionen. Ich brauche eine Möglichkeit, das this.secondvar in der secondSet-Funktion zu setzen. Gibt es Möglichkeiten, dies zu erreichen?

export class HomePage { 

    public firstVar = []; 
    public secondvar; 
    constructor(public navCtrl: NavController) { 

    } 

    ionViewDidLoad(){ 
    this.setVar(); 
    } 

    setVar(){ 
    this.firstVar.push("hello", "goodbye"); 
    console.log(); 
    getVar(); 

    function getVar(){ 
     //console.log(this.lol); unable to access 
     secondSet(); 

     function secondSet(){ 
     console.log("test") 
     //this.secondVar = "hello" //how do i set this ? 
     } 
    } 
    } 
} 

Answer 1

Verwenden Sie Arrow functions, die den Umfang der Klasse verwendet. Es wird keinen eigenen this Wert haben.

setVar(){ 
this.firstVar.push("hello", "goodbye"); 
console.log(); 

let getVar=()=>{ 
    //console.log(this.lol); unable to access 

    let secondSet=()=>{ 
    console.log("test") 
    //this.secondVar = "hello" //how do i set this ? 
    } 
     secondSet(); 

} 
    getVar(); 
} 

was ist die Begründung für die Positionierung der Funktionsaufrufe? Warum werden sie nach der Erklärung der Funktion aufgerufen?

Es ist wegen der Verwendung von let. let variable Deklaration ist block scoped. Nach der Dokumentation:

Eigenschaft von Block-scoped Variablen ist, dass sie nicht oder geschrieben gelesen werden können, bevor sie tatsächlich deklariert sind. Während diese Variablen in ihrem Gültigkeitsbereich "präsent" sind, sind alle Punkte bis zu ihrer Deklaration Teil ihrer temporalen Totzone.

So:

 secondSet();//throws error 

    let secondSet=()=>{ 
    console.log("test") 
    //this.secondVar = "hello" //how do i set this ? 
    } 

Answer 2

Verwenden Sie Kontextvariable. Weisen Sie einer lokalen Variablen den Wert "this" zu, sagen Sie "context". Verwenden Sie "Kontext" Variable als "das".

export class HomePage { 

    public firstVar = []; 
    public secondvar; 
    constructor(public navCtrl: NavController) { 

    } 

    ionViewDidLoad(){ 
    this.setVar(); 
    } 

    setVar(){ 
    var context = this; 
    this.firstVar.push("hello", "goodbye"); 
    console.log(); 
    getVar(); 

    function getVar(){ 
     //console.log(this.lol); unable to access 
     secondSet(); 

     function secondSet(){ 
     console.log("test") 
     context.secondVar = "hello" // This is how you access the secondVar 
     } 
    } 
    } 
} 

Answer 3

Sie können Ihre inneren Funktionen definieren Pfeil Funktionen (lambdas) sein, die den Kontext von ‚this‘ wird erhalten. So etwas wie folgt aus:

var secondSet =() => { this.secondVar = 'whatever' }; 

Wenn Sie bei der kompilierten Javascript schauen, wird es automatisch den Wert von ‚this‘ spart auf eine Variable und verwendet diese in der Lambda.