modern angular 03_es7_decoratoren
TRANSCRIPT
1
ES7-Dekoratoren
Manfred Steyer
ManfredSteyer
Beispiel
Page 2
@DocuWithLabel("Repräsentiert ein Hotel")
class Hotel {
constructor(@Docu name: string) {
this.name = name;
}
@Docu
name: string;
@Docu
info(): string {
return this.name + " "+ this.ranking + " " + this.price;
}
}
2
Was kann dekoriert werden?
Klassen
Member
Argumente (vorerst nur TypeScript)
Page 3
Dekoratoren sind Funktionen
Page 4
@Docu
class Hotel { […] }
class Hotel { […] }
Hotel = Docu(Hotel) || Hotel;
3
Dekoratoren sind Funktionen
Page 5
@DocuWithLabel("Repräsentiert ein Hotel")
class Hotel { […] }
class Hotel { […] }
Hotel = DocuWithLabel("Repräsentiert ein Hotel")(Hotel) || Hotel;
Dekorator für Klassen
Page 6
function Docu(target) {
console.debug(target);
}
4
Dekorator für Member
Page 7
function Docu(target, key, descriptor) {
console.debug(target);
console.debug(key);
console.debug(descriptor);
console.debug("---");
}
Dekorator für Argumente (TypeScript)
Page 8
function Docu(target, key, descriptor) {
console.debug(target);
console.debug(key);
console.debug(descriptor);
console.debug("---");
}
Argumentposition (0, 1, … n)
5
Factory für Dekorator
Page 9
function DocuWithLabel(label) {
return function(target, key?, descriptor?) {
console.debug(label);
console.debug(target);
console.debug(key);
console.debug(descriptor);
console.debug("---");
}
}
DEMO
Page 10