TypeScript-zelfstudie: weet over de grondbeginselen van TypeScript

TypeScript is een sterk getypeerde superset van dat compileert naar gewoon JavaScript. U kunt deze taal gebruiken voor JavaScript-ontwikkeling op toepassingsschaal. Het kan ook worden uitgevoerd op elke browser, elke host en elk besturingssysteem. In deze TypeScript-zelfstudie gaan we dieper in op TypeScript en begrijpen we de basisprincipes in de volgende volgorde:

• Inleiding tot TypeScript
• TypeScript-typen
• Variabelen
• Operatoren
• Loops
• Functies
• Snaren
• Arrays
• Interfaces
• Klassen
• Voorwerpen
• TypeScript-gebruiksscenario

Inleiding tot TypeScript

TypeScript is een getypte superset van JavaScript die compileert naar gewoon JavaScript. TypeScript is puur objectgeoriënteerd met klassen, interfaces en statisch getypeerde programmeertalen zoals C # of . Het vereist een compiler om te compileren en te genereren in JavaScript-bestand. In feite is TypeScript de ES6-versie van JavaScript met enkele extra functies.

Een TypeScript-code wordt in een bestand geschreven met .ts extensie en vervolgens gecompileerd in JavaScript met behulp van de compiler. U kunt het bestand in elke code-editor schrijven en de compiler moet op uw platform worden geïnstalleerd. Na de installatie is het commando tsc .ts compileert de TypeScript-code in een gewoon JavaScript-bestand.

Syntaxis:

var message: string = 'Welkom bij Edureka!' console.log (bericht)

Bij het compileren genereert het de volgende JavaScript-code:

// Gegenereerd door typoscript 1.8.10 var message = 'Welkom bij Edureka!' console.log (bericht)

Kenmerken van TypeScript

• Cross-platform: De TypeScript-compiler kan op elk besturingssysteem worden geïnstalleerd, zoals Windows, MacOS en Linux.

  
  
  

• Objectgeoriënteerde taal : TypeScript biedt functies zoals Klassen , Interfaces en Modules. Het kan dus objectgeoriënteerde code schrijven voor zowel client-side als server-side ontwikkeling.

• Statische typecontrole : TypeScript gebruikt statisch typen en helpt bij het controleren van typen tijdens het compileren. U kunt dus fouten vinden tijdens het schrijven van de code zonder het script uit te voeren.

• Optioneel statisch typen : TypeScript staat ook optioneel statisch typen toe voor het geval u het dynamische typen van JavaScript gebruikt.

• DOM-manipulatie : U kunt TypeScript gebruiken om de DOM te manipuleren voor het toevoegen of verwijderen van elementen.

• ES 6 Kenmerken : TypeScript bevat de meeste functies van geplande ECMAScript 2015 (ES 6, 7) zoals klasse, interface, pijlfuncties, enz.

Voordelen van het gebruik van TypeScript

• TypeScript is snel, eenvoudig, gemakkelijk te leren en draait op elke browser of JavaScript-engine.

• Het is vergelijkbaar naar JavaScript en gebruikt dezelfde syntaxis en semantiek.

• Dit helpt backend-ontwikkelaars om front-end te schrijven code sneller .

• TypeScript-code kan worden aangeroepen vanuit een bestaande JavaScript-code . Het werkt ook zonder problemen met bestaande JavaScript-frameworks en bibliotheken.

• Het definitiebestand, met de extensie .d.ts, biedt ondersteuning voor bestaande JavaScript-bibliotheken zoals JQuery, D3.js , etc. Dus TypeScript-code kan worden toegevoegd JavaScript-bibliotheken het gebruik van typedefinities om gebruik te maken van de voordelen van typecontrole, automatische code-aanvulling en documentatie in bestaande dynamisch getypeerde JavaScript-bibliotheken.

• Het bevat functies van ES6 en ES7 die kunnen worden uitgevoerd in JavaScript-engines op ES5-niveau, zoals Node.js .

Nu u begrijpt wat TypeScript is, gaan we verder met deze TypeScript-zelfstudie en kijken we naar de verschillende typen.

TypeScript-typen

Het typesysteem vertegenwoordigt de verschillende soorten waarden die door de taal worden ondersteund. Het controleert het Geldigheid van de geleverde waarden voordat ze worden opgeslagen of gemanipuleerd door het programma.

