TypeScript Oktatóanyag: Mi az interfész, az enum és a tömb?

Mi a TypeScript?

TypeScript egy szuperkészlete JavaForgatókönyv. TypeScript egy objektumorientált programozási nyelv, amely osztályokat, interfészeket és egyebeket támogat. Ez egy nyílt forráskódú nyelv, amelyet a ... fejlesztett ki. Microsoft amely statikusan lefordítja a kódot arra JavaSzkript. Könnyen futtatható böngészőben vagy Nodejs-ben.

Az ECMAScript összes legújabb funkciója támogatott TypeScript, és ezen felül TypeScript saját objektumorientált funkciókkal rendelkezik, mint például interfészek, környezeti deklarációk és osztályöröklés, amelyek segítik a fejlesztéstping egy nagyméretű alkalmazás, amelyet egyébként nehéz lenne beépíteni JavaForgatókönyv.

A kapcsolat egyirányú. Minden érvényes JavaA szkriptfájl már érvényes TypeScript, de fordítva nem igaz, mivel a típusannotációk csak a következőben léteznek: TypeScript és a fordítás során törlődnek.

Miért érdemes TypeScript?

Íme a használat fontos előnyei TypeScript:

• Nagy és összetett projektek JavaA szkriptet nehéz kódolni és karbantartani.
• TypeScript sokat segít a kód rendszerezésében, és a legtöbb hibát a fordítás során, nem pedig futásidőben távolítja el.
• TypeScript támogatja a JS könyvtárakat és az API dokumentációt.
• Ez egy opcionálisan típusos szkriptnyelv, így a típusok fokozatosan adaptálhatók.
• TypeScript a kód egyszerűvé alakítható JavaSzkriptkód bármely böngészőcélhoz.
• Jobb kódszerkezetet és objektumorientált programozási technikákat biztosít.
• Jobb fejlesztési idő alatt használható eszköztámogatást biztosít, beleértve az automatikus kiegészítést és a biztonságos refaktorálást.
• Kiterjesztheti a nyelvet a szabványon túl, olyan jellemzőkkel, mint a dekoratőrök.

A legnagyobb gyakorlati előny a szerkesztő támogatása. Mivel a fordító minden érték alakját ismeri, a szerkesztő átnevezhet egy tulajdonságot egy teljes projektben, és jelentheti az összes olyan helyet, amely már nem egyezik.

TypeScript Történelem

Nézzük meg a történelem fontosabb mérföldköveit TypeScript:

• Két év belső fejlesztés után at Microsoft, TypeScript A 0.9-es verzió 2013-ban jelent meg.
• TypeScript Az 1.0-s verzió, amely további támogatást nyújt a generikus gyógyszerekhez, a 2014-es Build kiadásban jelent meg.
• 2014 júliusában egy új TypeScript Megérkezett egy fordítóprogram, amely ötször gyorsabb volt az előző verziónál.
• 2015 júliusában támogatást adtak az ES6 modulokhoz, a namespace kulcsszóhoz, a for…of-hoz és a decorators-okhoz.
• 2016 novemberében hozzáadták a leképezett típusokat, a kulcs- és keresési típusokat, valamint az objektumok pihentetését és szétterítését.
• 2018. március 27-én feltételes típusok és továbbfejlesztett metszettípusú keyof került hozzáadásra.
• TypeScript A 2023 márciusában kiadott 5.0 modernizálta a dekoratőröket és csökkentette a csomag méretét.
• TypeScript A 6.0-s verzió 2026 márciusában érkezett meg, mint a ...-ra épülő utolsó kiadás. JavaSzkript kódbázis.
• TypeScript A 7.0 verzióban a fordítóprogram egy natív Go implementációra vált, amely Microsoft nagyjából tízszer gyorsabbnak jelenti, mint a 6.0.

Ki használ TypeScript?

TypeScript már nem réspiaci választás. Számos legszélesebb körben használt front-end és back-end eszköz alapját képezi, és az alábbi lista azt mutatja, hogy egy kezdő hol találkozhat vele a legnagyobb valószínűséggel.

• Szögletes: Az Angular keretrendszer nyelve: TypeScript, és várhatóan alkalmazáskódot is fognak benne írni.
• React és Vue projektek: Mindkét ökoszisztéma hivatalos hajó TypeScript sablonok, és a legtöbb modern indítóprogram alapértelmezés szerint engedélyezi.
• Node.js háttérrendszerek: A szerver keretrendszerek, mint például a NestJS, a következők köré épülnek: TypeScript osztályok és dekoratőrök.
• Szerkesztői eszközök: Visual Studio Code önmagában is egy nagy TypeScript kódbázis, ezért olyan teljes a nyelvi támogatása.
• Nagyvállalati kezelőfelületek: A sok közreműködővel dolgozó csapatok alkalmazzák, hogy a telepítés előtt kiszűrjék az integrációs hibákat.

Hogyan kell letölteni és telepíteni TypeScript

Íme a letöltési és telepítési folyamat lépésről lépésre TypeScript:

1. lépés) Töltse le és telepítse a Nodejs-t

Látogass el a Nodejs hivatalos oldalára, https://nodejs.org/en/download/, és töltse le és telepítse az operációs rendszeréhez tartozó Nodejs programot. Részletes utasításokat a következő útmutatóban talál: Hogyan töltsd le és telepítsd a Node.js-t?.

2. lépés) Ellenőrizze a Nodejs és az npm verziót

A Nodejs és az npm telepítettségének ellenőrzéséhez ellenőrizze a verziót a parancssorban.

D:\typeproject>node --version
v22.14.0

D:\typeproject>npm --version
10.9.2

Bármelyik jelenlegi Node LTS kiadás működik. TypeScript önmagában csak egy támogatott Node verziót igényel a fordító futtatásához.

Step 3) TypeScript Telepítés

Hozd létre a typeproject\ projektkönyvtárat, és futtasd az npm init parancsot az alábbi parancs szerint:

npm init

4. lépés) Indítsa el a telepítést

Ez létrehozza a package.json fájlt, amely a projektünk függőségeit fogja tárolni.

Ha kész, telepítse TypeScript az alábbiak szerint:

npm -g install typescript

A fenti parancs gondoskodik a telepítésről TypeScript. A „-g” hozzáadása az npm installhoz települ TypeScript globálisan. A -g használatának előnye, hogy a következőt használhatod: TypeScript tsc parancsot bármely könyvtárból, mivel globálisan telepítve van. Abban az esetben, ha nem szeretné telepíteni TypeScript globálisan, használd az alábbi parancsot:

npm install --save-dev typescript

Hozz létre egy src\ mappát a projektkönyvtáradban, és az src\ mappán belül hozd létre a TypeScript a test.t fájlt, és írja be a kódját.

