Ty­peS­cript: Ja­vaS­cript++?

SCREENGUIDE - - Inneres - TEXT: Do­mi­nik Kun­del

Ler­nen Sie die Vor­tei­le von Ty­peS­cript ken­nen

Wenn Sie sich ab und zu mit Ja­vaS­cript be­schäf­ti­gen, ha­ben Sie si­cher auch schon ein­mal von Ty­peS­cript ge­hört. Die freie Open-Sour­ce-Pro­gram­mier­spra­che wird seit 2012 von Mi­cro­soft ent­wi­ckelt. Doch was hat es mit die­ser omi­nö­sen Spra­che auf sich – und ist Ty­peS­cript das neue Ja­vaS­cript?

Ja­vaS­cript ist wei­ter­hin auf dem Vormarsch, um sich lang­sam in je­dem Be­reich der Soft­ware­ent­wick­lung zu po­si­tio­nie­ren. Heu­te kön­nen Sie von tra­di­tio­nel­len Web-Ap­pli­ka­tio­nen über Web-Ser­ver mit No­de.js bis zu na­ti­ven Mo­bi­le-Apps mit Re­act Na­ti­ve oder Na­ti­ve­S­cript und bis zu Hard­ware al­les mit Ja­vaS­cript bau­en. Da­durch wer­den je­doch auch neue Pro­ble­me auf­ge­deckt. Ja­vaS­cript-Pro­jek­te wach­sen stän­dig in ih­rer Grö­ße und Kom­ple­xi­tät. In Kom­bi­na­ti­on mit ei­ni­gen Ma­cken und Li­mi­tie­run­gen von Ja­vaS­cript kann das schnell da­zu füh­ren, dass Pro­jek­te un­über­sicht­lich wer­den und schwer zu ver­wal­ten sind. Wäh­rend Ja­vaS­cript ver­sucht, sich selbst zu ent­wi­ckeln und Din­ge wie Mo­du­le, Klas­sen und Ähn­li­ches selbst ein­zu­füh­ren, geht dies ei­ni­gen Leu­ten nicht weit und schnell ge­nug. Ei­ne Sa­che, die vie­le Ent­wick­ler vor al­len Din­gen für grö­ße­re Ja­vaS­cript-Pro­jek­te ver­mis­sen, ist die Mög­lich­keit, ih­ren Co­de sta­tisch zu ty­pi­sie­ren. Das be­deu­tet, dass Sie bei Ih­ren Va­ria­blen de­fi­nie­ren, um was für ei­ne Art von Wert es sich han­delt und wel­che Re­geln für die Nut­zung die­ses Wer­tes be­ste­hen. Mi­cro­soft stell­te 2012 mit Ty­peS­cript ei­ne Open-Sour­ce-Lö­sung für die­ses Pro­blem vor [ty­pescript­lang.org]. Die Spra­che wur­de un­ter ei­ner Apa­che Li­cen­se 2.0 ver­öf­fent­licht und liegt mitt­ler­wei­le in der Ver­si­on 2.3 (April 2017) vor. Wäh­rend es zwar auch Kon­kur­renz­lö­sun­gen wie zum Bei­spiel Face­books Flow [flow. org] gibt, ge­nießt Ty­peS­cript stei­gen­de Po­pu­la­ri­tät. So kün­dig­te et­wa Goog­le auf der ng-conf 2017 an, dass Ty­peS­cript in die Lis­te der of­fi­zi­el­len Pro­gram­mier­spra­chen bei Goog­le auf­ge- nom­men wur­de. Pro­jek­te wie das neue An­gu­lar Frame­work oder Mi­cro­softs Cross-Platt­form-Edi­tor Vi­su­al Stu­dio Co­de sind nicht nur in Ty­peS­cript ge­schrie­ben, sie nut­zen auch die Vor­tei­le ei­nes ty­pi­sier­ten Ja­vaS­cript, um dem Nut­zer zu hel­fen. Da­bei er­laubt Vi­su­al Stu­dio Co­de Ja­vaS­cript–Ent­wick­lern, in den Ge­nuss von ver­bes­ser­ter Au­to­ver­voll­stän­di­gung (In­tel­liSen­se) zu kom­men, in­dem es den Ja­vaS­cript Co­de von Ty­peS­cript in­ter­pre­tie­ren lässt. An­gu­lar hin­ge­gen nutzt das Wis­sen von Ty­peS­cript, um mit dem „Ahead-of-Ti­me Com­pi­ler” Ih­ren Co­de wei­ter zu op­ti­mie­ren [goo.gl/lXE­myq].

WAS IST TY­PES­CRIPT?