Het kan in twee typen worden ingedeeld, zoals:

• Ingebouwd : Dit omvat getal, tekenreeks, booleaans, leegte, null en ongedefinieerd.
• Gebruiker gedefinieerde : Het bevat opsommingen (enums), klassen, interfaces, arrays en tuple.

Laten we nu verder gaan met deze TypeScript-zelfstudie en meer begrijpen over variabelen.

TypeScript-zelfstudie: variabelen

Een variabele is een benoemde ruimte in het geheugen die wordt gebruikt om waarden op te slaan.

De typesyntaxis voor het declareren van een variabele in TypeScript bevat een dubbele punt (:) achter de variabelenaam, gevolgd door het type. Net als bij JavaScript gebruiken we de var trefwoord om een ​​variabele te declareren.

Er zijn vier opties wanneer we een variabele declareren:

var [identifier]: [type-annotation] = waarde

var [identifier]: [type-annotatie]

var [identifier] = waarde

var [identificeren]

Voorbeeld:

var name: string = 'Daisy' var empid: number = 1001 console.log ('naam' + naam) console.log ('werknemer-id' + empid)

Bij het compileren genereert het de volgende JavaScript-code:

// Gegenereerd door typoscript 1.8.10 var name = 'Daisy' var empid = 1001 console.log ('naam' + naam) console.log ('werknemer-id:' + empid)

Uitgang:

naam: Daisy
werknemers-ID: 1001

Laten we nu verder gaan met het volgende onderwerp van onze TypeScript-zelfstudie.

Operatoren

Een operator wordt gebruikt om functies te definiëren die op de gegevens worden uitgevoerd. De gegevens waarop operators werken, worden operanden genoemd. Er zijn verschillende soorten operators in TypeScript zoals:

• Rekenkundige operatoren
• Logische operators
• Relationele operators
• Bitwise-operators
• Toewijzingsoperatoren

Rekenkundige operatoren

Voorbeeld:

var num1: number = 10 var num2: number = 2 var res: number = 0 res = num1 + num2 console.log ('Sum:' + res) res = num1 - num2 console.log ('Difference:' + res) res = num1 * num2 console.log ('Product:' + res)

Uitgang:

Som: 12
Verschil: 8
Product: 20

Logische operators

Voorbeeld:

var avg: number = 20 var percentage: number = 90 console.log ('Value of avg:' + avg + ', value of percentage:' + percentage) var res: boolean = ((avg> 50) && (percentage> 80 )) console.log ('(avg> 50) && (percentage> 80):', res)

Uitgang:

Waarde van gem: 20, waarde van percentage: 90
(gem.> 50) && (percentage> 80): false

Relationele operators

Voorbeeld:

var num1: number = 10 var num2: number = 7 console.log ('Waarde van num1:' + num1) console.log ('Waarde van num2:' + num2) var res = num1> num2 console.log ('num1 groter dan num2: '+ res) res = num1
 Uitgang: 
Waarde van num1: 10 
 Waarde van num2: 7 
 num1 groter dan num2: waar 
 num1 kleiner dan num2: false
 Bitwise-operators 
 Operatoren 
 Omschrijving 
 Bitsgewijs EN (&) 
voert een Booleaanse AND-bewerking uit op elk bit van zijn integer-argumenten.
 Bitsgewijs OF (|) 
Het voert een Booleaanse OR-bewerking uit op elk bit van zijn integer-argumenten.
 Bitsgewijze XOR (^) 
Het voert een Booleaanse exclusieve OR-bewerking uit op elk bit van zijn integer-argumenten.
 Bitsgewijs NIET (~) 
Dit is een unaire operator en werkt door alle bits in de operand om te draaien.
 Linker shift (<<) 
Het verplaatst alle bits in de eerste operand naar links met het aantal plaatsen dat is opgegeven in de tweede operand.
 Rechts verschuiven (>>) 
De waarde van de linker operand wordt naar rechts verplaatst met het aantal bits dat is gespecificeerd door de rechter operand.
 Rechts verschuiven met nul (>>>) 
Het is vergelijkbaar met de >> operator, behalve dat de bits die aan de linkerkant zijn verschoven altijd nul zijn.
 Voorbeeld: 