Példa: test.ts

function add(x:number, y:number) {
	return x+y;
}

let sum = add(5,10);
console.log(sum);

Összeállít TypeScript kódot Javascript

A fenti kód lefordításához használd a következő parancsot.

If TypeScript globálisan telepítve van, használja az alábbi parancsot:

tsc test.ts

If TypeScript helyben van telepítve a projektedben, akkor a következő elérési utat kell használnod: TypeScript a node_modules-ból, ahogy az látható, vagy futtassa az npx-en keresztül:

node_modules\typescript\bin\tsc test.ts

OR

npx tsc test.ts

A fenti parancs létrehoz egy test.js fájlt, amelybe a kód le lesz fordítva. JavaForgatókönyv.

Példa: test.js

function add(x, y) {
    return x + y;
}
var sum = add(5, 10);
console.log(sum);

Végrehajt Javascript Nodejs használatával

Most a test.js-t fogjuk végrehajtani Nodejs-ben az alábbiak szerint:

D:\typeproject\src>node test.js
15

A console.log függvénynek átadott érték jelenik meg a test.js futtatásakor.

Végrehajt JavaSzkript a böngészőben

Példa:

<html>
<head></head>
<body>
<script type="text/javascript" src="test.js"></script>
</body>
</html>

Összeállít TypeScript kódot Javascript EcmaScript verzió használatával

TypeScript támogatja az összes kiadott ECMAScript funkciót, és a fejlesztők használhatják azokat kódolás közben. De nem minden új funkció támogatott régebbi böngészőkön, ezért előfordulhat, hogy az ECMAScript egy régebbi verziójára kell fordítani. TypeScript olyan fordítási lehetőségeket kínál, amelyek pontosan ezt teszik.

Példa: test.ts

var addnumbers = (a, b) => {
    return a+b;
}

addnumbers(10, 20);

A választott ES verzióra való fordításhoz a következőképpen használhatja a target vagy a t opciót a parancsban:

tsc --target ES6  test.ts

OR

tsc -t ES6 test.ts

Alapértelmezés szerint a cél az ES3 a klasszikus fordítóhoz. Ha meg szeretnéd változtatni, használhatod a fenti parancsot.

Jelenleg az ES6-ot fogjuk használni célként:

tsc --target ES6  test.ts

test.ts test.js

var addnumbers = (a, b) => {
    return a+b;
}

addnumbers(10, 20);

A kód változatlan marad, mivel a használt nyílfüggvény egy ES6 funkció, és változatlan marad az ES6-ra fordításkor.

Alapértelmezés szerint a cél az ES3, tehát cél nélkül a test.js fájlt a következőképpen kapjuk:

var addnumbers = function (a, b) {
    return a + b;
};
addnumbers(10, 20);

Tehát itt a vastag nyíl egy normál anonim függvénnyé változik.

Változók be TypeScript

Változók értékek tárolására szolgálnak, és az érték lehet karakterlánc, szám, logikai érték vagy kifejezés. Amikor a változókról van szó TypeScript, hasonlítanak a JavaForgatókönyvTanuljuk meg tehát, hogyan deklaráljunk és rendeljünk értéket változókhoz a TypeScript.

A változók nem használhatók kódban definiálás nélkül. Változó deklarálásához használhatja a következőt:

volt kulcsszó,

hadd kulcsszó

const kulcsszó

Munka változókkal TypeScript hasonló JavaSzkript, és a felhasználók, akik ismerik JavaA szkript nagyon könnyen fogja találni. A modern kódban, hadd és a const előnyben részesülnek a volt, mivel a blokk hatókörük egy egész hibaosztályt megakadályoz.

Változók deklarálása a var

Syntax:

var firstname = "Roy";

Vessünk egy pillantást néhányra TypeScript példák a var kulcsszó működésének megértéséhez, valamint a kulcsszóval deklarált változók hatókörének megértéséhez volt kulcsszó.

Példa 1:

var k = 1; // variable k will have a global scope

function test() {
    var c = 1; // variable c is local and accessible only inside function test
    return k++;
}

test(); // output as 1
test(); // output as 2
alert(c); // will throw error, Uncaught ReferenceError: c is not defined

Példa 2:

var t = 0; // variable t is declared in global scope
function test() {
    var t = 10; // t is redeclared inside the function, so changes stay local
    return t;
}
test(); // will return 10
console.log(t); // will console 0

Példa 3:

var i = 0;
function test() {
    if (i > 0) {
      var t = 1;
    }
    return t;
}

test(); // returns undefined. The if block did not run, yet t is still declared
        // because var declarations are hoisted to the whole function.
i++;    // value of i is incremented
test(); // since i > 0 the if block runs and the value returned is 1

Változók deklarálása let segítségével

Az TypeScript A let szintaxisa a következő:

Syntax:

let name = "Roy";

A működése a hadd változó majdnem ugyanaz, mint volt, de egy fontos különbséggel, amit az alábbi példa is szemléltet.

Példa:

let i = 1;
function test() {
    if (i > 0) {
	  let t = 1;
    }
    return t;
}

test(); // throws an error: Cannot find name 't'

A fenti TypeScript példa hibát dob, de ugyanaz a kód működött volna a következővel is: volt kulcsszó. A változók deklarálása a következővel történik: hadd csak abban a blokkban érhetők el, amelyben deklarálták őket. Ebben a példában a t csak az if blokkon belül létezik, nem az egész függvényben.

Ugyanez vonatkozik bármely függvényen belül, for cikluson, while cikluson vagy switch blokkon belül. Egy let változó csak az adott blokkon belül érhető el, és a blokkon kívüli hivatkozás hibát dob. Ez a fő különbség a var és a let között.

Változók deklarálása a const segítségével

A const konstans változókat jelent. Hasonlóak a let változókhoz, azzal a különbséggel, hogy ha egy érték egyszer hozzárendelődött, az már nem módosítható. Ezért a const deklarációt ugyanazon a sorban kell inicializálni.

Syntax:

const name = "Roy";

Példa:

const age = "25";
age = "30"; // error: Cannot assign to 'age' because it is a constant

const total; // error: 'const' declarations must be initialized

Tehát használd a const függvényt, amikor tudod, hogy a hozzárendelt érték nem kerül áthelyezésre. Fontos megjegyezni, hogy a const a kötés áthelyezését akadályozza meg, nem pedig a mutatott objektum módosítását.

Beír TypeScript