Ty­peS­cript in­vol­viert zwei Kom­po­nen­ten. Auf der ei­nen Sei­te gibt es die Spra­che Ty­peS­cript, die sich selbst als „Su­per­set” von Ja­vaS­cript de­fi­niert. Das heißt, dass jeg­li­cher gül­ti­ger Ja­vaS­cript Co­de auch gleich­zei­tig gül­ti­ges Ty­peS­cript ist. Zu­sätz­lich führt Ty­peS­cript Kon­zep­te wie Type-An­no­ta­tio­nen ein, mit de­nen Sie die Ty­pen von ver­schie­de­nen Ob­jek­ten in Ih­rem Co­de de­fi­nie­ren, so­wie In­ter­faces und an­de­re Fea­tu­res, um ei­ge­ne Ty­pen zu er­stel­len. Auf der an­de­ren Sei­te gibt es den Ty­peS­cript Com­pi­ler und den Ty­peS­cript Lan­gua­ge Ser­ver. Der Ty­peS­cript Com­pi­ler er­laubt es Ih­nen, gül­ti­ges Ty­peS­cript zu Ja­vaS­cript zu kon­ver­tie­ren, das Sie an­schlie­ßend im Brow­ser oder mit Sys­te­men wie No­de.js aus­füh­ren kön­nen. Des Wei­te­ren ana­ly­siert Ty­peS­cript ba­sie­rend auf den vor­han­de­nen Type-An­no­ta­tio­nen, ob ir­gend­wel­che Re­geln ge­bro­chen wur­den.

Der Ty­peS­cript Lan­gua­ge Ser­ver er­laubt Sys­te­men, wie dem Vi­su­al Stu­di­os Au­to­ver­voll­stän­di­gung (In­tel­liSen­se) Fea­tu­re, Ver­bes­se­rungs­vor­schlä­ge wie z.B. pro­jekt­wei­tes Re­fac­to­ring wäh­rend des Pro­gram­mie­rens an­zu­bie­ten. Au­ßer­dem kann es ver­wen­det wer­den, um Ih­nen früh­zei­tig Feh­ler auf­zu­zei­gen. Bei­de Tools sind selbst in Ty­peS­cript ge­schrie­ben, als OpenSour­ce-Pro­jek­te auf GitHub ver­füg­bar und kön­nen über Pa­cka­geMa­na­ger wie npm oder yarn in­stal­liert wer­den [goo.gl/qWXkII]. Tipp: Um Ty­peS­cript op­ti­mal zu nut­zen, soll­ten Sie ent­we­der für Ih­ren be­vor­zug­ten Edi­tor das je­wei­li­ge Ty­peS­cript-Plu­gin in­stal­lie­ren [goo.gl/Y2Cs­hS] oder auf den kos­ten­lo­sen Vi­su­al Stu­dio Co­de ver­trau­en [goo.gl/GcrcLI].

TY­PEN IN JA­VAS­CRIPT