var a: number = 2 // Bit presentatie 10 var b: nummer = 3 // Bit presentatie 11 var resultaat resultaat = (a & b) console.log ('(a & b) =>', resultaat) resultaat = ( a | b) console.log ('(a | b) =>', resultaat)
 Uitgang: 
(a & b) => 2 
 (a | b) => 3
 Toewijzingsoperatoren 
 Operatoren 
 Omschrijving 
 Eenvoudige toewijzing (=) 
Wijst waarden toe van de rechter operand aan de linker operand
 Toevoegen en toewijzen (+ =) 
Het voegt de rechter operand toe aan de linker operand en wijst het resultaat toe aan de linker operand.
 Aftrekken en toewijzen (- =) 
Het trekt de rechter operand af van de linker operand en wijst het resultaat toe aan de linker operand.
 Vermenigvuldigen en toekennen (* =) 
Het vermenigvuldigt de rechter operand met de linker operand en wijst het resultaat toe aan de linker operand.
 Verdelen en toewijzen (/ =) 
Het deelt de linker operand door de rechter operand en wijst het resultaat toe aan de linker operand.
 Voorbeeld: 
var a: number = 12 var b: number = 10 a = b console.log ('a = b:' + a) a + = b console.log ('a + = b:' + a) a - = b console .log ('a- = b:' + a)
 Uitgang: 
a = b: 10 
 a + = b: 20 
 een - = b: 10
Dit waren de verschillende operators. Laten we nu verder gaan met onze TypeScript-zelfstudie en leren over loops.
 Loops 
Er kunnen situaties zijn waarin een codeblok meerdere keren moet worden uitgevoerd. EEN lus statement stelt ons in staat om een ​​statement of groep statements meerdere keren uit te voeren.
De TypeScript-lussen kunnen worden geclassificeerd als:
 For loop 
De for loop is een implementatie van een welomlijnde lus.
 Syntaxis: 