TypeScript erősen tipizált nyelv, míg JavaA szkript nem az. Egy karakterláncként definiált változó probléma nélkül számmá alakítható a következőben: JavaSzkript. Ugyanez nem megengedett a TypeScript. -ban TypeScript, a változó típusa a legelején definiálva van, és a végrehajtás során ezt a típust meg kell tartania. Bármilyen változás fordítási idejű hibához vezet a fordítás során. JavaForgatókönyv.

Az alábbiak az alapvető típusok:

Szám

Csak egész számokat, lebegőpontos számokat, törteket és hasonló numerikus értékeket fogad el.

Syntax:

let a :number = 10;
let marks :number = 150;
let price :number = 10.2;

Íme néhány fontos módszer, amelyek számtípusokon használhatók:

toFixed () – karakterlánccá alakítja a számot, és megőrzi a metódusnak adott tizedesjegyeket.

toString () – ez a metódus karakterlánccá alakítja a számot.

értéke () – ez a módszer visszaadja a szám primitív értékét.

Precision() – ezzel a módszerrel a szám meghatározott hosszúságúra formázható.

Példa: minden számmetódussal

let _num :number = 10.345;
_num.toFixed(2);      // "10.35"
_num.valueOf();      // 10.345
_num.toString();     // "10.345"
_num.toPrecision(2); // "10"

Húr

Karakterlánc: csak karakterlánc értékek.

Syntax:

let str :string = "hello world";

Íme néhány fontos metódus, amelyek karakterlánc típusokon használhatók:

• osztott() – ez a metódus a karakterláncot tömbre osztja.
• charAt() – ez a metódus a megadott indexű karaktert adja vissza.
• indexe() – ez a metódus a neki adott érték első előfordulásának pozícióját adja meg.
• cserélni() – ez a metódus 2 karakterláncot fogad el. Megkeresi a karakterlánc első értékét, és ha van ilyen, akkor a másodikra ​​cseréli, így egy új karakterláncot ad vissza.
• állapot() – ez a metódus eltávolítja a szóközöket a karakterlánc mindkét oldaláról.
• alstr() – ez a metódus a karakterlánc egy részét adja vissza, a kezdőpozíciótól és a megadott hossztól függően.
• szubsztring() – ez a metódus a karakterlánc egy részét adja vissza, a kezdő és a végpozíciótól függően. A végpozícióban lévő karaktert kizárja.
• toUpperCase() – nagybetűssé alakítja a karakterláncot.
• to LowCase() – a karakterláncot kisbetűssé alakítja.

Példa:

let _str:string = "Typescript";

_str.charAt(1);                // y
_str.split("");                // ["T","y","p","e","s","c","r","i","p","t"]
_str.indexOf("s");             // 4, gives -1 if the value does not exist
_str.replace("Type", "Coffee"); // "Coffeescript"
_str.trim();                    // "Typescript"
_str.substr(4, _str.length);   // "script"
_str.substring(4, 10);         // "script"
_str.toUpperCase();             // "TYPESCRIPT"
_str.toLowerCase();             // "typescript"

logikai

Egy logikai érték csak az igaz és hamis logikai értékeket fogadja el. A sima értékkel ellentétben JavaSzkriptben a 0 és az 1 számok nem elfogadottak, mivel szám típusúak.

Syntax:

let status :boolean = true;
let isDone :boolean = false;

let bflag :boolean = 1;
// error: Type 'number' is not assignable to type 'boolean'

Bármilyen

Syntax:

let a :any = 123
a = "hello world"; // changing type will not give any error.

A segítségével deklarált változók bármilyen A típus tartalmazhat karakterláncot, számot, tömböt, logikai értéket vagy void értéket. TypeScript nem dob fordítási idejű hibát, ami hasonló a változókhoz a JavaSzkript. Az „any” típust csak akkor használd, ha nem vagy biztos benne, hogy milyen típusú érték lesz társítva az adott változóhoz, mert ez kikapcsolja az adott érték minden ellenőrzését.

Üres

A void típust többnyire olyan függvények visszatérési típusaként használják, amelyek nem adnak vissza semmit.

Syntax:

function testfunc():void{
 //code here
}

TypeScript Sor

An Sor in TypeScript egy olyan adattípus, amelyben több értéket is tárolhatsz. Tanuljuk meg, hogyan deklarálhatunk és rendelhetünk értékeket tömbműveletekhez a TypeScript.

Óta TypeScript egy erősen tipizált nyelv, meg kell adni a tömbben lévő értékek adattípusát. Ellenkező esetben a tömb típusa „any”.

Tömb deklarálása és inicializálása

Syntax:

let nameofthearray : Array<typehere>

Példa

let months: Array<string> = ["Jan", "Feb", "March", "April", "May", "June", "July", "Aug", "Sept", "Oct", "Nov", "Dec"]; // array with all string values

let years: Array<number> = [2015, 2016, 2017, 2018, 2019]; // array with all numbers

let month_year: Array<string | number> = ["Jan", 2015, "Feb", 2016]; // mixed

let alltypes: Array<any> = [true, false, "Harry", 2000, { "a": "50", "b": "20" }]; // any type

Különböző módok az elemek elérésére egy tömbből

Egy tömb elemeinek kinyeréséhez az értékek a 0 indextől kezdődnek, és a tömb hosszának egytől való levonásáig tartanak.

let years: Array<number> = [2016, 2017, 2018, 2019];
years[0]; // output will be 2016
years[1]; // output will be 2017
years[2]; // output will be 2018
years[3]; // output will be 2019

Egy tömb elemeit egy TypeScript mert hurok, az alábbiak szerint.

<p></p> TypeScript hurokhoz

let years: Array<number> = [2016, 2017, 2018, 2019];
for (let i = 0; i < years.length; i++) {
     console.log(years[i]);
}

output:

2016
2017
2018
2019

For-in hurok használata

let years: Array<number> = [2016, 2017, 2018, 2019];
for (let i in years) {
     console.log(years[i]);
}

output:

2016
2017
2018
2019

For-of hurok használata

let years: Array<number> = [2016, 2017, 2018, 2019];
for (let i of years) {
     console.log(i);
}

output:

2016
2017
2018
2019

forEach ciklus használata

let years: Array<number> = [2016, 2017, 2018, 2019];
years.forEach(function(yrs, i) {
  console.log(yrs);
});

output:

2016
2017
2018
2019

TypeScript Tömb módszerek

Az TypeScript A tömb objektum számos tulajdonsággal és metódussal rendelkezik, amelyek segítik a fejlesztőket a tömbök egyszerű és hatékony kezelésében. Egy tulajdonság értékét az arrayname.property megadásával, egy metódus kimenetét pedig az arrayname.method() megadásával kaphatod meg.

Példa a hossz tulajdonságra

let months: Array<string> = ["Jan", "Feb", "March", "April", "May", "June", "July", "Aug", "Sept", "Oct", "Nov", "Dec"];