Be­vor Sie wei­ter in die Welt von Ty­peS­cript ein­tau­chen, soll­ten Sie si­cher­stel­len, dass Sie ein paar grund­le­gen­de Din­ge über Ty­pen in Ja­vaS­cript wis­sen. Da Ja­vaS­cript ei­ne Spra­che mit dy­na­mi­schen Ty­pen ist, den­ken Web­wor­ker sehr sel­ten über Ty­pen nach, wenn sie Ja­vaS­cript Co­de schrei­ben. Nor­ma­ler­wei­se kommt es da­zu erst, wenn ir­gend­was schreck­lich fehl­ge­schla­gen ist und der Co­de Feh­ler pro­du­ziert. Ein gu­tes Bei­spiel ist hier die fol­gen­de, sehr nai­ve con­cat-Funk­ti­on, die die In­hal­te des zwei­ten Ar­rays in das ers­te Ar­ray pa­cken soll und an­schlie­ßend die­ses zu­rück­gibt: Das Pro­blem hier ist al­ler­dings, dass die­ser Co­de nicht nur pro­blem­los funk­tio­niert, wenn „in­pu­tB” ein Ar­ray ist, son­dern auch wenn „in­pu­tB” ein String ist, wie die­ses Bei­spiel zeigt: Dies ist kein dra­ma­ti­sches Pro­blem, bis ein fin­di­ger Ent­wick­ler in Ih­rem Team die­ses Ver­hal­ten ent­deckt, oh­ne den ei­gent­li­chen Co­de zu be­trach­ten. Das Ver­hal­ten des Co­des könn­te näm­lich dar­auf schlie­ßen las­sen, dass auch „in­pu­tA” ein String sein kann. Ist dies al­ler­dings der Fall, wird wäh­rend der Aus­füh­rung die­ses Co­des ein Feh­ler aus­ge­ge­ben, weil „in­pu­tA” nicht über ei­ne push()-Me­tho­de ver­fügt, da „in­pu­tA” ein String ist. Wenn die­ser Co­de vor­her nicht aus­rei­chend ge­tes­tet wur­de, kann dies schnell zu ei­nem Pro­blem füh­ren, das erst der Kun­de ent­deckt. Zum Glück bie­tet Ja­vaS­cript be­reits Mög­lich­kei­ten, die Ty­pen von Ar­gu­men­ten zu prü­fen. Ne­ben dem Ope­ra­tor ===, der nicht nur die Wert­gleich­heit, son­dern auch die Typ­gleich­heit checkt, gibt es auch die Ope­ra­to­ren ty­peof und in­stan­ce­of, die Ih­nen bei die­ser Auf­ga­be mehr oder we­ni­ger gut hel­fen kön­nen: Wie Sie viel­leicht be­reits ge­se­hen ha­ben, funk­tio­niert dies nicht im­mer be­son­ders gut. Ar­rays zum Bei­spiel ge­ben den Typ „ob­ject” wie­der, da „ar­ray” kein ein­ge­bau­ter Typ ist. Zwar gibt es mitt­ler­wei­le ei­ne Ar­ray.isAr­ray(arr)-Funk­ti­on, al­ler­dings trifft dies nicht auf an­de­re Ty­pen zu. Des Wei­te­ren sind all dies Checks, die wäh­rend der ei­gent­li­chen Aus­füh­rung des Co­des ab­ge­ar­bei­tet wer­den und sich dem­ent­spre­chend auf die Per­for­mance des Co­des aus­wir­ken kön­nen. Wä­re es des­halb nicht bes­ser, wenn Sie schon früh­zei­tig die­se Checks durch­füh­ren und wäh­rend der Aus­füh­rung ver­mei­den könn­ten? Ge­nau die­ses Sze­na­rio ist Ty­peS­cripts Spe­zi­al­ge­biet.

TY­PES­CRIPT IN­STAL­LIE­REN

Zum Start müs­sen Sie den Ty­peS­cript Com­pi­ler in­stal­lie­ren. Hier­für be­nö­ti­gen Sie No­de.js so­wie ei­nen Pa­cka­ge-Ma­na­ger wie npm oder yarn. Sie kön­nen den Com­pi­ler ent­we­der glo­bal für Ih­ren kom­plet­ten Com­pu­ter in­stal­lie­ren oder lo­kal für ein be­stimm­tes Pro­jekt. Wäh­rend ei­ne glo­ba­le In­stal­la­ti­on den Vor­teil hat, dass Sie den Com­pi­ler nur ein­mal in­stal­lie­ren müs­sen, er­laubt Ih­nen ei­ne lo­ka­le In­stal­la­ti­on, für ver­schie­de­ne Pro­jek­te ver­schie­de­ne Ty­peS­cript-Ver­sio­nen zu be­nut­zen. Dies ist be­son­ders hilf­reich, wenn Sie nicht al­lei­ne an die­sem Pro­jekt ar­bei­ten. So kön­nen Sie Sze­na­ri­en wie „es funk­tio­niert auf mei­ner Ma­schi­ne” ver­mei­den. Soll­ten Sie sich für ei­ne glo­ba­le In­stal­la­ti­on ent­schei­den, füh­ren Sie ein­fach den fol­gen­den Be­fehl in Ih­rer Kom­man­do­zei­le aus: Das sorgt da­für, dass der neue Be­fehl „tsc” in Ih­rer Kom­man­do­zei­le zur Ver­fü­gung steht. Ent­schei­den Sie sich je­doch für ei­ne lo­ka­le In­stal­la­ti­on (die sich ge­ne­rell emp­fiehlt, falls Sie an ver­schie­de­nen Ty­peS­cript-Pro­jek­ten ar­bei­ten), füh­ren Sie den fol­gen­den Be­fehl aus:

So­mit wird Ty­peS­cript als „de­vDe­pen­den­cy” in Ih­re „pa­cka­ge. json”-Da­tei ge­schrie­ben, und Sie kön­nen den Ty­peS­cript Com­pi­ler un­ter „node_­mo­du­les/.bin/tsc” in Ih­rem Pro­jekt fin­den. Da nun die not­wen­di­gen Tools in­stal­liert sind, ist es Zeit, über ein paar Ty­peS­cript Ba­sics zu re­den.

TY­PES­CRIPT BA­SICS

