TypeScript Handledning
Komma igång med TypeScript

Anmärkningar

versioner

Installation och installation

Bakgrund

TypeScript är ett typiskt superset av JavaScript som sammanställs direkt till JavaScript-kod. TypScript-filer använder vanligen .ts förlängningen. Många IDE: er stöder TypeScript utan någon annan installation krävs, men TypeScript kan också kompileras med TypeScript Node.JS-paketet från kommandoraden.

Idus

Visuell Studio

• Visual Studio 2015 innehåller TypeScript.
• Visual Studio 2013 Update 2 eller senare innehåller TypeScript, eller så kan du ladda ner TypeScript för tidigare versioner .

Visual Studio Code

• Visual Studio Code (vscode) tillhandahåller kontextuell autokomplettering samt refactoring och felsökningsverktyg för TypeScript. vscode implementeras själv i TypeScript. Finns för Mac OS X, Windows och Linux.

WebStorm

• WebStorm 2016.2 levereras med TypeScript och en inbyggd kompilator. [Webstorm är inte gratis]

IntelliJ IDEA

• IntelliJ IDEA 2016.2 har stöd för Typescript och en kompilator via en plugin som upprätthålls av Jetbrains-teamet. [IntelliJ är inte gratis]

Atom- och atom-typskript

• Atom stöder TypeScript med atom-script- paketet.

Sublim text

• Sublime Text stöder TypeScript med typskriptpaketet .

Installera kommandoradsgränssnittet

Installera Node.js

Installera npm-paketet globalt

Du kan installera TypeScript globalt för att få åtkomst till det från valfri katalog.

npm install -g typescript

eller

Installera paketet npm lokalt

Du kan installera TypeScript lokalt och spara i package.json för att begränsa till en katalog.

npm install typescript --save-dev

Installationskanaler

Du kan installera från:

• Stabil kanal: npm install typescript
• npm install typescript@beta : npm install typescript@beta
• Dev-kanal: npm install typescript@next

Kompilering av TypeScript-kod

tsc kompilering kommer med typescript , som kan användas för att sammanställa kod.

tsc my-code.ts

Detta skapar en my-code.js fil.

Kompilera med hjälp av tsconfig.json

Du kan också tillhandahålla sammanställningsalternativ som reser med din kod via en tsconfig.json fil. För att starta ett nytt TypeScript-projekt, cd i projektets rotkatalog i ett terminalfönster och kör tsc --init . Detta kommando genererar en tsconfig.json fil med minimala konfigurationsalternativ, liknande nedan.

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": false,
        "sourceMap": false,
        "pretty": true
    },
    "exclude": [
        "node_modules"
    ]
}

Med en tsconfig.json fil placerad i roten till ditt TypeScript-projekt kan du använda kommandot tsc att köra kompilering.

Hej världen

class Greeter {
    greeting: string;

    constructor(message: string) {
        this.greeting = message;
    }
    greet(): string {
        return this.greeting;
    }
};

let greeter = new Greeter("Hello, world!");
console.log(greeter.greet());

Här har vi en klass, Greeter , som har en constructor och en greet . Vi kan konstruera en instans av klassen med det new nyckelordet och skicka i en sträng som vi vill att greet ska matas ut till konsolen. Instansen av vår Greeter klass lagras i greeter variabeln som vi sedan kallar greet .

Grundläggande syntax

TypeScript är ett typiskt superset av JavaScript, vilket innebär att all JavaScript-kod är giltig TypeScript-kod. TypeScript lägger till många nya funktioner ovanpå det.

TypeScript gör JavaScript mer som ett starkt, objektorienterat språk som liknar C # och Java. Detta innebär att TypeScript-koden tenderar att vara enklare att använda för stora projekt och att koden tenderar att vara lättare att förstå och underhålla. Den starka typen innebär också att språket kan (och är) förkompileras och att variabler inte kan tilldelas värden som ligger utanför deras deklarerade intervall. När en TypeScript-variabel exempelvis deklareras som ett nummer kan du inte tilldela ett textvärde till den.

Denna starka typ och objektorientering gör TypeScript lättare att felsöka och underhålla, och det var två av de svagaste punkterna i standard JavaScript.

Typdeklarationer