console.log(months.length);  // 12

Példa fordított módszerre

console.log(months.reverse());
// ["Dec","Nov","Oct","Sept","Aug","July","June","May","April","March","Feb","Jan"]

Példa a rendezési módszerre

console.log(months.sort());
// ["April","Aug","Dec","Feb","Jan","July","June","March","May","Nov","Oct","Sept"]

Példa a pop módszerre

console.log(months.pop()); // Dec

Példa a shift módszerre

console.log(months.shift()); // Jan

Példa push módszerre

let years: Array<number> = [2015, 2016, 2017, 2018, 2019];
console.log(years.push(2020)); // 6, the new length
years.forEach(function(yrs, i) {
  console.log(yrs); // 2015, 2016, 2017, 2018, 2019, 2020
});

Példa a concat módszerre

let array1: Array<number> = [10, 20, 30];
let array2: Array<number> = [100, 200, 300];
console.log(array1.concat(array2)); // [10, 20, 30, 100, 200, 300]

Osztály TypeScript

TypeScript egy szuperkészlete JavaSzkript, tehát bármi lehetséges benne JavaSzkript is lehetséges benne TypeScriptAz osztály egy ES6-tól kezdődően hozzáadott funkció. Korábban a JavaA szkriptszerű, osztályszerű funkcionalitást egy függvény prototípus metódusokkal való felhasználásával érték el a kód újrafelhasználásához. Az osztályok használatával a kódod közelíthet olyan nyelvekhez, mint a Java, C# és Python, ahol a kód könnyen újrafelhasználható.

Osztály meghatározása TypeScript

Itt található az osztály alapvető szintaxisa TypeScript:

class nameofclass {
     //define your properties here

    constructor() {
     // initialize your properties here
    }

   //define methods for class
}

Példa: Egy működő példa az osztályon

class Students {
    age : number;
    name : string;
    roll_no : number;

    constructor(age: number, name:string, roll_no: number) {
        this.age = age;
        this.name = name;
        this.roll_no = roll_no;
    }

    getRollNo(): number {
        return this.roll_no;
    }

    getName() : string {
        return this.name;
    }

    getAge() : number {
        return this.age;
    }
}

A fenti példában van egy Students nevű osztályod. A tulajdonságok a következők: age, name és roll_no.

Konstruktor a TypeScript Osztály

A fent definiált Students osztály konstruktora az alábbi:

constructor(age: number, name:string, roll_no: number) {
        this.age = age;
        this.name = name;
        this.roll_no = roll_no;
    }

A konstruktor metódus paraméterei a kor, név és roll_no. A konstruktor gondoskodik a tulajdonságok inicializálásáról, amikor az osztály példányosodik. A tulajdonságokhoz a következő segítségével lehet hozzáférni: ezt kulcsszó, például a this.age a kor eléréséhez és a this.roll_no a roll_no eléréséhez. Használhatsz egy alapértelmezett konstruktort is, ahogy az alább látható:

constructor () {}

Módszerek belül a TypeScript Osztály

A Students osztályban vannak definiálva metódusok, például a getRollNo(), getName() és getAge(), amelyek a roll_no, name és age tulajdonságok értékét adják vissza.

getRollNo(): number {
        return this.roll_no;
}

getName() : string {
	return this.name;
}

getAge() : number {
	return this.age;
}

Osztálypéldány létrehozása a következőben: TypeScript

In TypeScriptEgy osztály példányának létrehozásához a new operátort kell használnunk. Amikor a new operátorral hozunk létre egy példányt, kapunk egy objektumot, amely hozzáférhet az osztály tulajdonságaihoz és metódusaihoz, az alábbiak szerint:

let student_details = new Students(15, "Harry John", 33);
student_details.getAge();  // 15
student_details.getName(); // Harry John

Összeállítása TypeScript Osztály a JavaForgatókönyv

A tsc parancsot az alábbiak szerint használhatod a fordításhoz JavaForgatókönyv.

Command: tsc  Students.ts

A kimenet a JavaA fordításkor használt szkriptkód az alábbiak szerint alakul:

var Students = /** @class */ (function () {
    function Students(age, name, roll_no) {
        this.age = age;
        this.name = name;
        this.roll_no = roll_no;
    }
    Students.prototype.getRollNo = function () {
        return this.roll_no;
    };
    Students.prototype.getName = function () {
        return this.name;
    };
    Students.prototype.getAge = function () {
        return this.age;
    };
    return Students;
}());

In JavaSzkript, az osztály egy önmeghívott függvénnyé alakul.

Osztály öröklődés

Az osztályok örökölhetők a nyúlik kulcsszó be TypeScript.

Osztály öröklődés szintaxisa:

class A {
     //define your properties here

    constructor() {
     // initialize your properties here
    }

   //define methods for class

}

class B extends A {
 //define your properties here

    constructor() {
     // initialize your properties here
    }

   //define methods for class

}

B osztály megoszthatja majd A osztály módszerek és tulajdonságok.

Íme egy működő példa egy öröklődést használó osztályra:

class Person {
    name: string;
    age: number;

    constructor(name: string, age: number) {
        this.name = name;
        this.age = age;
    }

    getName(): string {
        return this.name;
    }

    getAge(): number {
        return this.age;
    }
}

class Student extends Person {
    tmarks: number;
    getMarks(): number {
        return this.tmarks;
    }

    setMarks(tmarks) {
        this.tmarks = tmarks;
    }
}

let _std1 = new Student('Sheena', 24);
_std1.getAge();      // output is 24
_std1.setMarks(500);
_std1.getMarks();    // output is 500

Két osztályod van, a Person és a Student. A Student kiterjeszti a Person osztályt, és a Student-ből létrehozott objektum hozzáférhet a saját metódusaihoz és tulajdonságaihoz, valamint a kiterjesztett osztályéhoz is.

Most adjunk hozzá néhány változtatást a fenti osztályhoz.

Példa:

class Person {
    name: string;
    age: number;

    constructor(name: string, age: number) {
        this.name = name;
        this.age = age;
    }

    getName(): string {
        return this.name;
    }

    getAge(): number {
        return this.age;
    }
}

class Student extends Person {
    tmarks: number;
    constructor(name: string, age: number, tmarks: number) {
        super(name, age);
        this.tmarks = tmarks; // the derived property must be assigned too
    }
    getMarks(): number {
        return this.tmarks;
    }

    setMarks(tmarks) {
        this.tmarks = tmarks;
    }
}

let _std1 = new Student('Sheena', 24, 500);
_std1.getAge();   // output is 24
_std1.getMarks(); // output is 500