Der Ty­peS­cript Com­pi­ler ver­sucht Ih­nen, wann im­mer mög­lich, das Le­ben so leicht wie mög­lich zu ma­chen. Das heißt, dass Sie nicht zwangs­läu­fig Ih­ren kom­plet­ten Co­de mit Ty­pen ver­se­hen müs­sen, da Ty­peS­cript so gut wie mög­lich ver­sucht, die­se selbst zu be­stim­men. Wol­len Sie den­noch ei­nen Typ sel­ber de­fi­nie­ren, kön­nen Sie dies über ei­ne sehr simp­le Syn­tax er­le­di­gen: Wie Sie se­hen, de­fi­nie­ren Sie in der ers­ten Zei­le nicht, dass „myString” vom Typ „string” ist. Den­noch ist der Ty­peS­cript Com­pi­ler klug ge­nug, dies raus­zu­fin­den. Wenn Sie das kurz selbst aus­pro­bie­ren möch­ten, ko­pie­ren Sie die Zei­len ein­fach in ei­ne Da­tei mit dem Na­men „bei­spiel-1.ts” in Ihr Pro­jekt und füh­ren Sie den Com­pi­ler aus: Da­bei soll­te der Ty­peS­cript Com­pi­ler ge­nau bei der Zei­le „myString = 42;” ei­nen Feh­ler mel­den. Kor­ri­gie­ren Sie die Zei­le, in­dem Sie die­se ent­fer­nen oder 42 durch ei­nen String er­set­zen und füh­ren Sie den Com­pi­ler er­neut aus. Sie soll­ten jetzt ei­ne Da­tei mit dem Na­men „bei­spiel­1.js” im sel­ben Ord­ner fin­den, mit dem kom­pi­lier­ten Ja­vaS­cript Co­de. In die­ser Da­tei fin­den Sie al­ler­dings nicht die hin­zu­ge­füg­ten Type-An­no­ta­tio­nen. Zu­sätz­lich wer­den Sie fest­stel­len, dass al­le „let” durch „var” er­setzt wur­den, da der Ty­peS­cript Com­pi­ler au­to­ma­tisch als Ziel­spra­che Ja­vaS­cript ES3 aus­gibt, in der es kein „let/const”, son­dern nur „var” gibt. Wir wer­den auf die­ses Fea­tu­re spä­ter noch ge­nau­er ein­ge­hen. Ihr neu­es Wis­sen über Type-An­no­ta­tio­nen kön­nen Sie jetzt be­nut­zen, um die be­kann­te con­cat-Funk­ti­on zu ver­bes­sern. Er­stel­len Sie hier­für ei­ne neue Da­tei „bei­spiel-2.ts” und fü­gen Sie die fol­gen­den Zei­len hin­zu: Wenn Sie nun ver­su­chen, die­se Zei­len zu kom­pi­lie­ren, wer­den Sie schnell fest­stel­len, dass „con­cat” mit dem String nicht mehr funk­tio­niert und Sie so ei­nen für den Nut­zer po­ten­zi­el­len Feh­ler ver­mie­den ha­ben. Ent­fer­nen Sie die feh­ler­haf­te Zei­le und ver­su­chen Sie, die Da­tei er­neut zu kom­pi­lie­ren. In­spi­zie­ren Sie an­schlie­ßend die re­sul­tie­ren­de „bei­spiel-2.js”-Da­tei, und Sie wer­den fest­stel­len, dass die­se ge­nau­so aus­sieht wie das ers­te con­cat-Bei­spiel. Das heißt, dass zwar wäh­rend des Kom­pi­lie­rens die Ty­pen ge­tes­tet wer­den, al­ler­dings das Re­sul­tat ein Co­de oh­ne Typ­checks ist. Wo­bei wir auch schon bei ei­ner der größ­ten Stol­per­fal­len für neue Ty­peS­cript-Nut­zer sind.

STOL­PER­FAL­LEN IN TY­PES­CRIPT

Ty­peS­cript ver­sucht, Ih­ren Co­de si­che­rer zu ma­chen, will da­bei al­ler­dings kei­nen Ein­fluss auf die Per­for­mance Ih­res Co­des neh­men. Aus die­sem Grund wer­den die Checks von Ty­peS­cript le­dig­lich wäh­rend des Kom­pi­lie­rens un­ter­nom­men, und Ty­peS­cript fügt kei­ner­lei Run­ti­me-Checks hin­zu. Das ist in der Re­gel okay, wenn Sie wis­sen, dass die­ser Co­de nur von Ent­wick­lern be­nutzt wird, die eben­falls Ty­peS­cript ver­wen­den. Soll­ten Sie al­ler­dings ein Mo­dul pla­nen, das auch an­de­re Ja­vaS­cript-Ent­wick­ler be­nut­zen wer­den, soll­ten Sie zu­min­dest die nach au­ßen ver­füg­ba­ren Funk­tio­nen si­chern. So­bald Sie sich dann ein­mal über den Typ ei­nes Wer­tes ver­si­chert ha­ben, kön­nen Sie sich ge­trost auf den Ty­peS­cript Com­pi­ler ver­las­sen. Sie kön­nen die­se Run­ti­me-Checks mit den vor­hin ge­nann­ten Ja­vaS­cript-Ope­ra­to­ren wie „ty­peof” oder „in­stan­ce­of” er­le­di­gen.