for (eerste uitdrukking tweede uitdrukking derde uitdrukking) {// statements die herhaaldelijk moeten worden uitgevoerd}
Hier wordt de eerste uitdrukking uitgevoerd voordat de lus begint. De tweede uitdrukking is de voorwaarde om de lus uit te voeren. En de derde uitdrukking wordt uitgevoerd na de uitvoering van elk codeblok.
 Voorbeeld: 
voor (laat i = 0 i<2 i++) { console.log ('Execute block statement' + i) }
 Uitgang: 
Voer blokinstructie 0 uit 
Voer blokinstructie uit 1
 Herhalingslus 
De while-lus voert de instructies uit elke keer dat de opgegeven voorwaarde resulteert in true.
 Syntaxis: 
while (condition expression) {// codeblok dat moet worden uitgevoerd}
 Voorbeeld: 
laat i: nummer = 1 terwijl (i<3) { console.log( 'Block statement execution no.' + i ) i++ }
 Uitgang: 
Uitvoeringsnummer blok 1 
Uitvoering blokinstructie 2
 Doen..Terwijl Loop 
De do & hellip While-lus is vergelijkbaar met de while-lus, behalve dat deze de voorwaarde niet evalueert voor de eerste keer dat de lus wordt uitgevoerd.
 Syntaxis: 
do {// codeblok dat moet worden uitgevoerd} while (voorwaarde-uitdrukking)
 Voorbeeld: 
  
let i: number = 1 do {console.log ('Block statement uitvoering no.' + i) i ++} while (i<3)
 Uitgang: 
Uitvoeringsnummer blok 1 
Uitvoering blokinstructie 2
Afgezien van deze zijn er de break and continue-instructies in TypeScript die in een lus worden gebruikt.
 Break-verklaring 
De break-instructie wordt gebruikt om de controle uit een constructie te halen. Het gebruik van de break-instructie in een lus helpt het programma bij het verlaten van de lus.
 Voorbeeld: 
var i: number = 1 while (i<=10) { if (i % 5 == 0) { console.log ('The first multiple of 5 between 1 and 10 is : '+i) break //exit the loop if the first multiple is found } i++ } //outputs 5 and exits the loop
 Uitgang: 
Het eerste veelvoud van 5 tussen 1 en 10 is: 5
 Verklaring voortzetten 
De instructie continue slaat de volgende instructies in de huidige iteratie over en brengt de besturing terug naar het begin van de lus.
 Voorbeeld: 
var num: number = 0 var count: number = 0 voor (num = 0num<=10num++) { if (num % 2==0) { continue } count++ } console.log (' The count of odd values between 0 and 10 is: '+count)
 Uitgang: 
Het aantal oneven waarden tussen 0 en 10 is: 5
Dit waren de verschillende loops in TypeScript. Laten we nu verder gaan met onze TypeScript-zelfstudie en functies begrijpen.
 Functies 
In JavaScript, functies zijn een van de belangrijkste onderdelen omdat het een functionele programmeertaal is. Functies zorgen ervoor dat het programma onderhoudbaar en herbruikbaar is, en georganiseerd in leesbare blokken. Hoewel TypeScript het concept van klassen en modules biedt, vormen functies nog steeds een integraal onderdeel van de taal.
 Benoemde functies 
Een benoemde functie wordt gebruikt om een ​​functie met de opgegeven naam te declareren en aan te roepen.
 Voorbeeld: 
function display () {console.log ('TypeScript Function')} display ()
 Uitgang: 
TypeScript-functie
 Anonieme functie 
Een anonieme functie is een functie die wordt gedefinieerd als een uitdrukking. Deze uitdrukking wordt opgeslagen in een variabele. Deze functies worden aangeroepen met behulp van de variabelenaam waarin de functie is opgeslagen.
 Voorbeeld: 
laat groet = functie () {console.log ('TypeScript-functie')} groet ()
 Uitgang: 
TypeScript-functie
 Arrow Functie 
Dikke pijl-notaties worden gebruikt voor anonieme functies, d.w.z. voor functie-uitdrukkingen. In andere talen worden ze ook lambda-functies genoemd.
 Syntaxis: 
(param1, param2, ..., paramN) => uitdrukking
Door de dikke pijl (=>) te gebruiken, vervalt de noodzaak om het zoekwoord ‘functie’ te gebruiken. Parameters worden tussen haakjes doorgegeven en de functie-expressie wordt tussen accolades {} geplaatst.
 Voorbeeld: 
let sum = (x: number, y: number): number => {return x + y} sum (10, 30) // retourneert 40
 Functie overbelasting 
TypeScript biedt het concept van functie-overbelasting. U kunt dus meerdere functies hebben met dezelfde naam, maar met verschillende parametertypen en retourtype.
 Voorbeeld: 
functie add (a: string, b: string): string functie add (a: getal, b: getal): getal retour a + b} add ('Hallo', 'Edureka') // retourneert 'Hallo Edureka' add ( 10, 10) // retourneert 20
In het bovenstaande voorbeeld hebben we dezelfde functie add () met twee functieverklaringen en één functie-implementatie. De eerste handtekening heeft twee parameters van het type string, terwijl de tweede handtekening twee parameters heeft van het typenummer.
Dit zijn de verschillende soorten functies. Laten we nu verder gaan met onze TypeScript-zelfstudie en strings in TypeScript begrijpen.
 TypeScript-zelfstudie: tekenreeksen 
De  is een ander primitief gegevenstype dat wordt gebruikt om tekstgegevens op te slaan. Tekenreekswaarden worden tussen enkele aanhalingstekens of dubbele aanhalingstekens geplaatst.
 Syntaxis: 
var var_name = nieuwe String (string)
Er zijn verschillende eigenschappen van methoden beschikbaar in het String-object, zoals:
 Bouwer - Het retourneert een verwijzing naar de String-functie die het object heeft gemaakt
 Lengte - Dit geeft de lengte van de string terug
 Voorlopig ontwerp - Met deze eigenschap kunt u eigenschappen en methoden aan een object toevoegen
 Voorbeeld: 
let name = new String ('Welkom bij Edureka!') console.log ('Bericht:' + naam) console.log ('Lengte:' + naam.length)
 Uitgang: 
Bericht: Welkom bij Edureka! 
 Lengte: 19
 String-methoden 
De lijst met methoden in String Object omvat:
 Methode 
 Omschrijving 
 karakter () 
Het retourneert het teken op de opgegeven index
wat is een socket in java
 charCodeAt () 
Het retourneert een getal dat de Unicode-waarde van het teken bij de opgegeven index aangeeft
 concat () 
Combineert de tekst van twee strings en retourneert een nieuwe string
 index van() 
Retourneert de index binnen het aanroepende String-object van de eerste keer dat de opgegeven waarde voorkomt
 lastIndexOf () 
Het retourneert de index binnen het aanroepende String-object van de laatste keer dat de opgegeven waarde voorkomt
 bij elkaar passen() 
Wordt gebruikt om een ​​reguliere expressie te vergelijken met een tekenreeks
 localeCompare () 
Retourneert een getal dat aangeeft of een verwijzingsreeks voor of na komt, of hetzelfde is als de opgegeven tekenreeks in sorteervolgorde
 zoeken() 
Dit voert de zoekopdracht uit naar een overeenkomst tussen een reguliere expressie en een opgegeven tekenreeks
 vervangen() 
Wordt gebruikt om een ​​overeenkomst te vinden tussen een reguliere expressie en een tekenreeks, en om de overeenkomende subtekenreeks te vervangen door een nieuwe subtekenreeks
 plak() 
Het extraheert een sectie van een string en retourneert een nieuwe string
 splitsen () 
Splitst een String-object in een reeks strings door de string in subtekenreeksen te scheiden
 substr () 
Retourneert de tekens in een tekenreeks die begint op de opgegeven locatie tot het opgegeven aantal tekens
 deelstring () 
Het retourneert de tekens in een string tussen twee indexen in de string
 toLocaleLowerCase () 
De tekens in een tekenreeks worden geconverteerd naar kleine letters met inachtneming van de huidige landinstelling
 toLocaleUpperCase () 
De tekens in een tekenreeks worden geconverteerd naar hoofdletters met inachtneming van de huidige landinstelling
 toLowerCase () 
Het retourneert de aanroepende tekenreekswaarde geconverteerd naar kleine letters
 toUpperCase () 
Het retourneert de aanroepende tekenreekswaarde geconverteerd naar hoofdletters
 toString () 
Retourneert een tekenreeks die het opgegeven object vertegenwoordigt
 waarde van() 
Retourneert de primitieve waarde van het opgegeven object
 Voorbeeld: 
let str: string = 'Welkom bij Edureka' str.charAt (0) // retourneert 'w' str.charAt (2) // retourneert 'l' 'Welkom bij Edureka'. charAt (2) geeft 'l' terug let str1 : string = 'welcome' let str2: string = 'Edureka' str1.concat (str2) // retourneert 'welcomeEdureka' str1.concat ('', str2) // retourneert 'welkom Edureka' str1.concat ('' to ' ') // retourneert' welkom bij '
Nu u op de hoogte bent van strings, gaan we verder met deze TypeScript-zelfstudie om arrays te begrijpen.
 Arrays in TypeScript 
Een array is een speciaal gegevenstype dat meerdere waarden van verschillende gegevenstypen opeenvolgend opslaat met behulp van een speciale syntaxis. Array-elementen worden geïdentificeerd door een uniek geheel getal dat het subscript of de index van het element wordt genoemd.
 Syntaxis: 
var array_name [: datatype] // declaratie array_name = [val1, val2, valn ..] // initialisatie
 Voorbeeld: 
let names: Array names = ['John', 'Daisy', 'Rachel'] let ids: Array ids = [101, 700, 321]
 Array-methoden 
Hier is een lijst met verschillende Array-methoden die voor verschillende doeleinden kunnen worden gebruikt:
 Methode 
 Omschrijving 
 filter() 
Maakt een nieuwe array met alle elementen van deze array waarvoor de opgegeven filterfunctie true retourneert
 elke () 
Geeft true terug als elk element in deze array voldoet aan de opgegeven testfunctie
 concat () 
Retourneert een nieuwe array die bestaat uit deze array die is samengevoegd met andere arrays
 index van() 
Retourneert de eerste of kleinste index van een element in de array die gelijk is aan de opgegeven waarde
 voor elke () 
Roept een functie aan voor elk element in de array
 toetreden () 
Voegt alle elementen van een array samen tot een string
 lastIndexOf () 
Retourneert de laatste of grootste index van een element in de array die gelijk is aan de opgegeven waarde
 kaart() 
Maakt een nieuwe array met de resultaten van het aanroepen van een opgegeven functie voor elk element in deze array
 Duwen() 
Voegt een of meer elementen toe aan het einde van een array en retourneert de nieuwe lengte van de array
 pop () 
Verwijdert het laatste element uit een array en retourneert dat element
 verminderen() 
Pas een functie gelijktijdig toe op twee waarden van de array van links naar rechts om deze terug te brengen tot één waarde
 reduceRight () 
Pas een functie tegelijkertijd toe op twee waarden van de array van rechts naar links om deze tot één waarde te reduceren
 omgekeerde() 
Keert de volgorde van de elementen van een array om
 verschuiving() 
Verwijdert het eerste element uit een array en retourneert dat element
 plak() 
Extraheert een sectie van een array en retourneert een nieuwe array
 sommige() 
Het retourneert waar als ten minste één element in deze array voldoet aan de opgegeven testfunctie
 soort() 
Het sorteert de elementen van een array
 toString () 
Retourneert een tekenreeks die de array en zijn elementen vertegenwoordigt
 splitsing () 
Het voegt elementen toe aan en / of verwijdert elementen uit een array
 onverschuiving () 
Voegt een of meer elementen toe aan de voorkant van een array en retourneert de nieuwe lengte van de array
 Voorbeeld: 
var name: Array = ['John', 'Daisy', 'Tara'] name.sort () console.log (naam) // output: ['Daisy', 'John', 'Tara'] console.log ( name.pop ()) // output: Tara name.push ('Rachel') console.log (naam) // output: ['John', 'Daisy', 'Rachel']
Laten we nu verder gaan met deze TypeScript-zelfstudie en leren over interfaces.
 TypeScript-interfaces 
De interface is een structuur die het contract in uw applicatie definieert. Het definieert de syntaxis voor klassen die moeten worden gevolgd. Het bevat alleen de verklaring van de leden en het is de verantwoordelijkheid van de afleidende klasse om de leden te definiëren.
 Voorbeeld: 
interface Werknemer {empID: nummer empName: string getSalary: (nummer) => nummer // pijl functie getManagerName (nummer): string}
In het bovenstaande voorbeeld is de Werknemer interface bevat twee eigenschappen empID en empName . Het bevat ook een methodeverklaring getSalaray met een pijl functie die een getalparameter en een getalretourtype bevat. De getManagerName methode wordt gedeclareerd met een normale functie.
 TypeScript  Klassen 
TypeScript heeft klassen geïntroduceerd zodat ze gebruik kunnen maken van de voordelen van objectgeoriënteerde technieken zoals inkapseling en abstractie. De klasse in TypeScript wordt door de TypeScript-compiler gecompileerd tot gewone JavaScript-functies om op verschillende platforms en browsers te werken.
Een les omvat het volgende:
 Bouwer 
 Eigendommen 
 Methoden 
 Voorbeeld: 
klasse Werknemer {empID: nummer empName: string constructor (ID: nummer, naam: string) {this.empName = naam this.empID = ID} getSalary (): nummer {retour 40000}}
 Erfenis 
TypeScript ondersteunt Erfenis omdat het de mogelijkheid is van een programma om nieuwe klassen te maken op basis van een bestaande klasse. De klasse die wordt uitgebreid om nieuwere klassen te maken, wordt de bovenliggende klasse of de superklasse genoemd. De nieuw gemaakte klassen worden de kind- of subklassen genoemd.
Een klasse erft van een andere klasse met het trefwoord ‘extends’. Onderliggende klassen nemen alle eigenschappen en methoden over, behalve privéleden en constructors van de bovenliggende klasse. Maar TypeScript ondersteunt geen meervoudige overerving.
 Syntaxis: 
class child_class_name breidt parent_class_name uit
 Voorbeeld: 
klasse Persoon {naam: string constructor (naam: string) {this.name = naam}} klasse Medewerker verlengt Persoon {empID: getal constructor (empID: nummer, naam: string) {super (naam) this.empID = empid} displayName (): void {console.log ('Name =' + this.name + ', Employee ID =' + this.empID)}} let emp = new Employee (701, 'Jason') emp.displayName () // Naam = Jason, werknemer-ID = 701
Nu u weet wat klassen zijn, gaan we verder met deze TypeScript-zelfstudie en leren we over objecten.
 Objecten in TypeScript 
Een object is een instantie die een andere set sleutelwaardeparen bevat. De waarden kunnen scalaire waarden of functies zijn, of zelfs een reeks andere objecten.
 Syntaxis: 
var object_name = {key1: 'waarde1', // scalaire waarde key2: 'waarde', key3: function () {// functies}, key4: ['content1', 'content2']
Een object kan scalaire waarden, functies en structuren bevatten, zoals arrays en tuples.
 Voorbeeld: 
var person = {firstname: 'Danny', lastname: 'Green'} // toegang tot de objectwaarden console.log (person.firstname) console.log (person.lastname)
Bij het compileren genereert het dezelfde code in JavaScript.
 Uitgang: 
Danny 
 Groen
Dit waren de verschillende belangrijke elementen van TypeScript. Laten we nu verder gaan met deze TypeScript-zelfstudie en een voorbeeld bekijken om de use case te begrijpen.
 TypeScript-zelfstudie: use case 
Hier zullen we leren hoe we een bestaand  naar TypeScript.
Wanneer we een TypeScript-bestand compileren, produceert het een overeenkomstig JavaScript-bestand met dezelfde naam. Hier moeten we ervoor zorgen dat ons originele JavaScript-bestand dat als invoer fungeert, niet in dezelfde map kan staan, zodat TypeScript ze niet overschrijft.
Het proces om van JavaScript naar TypeScript te migreren omvat de volgende stappen:
 1. voeg het tsconfig.json-bestand toe aan het project 
U moet een tsconfig.json-bestand aan het project toevoegen. TypeScript gebruikt een tsconfig.json-bestand voor het beheren van de compilatie-opties van het project, zoals welke bestanden u wilt opnemen en uitsluiten.
{'compilerOptions': {'outDir': './built', 'allowJs': true, 'target': 'es5'}, 'include': ['./src/**/*']}
 2. Integreer met een build-tool 
De meeste JavaScript-projecten hebben een geïntegreerde build-tool zoals gulp of webpack. U kunt projecten op de volgende manieren met webpack integreren:
Voer de volgende opdracht uit op de terminal:
$ npm installeer awesome-typescript-loader source-map-loader
Bij webpack-integratie gebruik je awesome-typescript-loader gecombineerd met source-map-loader voor eenvoudiger debuggen van broncode.
Ten tweede, voeg de module config-eigenschap samen in ons webpack.config.js-bestand om laders op te nemen.
 3. Verplaats alle .js-bestanden naar .ts-bestanden 
In deze stap moet u het .js-bestand hernoemen naar .ts-bestand. Evenzo, als het bestand JSX gebruikt, moet u het hernoemen naar .tsx. Als we dat bestand nu openen in een editor die TypeScript ondersteunt, kunnen sommige codes compilatiefouten gaan geven. Door bestanden één voor één te converteren, kunt u compilatiefouten gemakkelijker afhandelen. Als TypeScript compilatiefouten vindt tijdens de conversie, kan het de code nog steeds vertalen.
 4. Controleer op fouten 
Na het verplaatsen van het js-bestand naar het ts-bestand, zal TypeScript onmiddellijk beginnen met Type Checking van onze code. U kunt dus diagnostische fouten krijgen in de JavaScript-code.
 5. Gebruik JavaScript-bibliotheken van derden 
JavaScript-projecten gebruiken bibliotheken van derden, zoals  of Lodash. Om bestanden te compileren, moet TypeScript de typen van alle objecten in deze bibliotheken kennen. De TypeScript Type-definitiebestanden voor JavaScript-bibliotheken zijn al beschikbaar op DefinitelyTyped. Het is dus niet nodig om dit type extern te installeren. U hoeft alleen die typen te installeren die in ons project worden gebruikt.
Voor jQuery kunt u de definitie installeren:
$ npm install @ types / jquery
Breng hierna de wijzigingen aan in het JavaScript-project en voer de build-tool uit. Nu zou u het TypeScript-project moeten hebben gecompileerd in gewoon JavaScript dat in de browser kan worden uitgevoerd.
Hiermee zijn we aan het einde gekomen van deze TypeScript-zelfstudie. Ik hoop dat je alle belangrijke elementen van TypeScript hebt begrepen.
 Bekijk de     door Edureka.  Web Development Certification Training helpt u te leren hoe u indrukwekkende websites kunt maken met HTML5, CSS3, Twitter Bootstrap 3, jQuery en Google API's en deze kunt implementeren op Amazon Simple Storage Service (S3). 
 Heeft u een vraag voor ons? Vermeld het in het commentaargedeelte van 'TypeScript Tutorial' en we nemen zo spoedig mogelijk contact met u op.