Az előző példához képest a változás egy olyan konstruktor, amelyet a Student osztályban definiálunk. A konstruktor ugyanazokat a paramétereket veszi fel, mint az alaposztály, plusz a saját további paramétereit.

In TypeScript A super függvényt az összes alap osztály paraméterével kell meghívni. Ennek a konstruktoron belüli első utasításnak kell lennie, mivel a super a kiterjesztett osztály konstruktorát hajtja végre. A származtatott osztály által deklarált összes tulajdonságot, például a tmarks-ot, explicit módon kell értékadni, különben a getMarks definiálatlan értéket adna vissza.

Hozzáférés a módosítókhoz TypeScript

TypeScript támogatja a nyilvános, privát és védett hozzáférés-módosítókat a metódusokon és tulajdonságokon. Alapértelmezés szerint, ha nincs megadva hozzáférés-módosító, a metódus vagy tulajdonság nyilvánosnak tekintendő, és könnyen elérhető az osztály objektumából.

Privát hozzáférésű módosítók esetén a tagok nem érhetők el az osztály objektumából, és csak az osztályon belüli használatra szánták őket. Nem érhetők el egy örökölt osztály számára.

Védett hozzáférés-módosítók esetén a tagok az osztályon és az örökölt osztályon belüli használatra szolgálnak, és nem érhetők el az osztály objektumából.

Példa:

class Person {
    protected name: string;
    protected age: number;

    constructor(name: string, age: number) {
        this.name = name;
        this.age = age;
    }

    private getName(): string {
        return this.name;
    }

    getDetails(): string {
        return "Name is " + this.getName();
    }
}

class Student extends Person {
    tmarks: number;
    constructor(name: string, age: number, tmarks: number) {
        super(name, age);
        this.tmarks = tmarks;
    }
    getMarks(): number {
        return this.tmarks;
    }

    getFullName(): string {
        return this.name;
    }

    setMarks(tmarks) {
        this.tmarks = tmarks;
    }
}

let _std1 = new Student('Sheena', 24, 500);
_std1.getMarks();    // output is 500
_std1.getFullName(); // output is Sheena
_std1.getDetails();  // output is Name is Sheena

Interfész be TypeScript

Az egyik alapvető jellemzője TypeScript az interfészek. Az interfész egy szabályhalmaz, amelyet az azt használó entitásnak kell megvalósítania. Az entitás lehet osztály, függvény vagy változó. Egy interfész tulajdonságokból és metódusokból állhat. Egy tulajdonságot vagy metódust opcionálisként jelölhetünk meg a „?” szintaxis használatával. Az interfész egy erős típusellenőrzést ad hozzá minden függvényhez, változóhoz vagy osztályhoz, amely megvalósítja.

Egy interfész szintaxisa in TypeScript

interface Dimension {
    width: string;
    height: string;
}

Definiáltál egy Dimension nevű interfészt, amelynek a width és height tulajdonságai vannak, mindkettő karakterlánc típusú.

Ez az interfész most megvalósítható egy változóval, egy függvénnyel vagy egy osztállyal. Íme egy példa egy változóra, amely megvalósítja a Dimension interfészt.

Példa:

interface Dimension {
    width: string;
    height: string;
}

let _imagedim: Dimension = {
    width: "100px",
    height: "200px"
};

A Dimension interfész szignatúrája szélességgel és magassággal rendelkezik, és mindkettő kötelező. Ha bármelyik tulajdonság kimarad, vagy egy típus megváltozik, fordítási idejű hibát kap a kód fordításakor. JavaForgatókönyv.

A fenti kód, amikor lefordítottuk JavaA szkript a következőképpen néz ki:

var _imagedim = {
    width: "100px",
    height: "200px"
};

Nézzük most meg, hogyan használjunk egy interfészt egy funkcióval.

Interface használata egy függvényen visszatérési típusként

interface Dimension {
    width: string;
    height: string;
}

function getDimension() : Dimension {
    let width = "300px";
    let height = "250px";
    return {
        width: width,
        height: height
    }
}

A fenti példában a getDimension() függvény visszatérési típusa a Dimension interfész. A visszatérési értéknek meg kell egyeznie az interfészben deklarált tulajdonságokkal és típusokkal.

Az összeállított JavaA szkript kódja a következő lesz:

function getDimension() {
    var width = "300px";
    var height = "250px";
    return {
        width: width,
        height: height
    };
}

Fordítás során, ha a visszatérési típus nem egyezik meg az interfész típusával, hibát dob.

Interfész mint függvényparaméter

interface Dimension {
    width: string;
    height: string;
}

function getDimension(dim: Dimension) : string {
    let finaldim  = dim.width + "-" + dim.height;
    return finaldim;
}

getDimension({width:"300px", height:"250px"}); // "300px-250px"

A fenti példában a Dimension interfészt a getDimension() függvény paramétereként használtad. A függvény meghívásakor az átadott paraméternek meg kell egyeznie az interfész által definiált szabályokkal.

Az összeállított JavaA szkript kódja a következő lesz:

function getDimension(dim) {
    var finaldim = dim.width + "-" + dim.height;
    return finaldim;
}
getDimension({ width: "300px", height: "250px" });

Interfész megvalósítására szolgáló osztály

Egy osztályhoz tartozó interfész használatához a kulcsszót kell használnod. munkagépek.

Egy interfészt megvalósító osztály szintaxisa:

class NameofClass implements InterfaceName {
}

A következő példa egy osztályokkal működő interfészt mutat be.

interface Dimension {
    width : string,
    height: string,
    getWidth(): string;
}

class Shapes implements Dimension {
    width: string;
    height: string;
    constructor (width:string, height:string) {
        this.width = width;
        this.height = height;
    }
    getWidth() {
        return this.width;
    }
}

A fenti példában definiáltad a Dimension interfészt a width és height tulajdonságokkal, mindkettő string típusú, valamint egy getWidth() nevű metódust, amely egy karakterláncot ad vissza.

Az összeállított JavaA szkript kódja a következő lesz:

var Shapes = /** @class */ (function () {
    function Shapes(width, height) {
        this.width = width;
        this.height = height;
    }
    Shapes.prototype.getWidth = function () {
        return this.width;
    };
    return Shapes;
}());

Funkciók be TypeScript

A függvények utasítások halmazai, amelyeket egy feladat végrehajtásához hajtanak végre. JavaSzkript, a kód nagy része függvények formájában íródik, és ezek fontos szerepet játszanak. A TypeScript Vannak elérhető osztályaid, interfészeid, moduljaid és névtereid, de a függvények továbbra is fontos szerepet játszanak. A különbség egy függvény és egy JavaScript és TypeScript a paraméter és a visszatérési típusok elérhetők egy TypeScript funkciót.