In die­sem Fall kön­nen Sie Ar­ray.isAr­ray() be­nut­zen, um ei­ne neue si­che­re Va­ri­an­te zu er­stel­len: Das Schö­ne hier ist, dass Ty­peS­cript sol­che Checks ver­steht. So könn­ten Sie die Type-An­no­ta­tio­nen von „in­pu­tA” und „in­pu­tB” ent­fer­nen, und Ty­peS­cript wüss­te den­noch, dass „in­pu­tA” und „in­pu­tB” Ar­rays sein müs­sen, wenn der Co­de die Zei­le der forSchlei­fe er­reicht. Er­stel­len Sie ei­ne neue Da­tei „bei­spiel-3.ts”, fü­gen Sie die­se Zei­len hin­zu und kom­pi­lie­ren Sie die Da­tei. Wenn Sie die „bei­spiel-3.js”-Da­tei in­spi­zie­ren, wer­den Sie be­mer­ken, dass die Checks mit „Ar­ray.isAr­ray” noch vor­han­den sind, wäh­rend die „any[]”-An­no­ta­tio­nen ver­schwun­den sind. Die­ses Ver­hal­ten von Run­ti­me-Checks vs. Com­pi­le-Checks ist ein wich­ti­ges Kon­zept, das Sie stets im Kopf be­hal­ten soll­ten, wenn Sie Ty­peS­cript Co­de schrei­ben, um zu­künf­ti­ge Feh­ler zu ver­mei­den. Sie wis­sen jetzt, wie Sie Ty­peS­cript mit Stan­dard­ty­pen wie string, boo­le­an, num­ber etc. be­nut­zen kön­nen. Al­ler­dings wür­den Sie in ei­nem rich­ti­gen Pro­jekt mit die­ser li­mi­tier­ten An­zahl an Ty­pen nicht zu­recht­kom­men. Auch hier­für hat Ty­peS­cript ver­schie­de­ne Lö­sun­gen pa­rat – in Form von In­ter­faces, Type-Aliases und Generics. Wol­len Sie zum Bei­spiel ei­ne Funk­ti­on schrei­ben, die als Ar­gu­ment ein Ja­vaS­cript-Ob­jekt er­hält, das ei­ner be­stimm­ten Struk­tur ent­spricht, so kön­nen Sie hier­für ein In­ter­face er­stel­len, das die­se Struk­tur dar­stellt. Manch­mal sind Ob­jek­te in Ja­vaS­cript aber nicht so ein­fach zu de­fi­nie­ren wie in die­sem Bei­spiel. So könn­ten Sie zum Bei­spiel ein Ob­jekt nut­zen, das als ei­ne Art Dic­tio­na­ry dient und ver­schie­de­ne Wer­te dy­na­misch hal­ten kann. Mit In­ter­faces kön­nen Sie auch die­ses Pro­blem lö­sen und da­bei fest­le­gen, wel­chen Typ die Wer­te ha­ben sol­len. Sie kön­nen eben­falls At­tri­bu­te als op­tio­nal de­kla­rie­ren, in­dem Sie den Na­men mit ei­nem „?” er­wei­tern: Ein an­de­res nütz­li­ches Fea­tu­re sind Type-Ali­as­se. Mit ih­rer Hil­fe kön­nen Sie neue künst­li­che Ty­pen er­stel­len, die im Prin­zip nur als neue Na­men für ei­nen oder meh­re­re exis­tie­ren­de Ty­pen fun­gie­ren.

“Ty­peS­cript was such a boon to our sta­bi­li­ty and sa­ni­ty that we star­ted using it for all new co­de wi­t­hin days of star­ting the con­ver­si­on.” Fe­lix Rie­se­berg, Desk­top En­gi­neer bei Slack

