it-swarm.com.de

Holen und setzen Sie in TypeScript

Ich versuche, eine Methode zum Abrufen und Festlegen einer Eigenschaft zu erstellen:

private _name: string;

Name() {
    get:
    {
        return this._name;
    }
    set:
    {
        this._name = ???;
    }
}

Wie lautet das Schlüsselwort zum Festlegen eines Werts?

521
MuriloKunze

TypeScript verwendet eine Get-/Setter-Syntax wie ActionScript3.

class foo {
    private _bar: boolean = false;
    get bar(): boolean {
        return this._bar;
    }
    set bar(value: boolean) {
        this._bar = value;
    }
}

Dadurch wird Javascript mit der Funktion Ecmascript 5 Object.defineProperty () erzeugt.

var foo = (function () {
    function foo() {
        this._bar = false;
    }
    Object.defineProperty(foo.prototype, "bar", {
        get: function () {
            return this._bar;
        },
        set: function (value) {
            this._bar = value;
        },
        enumerable: true,
        configurable: true
    });
    return foo;
})();

Also, um es zu benutzen,

var myFoo = new foo();
if(myFoo.bar) {         // calls the getter
    myFoo.bar = false;  // calls the setter and passes false
}

Um es überhaupt zu verwenden, müssen Sie jedoch sicherstellen, dass der TypeScript-Compiler auf ECMAScript5 abzielt. Wenn Sie den Befehlszeilen-Compiler ausführen, verwenden Sie das folgende Flag --target.

tsc - Ziel ES5

Wenn Sie Visual Studio verwenden, müssen Sie Ihre Projektdatei bearbeiten, um der Konfiguration für das TypeScriptCompile-Build-Tool das Flag hinzuzufügen. Sie können das sehen hier :

Wie @DanFromGermany unten vorschlägt, ist ein Setter- und Getter-Paar zu viel des Guten, wenn Sie lediglich eine lokale Eigenschaft wie foo.bar = true lesen und schreiben. Sie können sie später jederzeit hinzufügen, wenn Sie etwas tun müssen, z. B. Protokollieren, wann immer die Eigenschaft gelesen oder geschrieben wird.

875
Ezward

Ezward hat bereits eine gute Antwort geliefert, aber mir ist aufgefallen, dass in einem der Kommentare gefragt wird, wie es verwendet wird. Für Leute wie mich, die über diese Frage stolpern, hielt ich es für nützlich, einen Link zur offiziellen Dokumentation über Getter und Setter auf der TypeScript-Website zu haben, da dies gut erklärt und hoffentlich immer auf dem neuesten Stand bleibt, wenn Änderungen vorgenommen werden gemacht, und zeigt Beispielnutzung:

http://www.typescriptlang.org/docs/handbook/classes.html

Beachten Sie insbesondere für diejenigen, die nicht damit vertraut sind, dass Sie das Wort 'get' nicht in einen Aufruf an einen Getter (und ähnlich für Setter) einbauen:

var myBar = myFoo.getBar(); // wrong    
var myBar = myFoo.get('bar');  // wrong

Sie sollten dies einfach tun:

var myBar = myFoo.bar;  // correct (get)
myFoo.bar = true;  // correct (set) (false is correct too obviously!)

eine Klasse gegeben wie:

class foo {
  private _bar:boolean = false;

  get bar():boolean {
    return this._bar;
  }
  set bar(theBar:boolean) {
    this._bar = theBar;
  }
}

dann wird der 'bar'-Getter für die private' _bar'-Eigenschaft aufgerufen.

89
TornadoAli

Hier ist ein funktionierendes Beispiel, das Sie in die richtige Richtung weisen soll:

class Foo {
    _name;

    get Name() {
        return this._name;
    }

    set Name(val) {
        this._name = val;
    }
}

Getter und Setter in JavaScript sind nur normale Funktionen. Der Setter ist eine Funktion, die einen Parameter übernimmt, dessen Wert der eingestellte Wert ist.

50
Brian Terlson

Sie können dies schreiben

class Human {
    private firstName : string;
    private lastName : string;

    constructor (
        public FirstName?:string, 
        public LastName?:string) {

    }

    get FirstName() : string {
        console.log("Get FirstName : ", this.firstName);
        return this.firstName;
    }
    set FirstName(value : string) {
        console.log("Set FirstName : ", value);
        this.firstName = value;
    } 

    get LastName() : string {
        console.log("Get LastName : ", this.lastName);
        return this.lastName;
    }
    set LastName(value : string) {
        console.log("Set LastName : ", value);
        this.lastName = value;
    } 

}
4
k33g_org

Es ist sehr ähnlich zum Erstellen von allgemeinen Methoden. Setzen Sie einfach das Schlüsselwort reserved get oder set an den Anfang.

class Name{
    private _name: string;

    getMethod(): string{
        return this._name;
    }

    setMethod(value: string){
        this._name = value
    }

    get getMethod1(): string{
        return this._name;
    }

    set setMethod1(value: string){
        this._name = value
    }
}

class HelloWorld {

    public static main(){

        let test = new Name();

        test.setMethod('test.getMethod() --- need ()');
            console.log(test.getMethod());

        test.setMethod1 = 'test.getMethod1 --- no need (), and used = for set ';
            console.log(test.getMethod1);
    }
}
HelloWorld.main();

In diesem Fall können Sie den Rückgabetyp in get getMethod1() { überspringen.

    get getMethod1() {
        return this._name;
    }
2
Angel Angel

TS bietet Get- und Setter-Funktionen, mit denen Objekteigenschaften besser steuern können, wie auf sie zugegriffen wird (Getter) oder wie sie aktualisiert werden (Setter) außerhalb des Objekts. Anstatt direkt auf die Eigenschaft zuzugreifen oder sie zu aktualisieren, wird eine Proxy-Funktion aufgerufen.

Beispiel:

class Person {
    constructor(name: string) {
        this._name = name;
    }

    private _name: string;

    get name() {
        return this._name;
    }

    // first checks the length of the name and then updates the name.
    set name(name: string) {
        if (name.length > 10) {
            throw new Error("Name has a max length of 10");
        }

        this._name = name;  
    }

    doStuff () {
        this._name = 'foofooooooofoooo';
    }


}

const person = new Person('Willem');

// doesn't throw error, setter function not called within the object method when this._name is changed
person.doStuff();  

// throws error because setter is called and name is longer than 10 characters
person.name = 'barbarbarbarbarbar';  
0

Ich denke, ich verstehe wahrscheinlich, warum es so verwirrend ist. In Ihrem Beispiel wollten wir Getter und Setter für _name. Dies erreichen wir jedoch, indem wir Getter und Setter für eine nicht verwandte Klassenvariable Name erstellen.

Bedenken Sie:

class Car{
    private tiresCount = 4;
    get yourCarTiresCount(){
        return this.tiresCount ;
    }
    set yourCarTiresCount(count) {
        alert('You shouldn't change car tire count')
    }
}

Der obige Code bewirkt Folgendes:

  1. get und set erzeugen Getter und Setter für yourCarTiresCount (nicht für tiresCount).

Der Getter ist:

function() {
    return this.tiresCount ;
}

und der Setter ist:

function(count) {
    alert('You shouldn't change car tire count');
}

Das heißt, jedes Mal, wenn wir new Car().yourCarTiresCount ausführen, wird der Getter ausgeführt. Und für jeden new Car().yourCarTiresCount('7') -Setter läuft.

  1. Indirekt Erzeuge Getter, aber nicht den Setter für private tireCount.
0
dasfdsa