JavaSzkript funkció:

function add (a1, b1) {
   return a1+b1;
}

TypeScript funkció:

function  add(a1 : number, b1: number) : number {
    return a1 + b1;
}

A fenti függvényben a függvény neve összeadás, a paraméterek pedig a következők: a1 és a b1, mindkettő szám típusú, és a visszatérési típus is szám. Ha karakterláncot adsz át a függvénynek, akkor fordítási idejű hibát dob ​​a fordítás során. JavaForgatókönyv.

A függvény hívása: add

let x = add(5, 10);   // will return 15
let b = add(5);       // error TS2554: Expected 2 arguments, but got 1
let c = add(3,4,5);   // error TS2554: Expected 2 arguments, but got 3
let t = add("Harry", "John");
// error TS2345: Argument of type 'string' is not assignable to parameter of type 'number'

A paraméterek a1 és a b1 kötelezőek, és hibát okoznak, ha nem adják meg őket. A paramétertípusok és a visszatérési típus egyformán fontosak, és definiálásuk után nem változhatnak.

Opcionális paraméterek egy függvényhez

In JavaSzkript esetén a függvények összes paramétere opcionális, és ha nem adjuk át őket, akkor nem definiáltnak tekintjük őket. Ugyanez nem igaz a következő esetekben: TypeScriptMiután definiálta a paramétereket, meg kell adnia azokat. Ha opcionális paramétert szeretne, tegyen egy kérdőjelet a paraméter neve után, az alábbiak szerint:

function getName(firstname: string, lastname?: string): string {
    return firstname + lastname;
}

let a = getName("John");              // returns Johnundefined
let b = getName("John", "Harry");     // returns JohnHarry
let c = getName("John", "H", "Harry"); // error TS2554: Expected 1-2 arguments, but got 3

Kérjük, vegye figyelembe, hogy az opcionális paramétereket utoljára kell definiálni. Nem lehet az első paraméter opcionális, a második pedig kötelező, mert a fordító nem tudná, melyik értéket adtuk meg.

Rendeljen hozzá alapértelmezett értékeket a paraméterekhez

Az alábbiak szerint rendelhet alapértelmezett értékeket a paraméterekhez:

function getName(firstname: string, lastname = "Harry"): string {
    return firstname + lastname;
}

let a = getName("John");      // will return JohnHarry
let b = getName("John", "H"); // will return JohnH

Az opcionális paraméterekhez hasonlóan az alapértelmezett inicializált paramétereket is a paraméterlista végén kell tartani.

Nyugalmi paraméterek

Láttad, hogyan TypeScript kezeli a kötelező paramétereket, az opcionális paramétereket és az alapértelmezett érték paramétereket. Most a többi paramétert fogjuk megvizsgálni. A többi paraméter opcionális paraméterek csoportja, amelyeket együttesen definiálunk, három pontok (…) majd a paraméter neve, ami egy tömb.

A nyugalmi paraméterek szintaxisa:

function testFunc(a: string, ...arr: string[]) :string {
    return a + arr.join("");
}

A fentiekből látható, hogy a rest paraméter egy három ponttal előtagolt tömb. A tömb fogja tartalmazni a függvénynek átadott összes többi argumentumot.

Példa:

let a = testFunc("Monday", "Tuesday", "Wednesday", "Thursday");
// output is MondayTuesdayWednesdayThursday

Nyíl funkciók

A nyíl funkció az egyik fontos ES6-ban kiadott funkció, és elérhető TypeScript is. A szintaxisban van egy vastag nyíl, innen ered a név.

Nyíl függvény szintaxisa:

var nameoffunction = (params) => {
 // code here
}

Mire jó egy nyílfüggvény?

Nézzünk egy példát, hogy megértsük egy nyílfüggvény használati esetét.

Példa:

var ScoreCard = function () {
    this.score = 0;

    this.getScore = function () {
        setTimeout(function () {
            console.log(this.score);    // gives undefined
        }, 1000);
    }
}

var a = new ScoreCard();
a.getScore();

Létrehoztál egy függvényt, amelynek a score tulajdonsága 0-ra van inicializálva, valamint egy getScore metódust, amely belsőleg a setTimeout metódust használja, és egy másodperc múlva naplózza a this.score függvényt. A naplózott érték nincs definiálva, annak ellenére, hogy a this.score definiálva és inicializálva van. A probléma a következővel van: ezt kulcsszó. A setTimeout függvényen belüli függvénynek saját this attribútuma van, és mivel a score nincs definiálva rajta, az eredmény is definiálatlan.

Ugyanez kezelhető egy nyílfüggvénnyel is, az alábbiak szerint:

var ScoreCard = function () {
    this.score = 0;

    this.getScore = function () {
        setTimeout(() => {
            console.log(this.score);   // you get 0
        }, 1000);
    }
}

var a = new ScoreCard();
a.getScore();

Egy nyílfüggvénynek nincs sajátja ezt, és ehelyett megosztja az egyet a szülő hatóköréből, így a kívül deklarált változók elérhetők ezzel egy arrow függvényen belül. Hasznosak a rövidebb szintaxis, valamint a visszahívások, eseménykezelők és időzítő függvények miatt.

TypeScript Enums

A TypeScript Az enum egy objektum, amely összefüggő értékek gyűjteményét tárolja együtt. JavaA szkriptek nem támogatják natívan az enumerálásokat. A legtöbb programozási nyelv, mint például a Java, C és C++ támogatási felsorolások, és TypeScript is elérhetővé teszi őket. Az enumerálások az enum kulcsszóval definiálhatók.

Hogyan kell enumot bejelenteni?

Syntax:

enum NameofEnum {
   value1,
   value2,
    ..
}

Példa: Enum

enum Directions {
    North,
    South,
    East,
    West
}

A fenti példában definiált egy Directions nevű enumerációt az Észak, Dél, Kelet és Nyugat értékekkel. Az értékek az első bejegyzésnél 0-tól vannak számozva, és minden további bejegyzésnél 1-gyel nőnek.

Numerikus értékű enum deklarálása

Alapértelmezés szerint, ha egy enumerációs tag nem kap értéket, akkor egy 0-tól kezdődő számot vesz fel. A következő példa egy explicit numerikus értékekkel rendelkező enumerációt mutat be.

enum Directions {
North = 0,
South = 1,
East = 2,
West = 3
}

Megadhatsz egy kezdőértéket is, és a következő tagok növekvő értékeket kapnak. Például:

enum Directions {
North = 5,
South, // will be 6
East,  // 7
West   // 8
}

Most Észak 5-nél kezdődik, tehát Dél 6, Kelet 7, Nyugat pedig 8.