Wie Sie se­hen, kön­nen Sie auf der ei­nen Sei­te ei­nen exis­tie­ren­den Typ neu be­nen­nen, aber auch ei­nen neu­en „Uni­on Typ” er­stel­len, der aus zwei oder mehr Ty­pen be­steht. Ein wei­te­res wich­ti­ges Fea­tu­re in ty­pi­sier­ten Spra­chen sind Generics. Mit Generics kön­nen Sie Klas­sen und In­ter­faces de­fi­nie­ren, die fle­xi­ble Ty­pen ak­zep­tie­ren. Wol­len Sie zum Bei­spiel ein „Dic­tio­na­ry”-In­ter­face er­stel­len, das nur Wer­te ei­nes be­stimm­ten Typs hält, so kön­nen Sie ei­nen fik­ti­ven Ty­pen „T” de­fi­nie­ren und die­sen spä­ter beim Be­nut­zen des In­ter­faces spe­zi­fi­zie­ren. Ei­ne be­reits ein­ge­bau­te Ge­ne­ric-Class ist „Ar­ray<T>”, die Sie schon in der Schreib­wei­se „any[]” be­nutzt ha­ben. Generics kön­nen so­mit nicht nur in In­ter­faces, son­dern auch in Klas­sen oder Funk­tio­nen be­nutzt wer­den und hel­fen, dop­pel­ten Co­de zu ver­mei­den.

TY­PES­CRIPT-PRO­JEKT ER­STEL­LEN

Bis­her ha­ben Sie die je­wei­li­gen Ty­peS­cript-Da­tei­en ma­nu­ell kom­pi­liert. Wenn Sie al­ler­dings an ei­nem grö­ße­ren Pro­jekt oder an meh­re­ren Teil­pro­jek­ten ar­bei­ten, dann ist die­ses ma­nu­el­le Kom­pi­lie­ren mehr als un­güns­tig. Be­son­ders wenn Sie auch noch ver­schie­de­ne Op­tio­nen für den Kom­pi­lier­pro­zess de­fi­nie­ren möch­ten. Ge­nau hier­für eig­net sich ei­ne Kon­fi­gu­ra­ti­ons­da­tei sehr gut. Ty­peS­cript un­ter­stützt hier JSON–Da­tei­en, mit de­nen Sie so­wohl die Da­tei­en, die Sie kom­pi­lie­ren möch­ten, als auch al­le Op­tio­nen für den Com­pi­ler steu­ern kön­nen. Stan­dard­mä­ßig sucht der Ty­peS­cript Com­pi­ler, wenn oh­ne Ar­gu­ment aus­ge­führt, nach ei­ner „ts­con­fig.json”-Da­tei im ak­tu­el­len Ord­ner. Sie kön­nen al­ler­dings auch ei­nen an­de­ren Pfad oder Na­men nut­zen, in­dem Sie die­sen beim Kom­pi­lie­ren in Form ei­ner Op­ti­on hin­zu­ge­ben: Sie soll­ten die­se Mög­lich­keit al­ler­dings nur für Tests oder ähn­li­ches ein­set­zen und für ihr Haupt­pro­jekt ei­ne „ts­con­fig.json”Da­tei be­nut­zen. Die­se kön­nen Sie ent­we­der ma­nu­ell er­stel­len oder mit Hil­fe des Com­pi­lers, in­dem Sie den fol­gen­den Be­fehl aus­füh­ren: Dies wird ei­ne neue „ts­con­fig.json”-Da­tei in dem je­wei­li­gen Ord­ner er­stel­len und die­se Da­tei mit ei­ner Rei­he von Stan­dar­d­op­tio­nen so­wie Kom­men­ta­ren für die je­wei­li­gen Op­tio­nen be­fül­len. Über die­se Op­tio­nen könn­ten Sie zum Bei­spiel hier das Ver­hal­ten ve­rän­dern, dass Ihr Co­de au­to­ma­tisch zu ES3-kom­pa­ti­be­lem Co­de ver­än­dert wird und statt­des­sen ei­ne an­de­re Ziel­ver­si­on de­fi­nie­ren – wie bei­spiels­wei­se ES5/ES2015 oder ESNext für die neus­ten Fea­tu­res. In die­ser Da­tei kön­nen Sie eben­falls be­stim­men, wel­che Da­tei­en und Ord­ner von dem Com­pi­ler kom­pi­liert wer­den sol­len. Die Vor­ein­stel­lung hier ist, dass, wenn kein „in­clu­de”- oder „fi­les”Ein­trag ge­fun­den wird, al­le Da­tei­en in die­sem Ord­ner so­wie al­len Un­ter­ord­nern kom­pi­liert wer­den, es sei denn sie sind im „ex­clu­de”-Ein­trag ge­lis­tet. Mehr über die „ts­con­fig.json”-Da­tei fin­den Sie di­rekt auf der Ty­peS­cript-Sei­te [goo.gl/ZAXpxG].