Du kan lägga till typdeklarationer till variabler, funktionsparametrar och funktionsreturtyper. Typen är skriven efter en kolon efter variabelns namn, så här: var num: number = 5; Kompilatorn kommer sedan att kontrollera typerna (där det är möjligt) under kompilering och rapporteringstypfel.

var num: number = 5;
num = "this is a string";  // error: Type 'string' is not assignable to type 'number'.

De grundläggande typerna är:

• number (både heltal och flytande punktnummer)
• string
• boolean
• Array . Du kan ange vilka typer av arrayelement. Det finns två likvärdiga sätt att definiera matristyper: Array<T> och T[] . Till exempel:
  • number[] - matris med siffror
  • Array<string> - matris av strängar
• Tupler. Tuples har ett fast antal element med specifika typer.
  • [boolean, string] - tupel där det första elementet är en boolean och det andra är en sträng.
  • [number, number, number] - tupel med tre siffror.
• {} - objekt, du kan definiera dess egenskaper eller indexerare
  • {name: string, age: number} - objekt med namn och åldersattribut
  • {[key: string]: number} - en ordlista med siffror indexerade med sträng
• enum - { Red = 0, Blue, Green } - uppräkning mappad till siffror
• Fungera. Du anger typer för parametrar och returvärde:
  • (param: number) => string - funktion som tar en nummerparameter som returnerar sträng
  • () => number - funktion utan parametrar som returnerar ett nummer.
  • (a: string, b?: boolean) => void - funktion som tar en sträng och valfritt en boolean utan återvärdevärde.
• any - Tillåter vilken typ som helst. Uttryck som involverar any är inte typkontrollerade.
• void - representerar "ingenting", kan användas som ett funktionsreturvärde. Endast null och undefined är en del av void .
• never
  • let foo: never; -Som typen av variabler under typskydd som aldrig är sanna.
  • function error(message: string): never { throw new Error(message); } - Som returtyp av funktioner som aldrig återgår.

• null - skriv för värdet null . null är implicit en del av alla typer, såvida inte strikta nollkontroller är aktiverade.

Gjutning

Du kan utföra tydlig gjutning genom vinkelfästare, till exempel:

var derived: MyInterface;
(<ImplementingClass>derived).someSpecificMethod();

Detta exempel visar en derived klass som behandlas av kompilatorn som ett MyInterface . Utan gjutning på den andra raden skulle kompilatorn kastat ett undantag eftersom den inte förstår someSpecificMethod() , men genom att kasta genom <ImplementingClass>derived föreslår kompilatorn vad han ska göra.

Ett annat sätt att gjutning på maskin använder as sökord:

var derived: MyInterface;
(derived as ImplementingClass).someSpecificMethod();

Sedan Typescript 1.6 använder standarden as nyckelord, eftersom <> är tvetydigt i .jsx- filer. Detta nämns i det officiella dokumentationen för Typescript .

Klasser

Klasser kan definieras och användas i TypeScript-kod. För mer information om klasser, se dokumentationssidan för klasser .

TypeScript REPL i Node.js

För att använda TypeScript REPL i Node.js kan du använda tsun-paketet

Installera det globalt med

npm install -g tsun

och kör i din terminal eller kommandotolk med tsun kommando

Exempel på användning:

$ tsun
TSUN : TypeScript Upgraded Node
type in TypeScript expression to evaluate
type :help for commands in repl
$ function multiply(x, y) {
..return x * y;
..}
undefined
$ multiply(3, 4)
12

Kör TypeScript med ts-nod

ts-node är ett npm-paket som gör det möjligt för användaren att köra typskriptfiler direkt utan behov av förkompilering med hjälp av tsc . Det ger också REPL .

Installera ts-nod globalt med

npm install -g ts-node

ts-node paketerar inte typskriptkompilerare, så du kan behöva installera den.

npm install -g typescript

Utför skript

Kör för att köra ett skript med namnet main.ts

ts-node main.ts

// main.ts
console.log("Hello world");

Exempel på användning

$ ts-node main.ts
Hello world

Kör REPL

För att köra REPL, kör kommandot ts-node

Exempel på användning

$ ts-node
> const sum = (a, b): number => a + b;
undefined
> sum(2, 2)
4
> .exit

För att avsluta REPL använd kommandot .exit eller tryck CTRL+C två gånger.