Az alapértelmezett értékek helyett tetszőleges értékeket is megadhat. Például:

enum Directions {
North = 5,
South = 4,
East = 6,
West = 8
}

Hogyan lehet elérni egy Enumot?

A következő példa bemutatja, hogyan használhatsz enumerációt a kódodban:

enum Directions {
    North,
    South,
    East,
    West
}

console.log(Directions.North);      // output is 0
console.log(Directions["North"]); // output is 0
console.log(Directions[0]);       // output is North

Az összeállított JavaA szkript a következő:

var Directions;
(function (Directions) {
    Directions[Directions["North"] = 0] = "North";
    Directions[Directions["South"] = 1] = "South";
    Directions[Directions["East"] = 2] = "East";
    Directions[Directions["West"] = 3] = "West";
})(Directions || (Directions = {}));
console.log(Directions.North);
console.log(Directions["North"]);
console.log(Directions[0]);

Óta JavaA szkript nem támogatja az enumokat, a fordító az enumot egy önmeghívott függvénnyé alakítja, ahogy fentebb látható. A dupla értékadás hozza létre a fordított leképezést.ping a számtól vissza a névig.

Enum deklarálása karakterlánc értékkel

Tetszőleges karakterlánc-értékeket rendelhet hozzá, ahogy az az alábbi példában látható.

Példa:

enum Directions {
    North = "N",
    South = "S",
    East = "E",
    West = "W"
}

console.log(Directions.North);      // output is N
console.log(Directions["North"]); // output is N
console.log(Directions[0]);       // output is undefined

Az összeállított JavaA szkript a következő:

var Directions;
(function (Directions) {
    Directions["North"] = "N";
    Directions["South"] = "S";
    Directions["East"] = "E";
    Directions["West"] = "W";
})(Directions || (Directions = {}));
console.log(Directions.North);
console.log(Directions["North"]);
console.log(Directions[0]);

Miben vannak a modulok TypeScript?

Létrehozott fájlok TypeScript globális hozzáféréssel rendelkeznek, ami azt jelenti, hogy az egyik fájlban deklarált változókhoz egy másik fájlból is hozzá lehet férni. Ez a globális jelleg kódütközéseket és futásidejű problémákat okozhat. Az export és import modul funkcióival elkerülhetők a globális változók és függvények ütközései. Ez a funkció a következő évben jelent meg: JavaSzkript az ES6 kiadással, és a következő verziókban is támogatott: TypeScript.

Miért van szükség modulokra? TypeScript?

A következő példa modulok nélküli problémát mutat be.

Példa teszt1.ts

let age : number = 25;

A test1.ts fájlban definiált egy változó korú típusszámot.

Példa teszt2.ts

A test2.ts fájlban hozzáférhetsz a változóhoz kor a test1.ts fájlban definiált, és módosítsa is az alábbiak szerint:

age = 30; // changed from 25 to 30.
let _new_age = age;

Ez sok problémát okozhat, mivel a változók globálisan elérhetők és bárhonnan módosíthatók.

A modulok, a megírt kód lokális marad a fájlban, és azon kívül nem érhető el. Ahhoz, hogy bármit is megosszunk egy fájlból, azt exportálni kell az export kulcsszó használatával. Export akkor használatos, ha egy változót, osztályt, függvényt vagy interfészt egy másik fájlban szeretnénk használni. import akkor használatos, ha egy exportált elemhez szeretne hozzáférni. Így a kód érintetlen marad a fájlon belül, és még ha ugyanazokat a változóneveket definiálja is, azok nem keverednek össze.

Exportálás és importálás használata

Sokféleképpen lehet exportálni és importálni. A leggyakrabban használt szintaxist fogjuk megvitatni.

Az importálás és az exportálás szintaxisa 1:

export  nameofthevariable or class name or interface name etc

//To import the above variable or class name or interface you have to use import as shown below:

import {nameofthevariable or class name or interfacename} from "file path here without .ts"

Íme egy működő példa az exportálás és importálás használatára.

teszt1.ts

export let age: number = 25;

Az export kulcsszóval megoszthatjuk az age változót egy másik fájllal.

teszt2.ts

import { age } from "./test1"
let new_age :number = age;

Az import kulcsszóval lehet elérni a kor változót, és meg kell adnia a fájl helyét a fent látható módon.

Az import és export szintaxisa 2:

Van egy másik módja is az exportálásnak és importálásnak, a szintaxis az alábbiak szerint alakul:

export = classname;

import classname = require("file path of modulename")

Amikor használ export = A modul exportálásához az importáláshoz a require(„modulnév fájl elérési útja”) függvényt kell használni.

Íme egy működő példa, amely bemutatja az esetet.

Ügyfél.ts

class Customer {
    name: string;
    age: number;

    constructor(name: string, age: number) {
        this.name = name;
        this.age = age;
    }

    getName(): string {
        return this.name;
    }
}

export = Customer;

testCustomer.ts

import Customer = require("./Customer");

let a = new Customer("Harry", 30);
alert(a.getName());

Modul betöltő

A modulok nem tudnak önállóan működni, ezért egy modulbetöltőre van szükség az importfüggőségek megtalálásához, ahogy az a példában is látható. TypeScript a fenti példákban. Az elérhető modulbetöltők a CommonJS a Nodejs-hez és a Require.js a böngészőben való futtatáshoz.

A CommonJS modulformátum használatával történő kódfordításhoz használja a következő parancsot:

tsc --module commonjs testCustomer.ts

A Requirejs modulformátum használatával történő kódfordításhoz használja a következő parancsot:

tsc --module amd testCustomer.ts

A függő fájlokat a fenti paranccsal js fájlokká konvertáljuk.

Példa a testCustomer.ts fájlról a testCustomer.js fájlra Requirejs használatával

define(["require", "exports", "./Customer"], function (require, exports, Customer) {
    "use strict";
    exports.__esModule = true;
    var a = new Customer("Harry", 30);
    alert(a.getName());
});

Példa Customer.ts konverzióra Customer.js-re Requirejs használatával

define(["require", "exports"], function (require, exports) {
    "use strict";
    var Customer = /** @class */ (function () {
        function Customer(name, age) {
            this.name = name;
            this.age = age;
        }
        Customer.prototype.getName = function () {
            return this.name;
        };
        return Customer;
    }());
    return Customer;
});

A require.js használatával történő teszteléséhez létre kell hoznod egy main.js nevű fájlt, amely a függőségekre hivatkozik az ábrán látható módon.

Íme a mappa szerkezete:

src/
    Customer.js
    testCustomer.js
    main.js
    require.js  // you can get this file from github or npm install requirejs
    test.html

main.js