EX­TER­NE DEPENDENCIES

Bis­her ha­ben Sie ge­se­hen, wel­che Vor­tei­le Sie ha­ben, wenn Sie Co­de in Ty­peS­cript schrei­ben. Al­ler­dings ist ein Groß­teil von Ja­vaS­cript Frame­works und Mo­du­len nicht in Ty­peS­cript, son­dern in Ja­vaS­cript ge­schrie­ben. Das heißt, dass Sie zum ei­nen nicht die Si­cher­heit durch Ty­pen ge­nie­ßen kön­nen, zum an­de­ren aber auch, dass Ty­peS­cript sich be­schwe­ren wird, wenn Sie Din­ge be­nut­zen, die nicht di­rekt Teil von Ja­vaS­cript oder Ih­rem Ty­peS­cript-Pro­jekt sind. So wird der Ty­peS­cript Com­pi­ler sich zum Bei­spiel über die fol­gen­de Zei­le be­schwe­ren, da „$” nicht be­kannt ist, selbst wenn der Co­de spä­ter im Brow­ser pro­blem­los funk­tio­niert.

Das Glei­che gilt auch für Mo­du­le, die Sie mit No­de.js be­nut­zen wol­len oder wenn Sie ver­su­chen, No­de.js-spe­zi­fi­sche Din­ge wie „__­dir­na­me” zu ver­wen­den. Um ex­ter­ne Dependencies, die in Ja­vaS­cript ge­schrie­ben sind, in Ty­peS­cript er­folg­reich zu nut­zen, müs­sen Sie dem Ty­peS­cript Com­pi­ler In­for­ma­tio­nen über die­se zur Ver­fü­gung stel­len. Die Lö­sung hier­für sind so­ge­nann­te De­fi­ni­ti­on-Fi­les. Die­se Da­tei­en en­den in der Re­gel auf „.d.ts” und ha­ben das cha­rak­te­ris­ti­sche Merk­mal, dass sie kei­ner­lei Lo­gik ent­hal­ten, son­dern le­dig­lich In­ter­faces oder Ähn­li­ches. Wenn die­se Da­tei­en al­so kom­pi­liert wer­den, re­sul­tie­ren sie in lee­ren Ja­vaS­cript-Da­tei­en. De­fi­ni­ti­on-Fi­les kön­nen ent­we­der di­rekt in ei­nem npm-Pa­ket ent­hal­ten oder ex­tern sein. Für ei­ne Viel­zahl von Open-Sour­cePro­jek­ten ist dies der Fall. Die größ­te Samm­lung hier­für ist das GitHub-Pro­jekt De­fi­ni­te­lyTy­ped [goo.gl/32yl­lJ], das zur­zeit auch als Haupt-Re­po­si­to­ry für De­fi­ni­ti­on-Fi­les gilt. Seit Ty­peS­cript 2.0 ist die In­stal­la­ti­on von die­sen Da­tei­en ver­ein­facht wor­den. Al­le De­fi­ni­ti­on-Fi­les in De­fi­ni­te­lyTy­ped wer­den durch ei­nen npm Na­me­s­pace „@ty­pes” zur Ver­fü­gung ge­stellt. So­mit kön­nen Sie die De­fi­ni­ti­on-Fi­les für ein Pro­jekt wie jQu­e­ry ein­fach durch ei­nen Pa­cka­ge-Ma­na­ger wie npm oder yarn in­stal­lie­ren: Vor der Ty­peS­cript-Ver­si­on 2.0 war die Lö­sung für die­ses Pro­blem, Tools wie typ­ings und tsd zu nut­zen. Soll­ten Sie al­so über die­se Tools le­sen und ei­ne neue­re Ver­si­on von Ty­peS­cript be­nut­zen, kön­nen Sie die­se ge­trost durch npm er­set­zen. Sie ha­ben be­reits ei­ne Rei­he von Ty­peS­cript-Fea­tu­res ken­nen­ge­lernt. Al­ler­dings han­delt es sich da­bei nur um die Spit­ze des kon­stant wach­sen­den Eis­ber­ges. So un­ter­stützt Ty­peS­cript un­ter an­de­rem auch wei­te­re ty­pi­sche Fea­tu­res aus ty­pi­sier­ten Spra­chen wie En­ums [goo.gl/MMT2u2] oder „Ac­cess Mo­di­fiers” [goo. gl/i1LRtq], mit de­nen Sie At­tri­bu­te und Me­tho­den von Klas­sen als „pri­va­te”, „pro­tec­ted” oder „pu­b­lic” de­fi­nie­ren kön­nen. Au­ßer­dem ori­en­tiert sich Ty­peS­cript an den Plä­nen des Ko­mi­tees, das die neu­en Ja­vaS­cript-Stan­dards be­stimmt, und im­ple­men­tiert die­se zum Teil be­reits früh­zei­tig und in der Re­gel mit der Kom­pa­ti­bi­li­tät, die es er­laubt, die­se zu äl­te­ren Ver­sio­nen von Ja­vaS­cript zu kom­pi­lie­ren. So kön­nen Sie neue Fea­tu­res wie „async/await” oder ex­pe­ri­men­tel­le Fea­tu­res wie De­co­ra­tors be­nut­zen, oh­ne auf ei­nen an­de­ren Transpi­ler wie Ba­bel zu ver­trau­en, und den­noch ES5- oder ES3-kom­pa­ti­blen Co­de er­hal­ten. Falls Sie ein Re­act-Ent­wick­ler sind und auf JSX schwö­ren, so brau­chen Sie auch hier kei­ne Be­den­ken zu ha­ben. Ty­peS­cript un­ter­stützt JSX in Form von TSX-Da­tei­en und kann die­se nicht nur ver­ste­hen, son­dern mit der „jsx”-Op­ti­on im Com­pi­ler so­gar di­rekt in den je­wei­li­gen Re­act oder Re­act Na­ti­ve Co­de ver­wan­deln [goo.gl/hEay8V]: Da Ty­peS­cript ein sehr ak­ti­ves Open-Sour­ce-Pro­jekt ist, wer­den kon­ti­nu­ier­lich neue Fea­tu­res vor­ge­schla­gen und im­ple­men­tiert. Die bes­te Quel­le, um auf dem Lau­fen­den zu blei­ben, ist zur­zeit die Road­map im Ty­peS­cript-GitHub-Pro­jekt-Wi­ki [goo.gl/ MmA6Xw]. Wie Sie se­hen, ist Ty­peS­cript kei­ne Spra­che, die be­ab­sich­tigt, Ja­vaS­cript zu er­set­zen, son­dern mehr ei­ne lo­gi­sche Wei­ter­ent­wick­lung des klas­si­schen Ja­vaS­cript. Vie­le Fea­tu­res, die Ty­peS­cript un­ter­stützt, wur­den mitt­ler­wei­le in den Ja­vaS­cript-Stan­dard über­nom­men oder be­fin­den sich im Mo­ment als Vor­schlä­ge in den Hän­den des Ko­mi­tees für die Ja­vaS­cript-Stan­dar­di­sie­rung (TC39) [goo.gl/kHVRS2]. Die Tat­sa­che, dass jeg­li­ches gül­ti­ge Ja­vaS­cript auch gleich­zei­tig gül­ti­ges Ty­peS­cript ist, er­leich­tert den Ein­stieg in die Welt von Ty­peS­cript und er­laubt Ih­nen, Schritt für Schritt lang­sam mehr und mehr Ty­peS­cript-Fea­tu­res in Ih­ren Co­de ein­zu­brin­gen und so die Vor­tei­le von Ty­peS­cript zu nut­zen und sich vor dem Ty­pen­wirr­warr von Ja­vaS­cript zu schüt­zen. Al­les in al­lem ist es ei­ne Er­wei­te­rung des klas­si­schen Ja­vaS­cripts, die, so wie es aus­sieht, in na­her Zu­kunft wei­ter­hin wach­sen wird. Mit sei­nen vie­len Vor­tei­len kann es vor al­lem in grö­ße­ren Pro­jek­ten sehr hel­fen und zu­sätz­lich Ent­wick­lern, die mit an­de­ren Pro­gram­mier­spra­chen ver­traut sind, den Über­gang in die Welt von Ty­peS­cript/Ja­vaS­cript er­leich­tern.

Do­mi­nik Kun­del ist De­ve­l­oper Evan­ge­list bei Twi­lio in Ber­lin [twi­lio.com]. Er ist ein Fan von Web-Tech­no­lo­gi­en, Hacka­thons und gu­tem Whis­ky. Üb­li­cher­wei­se trifft man ihn bei Mee­tups, Kon­fe­ren­zen oder als Men­tor bei Hacka­thons. Vor sei­ner Zeit bei Twi­lio war er Soft­ware­ent­wick­ler bei Mi­cro­soft.

Abb. 1: Dank der Ty­pen im Co­de kann Ty­peS­cript prä­zi­se Au­to­ver­voll­stän­di­gung be­reit­stel­len.

Newspapers in German

Newspapers from Germany

© PressReader. All rights reserved.