define(function (require) {
    var customer = require("./Customer");
    var testCustomer = require("./testCustomer");
});

test.html

<!DOCTYPE html>
<html>
<head>
    <title>TypeScript Module testing using Requirejs</title>
    <script data-main="main" src="require.js"></script>
</head>
<body>
    <h3>Testing modules using Requirejs</h3>
</body>
</html>

Névterek be TypeScript

A névtér osztályok, interfészek, változók és függvények gyűjteményét tartalmazza egyetlen fájlban.

Névtér szintaxis

namespace name{

export class {
}

export interface {
}

export const constname;

}

A kapcsolódó kód egyetlen névtér alatt érhető el.

Névtér működési példa: tesztnévtér.ts

namespace StudentSetup {

    export interface StudDetails {
        name: string;
        age: number;
    }

    export function addSpace(str) { // will add space to the string given
        return str.split("").join(" ");
    }

    export class Student implements StudDetails {
        name: string;
        age: number;

        constructor(studentdetails: StudDetails) {
            this.name = studentdetails.name;
            this.age = studentdetails.age;
        }

        getName(): string {
            return this.name;
        }
    }
}

A névtér neve Diákbeállítás, és hozzáadtál egy StudDetails interfészt, egy addSpace függvényt és egy Student nevű osztályt.

Névtér elérése

A következő kódrészletben használod a névteret Diákbeállítás.

testStudentSetup.ts

let a = new StudentSetup.Student({ name: "Harry", age: 20 });

console.log("The name is :" + StudentSetup.addSpace(a.getName()));

A névtérben elérhető osztályra, interfészre vagy függvényre a névtér nevével kell hivatkozni, például StudentSetup.addSpace a funkció eléréséhez és StudentSetup.Student az osztály eléréséhez.

Mindkét fájlt egyetlen js fájlba fordíthatod az alábbiak szerint:

tsc --outFile namespace.js testnamespace.ts  testStudentSetup.ts

Ellenőrizd a parancssor kimenetét az alábbi paranccsal:

node namespace.js

output:

The name is :H a r r y

Környezeti nyilatkozatok be TypeScript

TypeScript lehetővé teszi harmadik féltől származó eszközök használatát JavaKörnyezeti deklarációkat használó szkriptfájlok. Ennek a funkciónak az az előnye, hogy nem kell átírni a könyvtárat, mégis használhatod az összes funkcióját típusellenőrzéssel. TypeScript.

Ambient szintaxis

Egy ambient modul deklarálásához:

declare module moduleName {
   //code here
}

Az ambient fájlt a következőképpen kell menteni:

filename.d.ts

A fájl használatához fájlnév.d.ts a .ts fájlodban a következőképpen kell hivatkoznod rá:

/// <reference path="filename.d.ts"/>

A környezeti típus deklarációja TypeScript harmadik féltől származó könyvtárra hivatkozik, és a szükséges függvényeket saját típusokkal újradeklarálja. Vegyük például a kis JavaAz alább látható szkriptkönyvtár.

Harmadik fél JavaSzkriptfájl: testString.js

var StringChecks = {
    isString: function (str) {
        return typeof str === "string";
    },

    convertToUpperCase: function (str) {
        return str.toUpperCase();
    },

    convertToLowerCase: function (str) {
        return str.toLowerCase();
    },

    convertToStringBold: function (str) {
        return str.bold();
    }
};

Van egy StringChecks nevű objektumod, amelynek az isString, convertToUpperCase, convertToLowerCase és convertToStringBold függvényei vannak.

Ambient modul létrehozása TypeScript

Most létrehozunk egy ambient modult, amely hivatkozik a JavaA fenti szkriptfüggvényeket használja, és szükség szerint típusellenőrzéseket ad hozzá.

Fájlnév: tstring.d.ts

declare module TestString {

    export interface StringsFunc {
        isString(str: string): boolean;
        convertToUpperCase(str: string): string;
        convertToLowerCase(str: string): string;
        convertToStringBold(str: string): string;
    }
}

declare var StringChecks: TestString.StringsFunc;

Definiálsz egy TestString nevű modult, és exportálod a StringsFunc interfészt. Minden egyes szignatúra meghatározza, hogy mit fogad el és mit ad vissza a függvény:

• isString(str: string): logikai érték – egy karakterláncot vesz fel és egy logikai értéket ad vissza. Szám vagy bármilyen más típus átadása fordítási idejű hibát okoz.
• konvertNagyCase-re(string: string): string – egy karakterláncot vesz fel és egy karakterlánccal tér vissza.
• konvertKisCase-re(string: string): string – egy karakterláncot vesz fel és egy karakterlánccal tér vissza.
• convertToStringBold(str: string): karakterlánc – egy karakterláncot vesz fel és egy karakterlánccal tér vissza.

Mivel a JavaA szkriptfájlban elérhető a StringChecks objektumnév, végül a .d.ts fájlban is erre a névre hivatkozunk:

declare var StringChecks: TestString.StringsFunc;

Ambient modul használata TypeScript

Itt található a test.ts fájl, amely a tstring.d.ts környezeti fájlt használja.

/// <reference path="tstring.d.ts"/>
let str1 = StringChecks.isString("Hello World");
console.log(str1);
let str2 = StringChecks.convertToUpperCase("hello world");
console.log(str2);
let str3 = StringChecks.convertToLowerCase("HELLO");
console.log(str3);
let str4 = StringChecks.convertToStringBold("Hello World");
console.log(str4);

Fordítsd le a tsc test.ts segítségével a test.js létrehozásához:

/// <reference path="tstring.d.ts"/>
var str1 = StringChecks.isString("Hello World");
console.log(str1);
var str2 = StringChecks.convertToUpperCase("hello world");
console.log(str2);
var str3 = StringChecks.convertToLowerCase("HELLO");
console.log(str3);
var str4 = StringChecks.convertToStringBold("Hello World");
console.log(str4);

Mostantól a test.js függvénykönyvtárat egy HTML fájlban használhatod a testString.js függvénykönyvtárfájllal együtt.

<html>
<head>
    <title>Test TypeScript Ambient</title>
    <script src="testString.js"></script>
    <script src="test.js"></script>
</head>
<body>
</body>
</html>

output:

true
HELLO WORLD
hello
<b>Hello World</b>

A folytatáshoz hasonlítsa össze közvetlenül a két nyelvet TypeScript vs JavaForgatókönyv, látogasson el újra JavaSzkript tömbmetódusok az itt használt, típus nélküli megfelelőkért, és tanulmányozza hurkok be JavaForgatókönyv és a belső és külső JavaForgatókönyv a böngésző alapjaihoz, amelyekre a fordított kimenet támaszkodik.

GYIK