TypeScript — это язык программирования, целью которого является лёгкая разработка широко масштабируемых JavaScript-приложений. TypeScript добавляет в JavaScript общие концепции, такие как классы, модули, интерфейсы, обобщённое программирование и (опционально) статическую типизацию. Это надмножество языка JavaScript: весь JavaScript-код является валидным TypeScript-кодом, следовательно, может быть добавлен бесшовно в любой проект. Компилятор TypeScript генерирует JavaScript-код.
Эта статья концентрируется только на синтаксисе TypeScript, в противовес статье о JavaScript.
Для тестирования компилятора TypeScript пройдите по ссылке в песочницу. Там вы можете написать код (с поддержкой автодополнения) и сразу же увидеть сгенерированный JavaScript код.
1// В TypeScript есть 3 базовых типа
2var isDone: boolean = false;
3var lines: number = 42;
4var name: string = "Андерс";
5
6// Тип «any» для случаев, когда заранее неизвестен тип переменной
7var notSure: any = 4;
8notSure = "а может быть, строка";
9notSure = false; // а теперь логический тип
10
11// Для коллекций есть типизированные массивы и обобщённые массивы
12var list: number[] = [1, 2, 3];
13// Как альтернатива, использование обобщённого массива
14var list: Array<number> = [1, 2, 3];
15
16// Перечисления:
17enum Color {Red, Green, Blue};
18var c: Color = Color.Green;
19
20// Наконец, «void» используется для обозначения того, что функция ничего не возвращает
21function bigHorribleAlert(): void {
22 alert("Я маленькое надоедливое окошко!");
23}
24
25// Функции — это объекты первого класса. Они поддерживают лямбда-синтаксис (=>)
26// и используют вывод типов (type inference)
27
28// Следующие строки кода являются эквивалентными, компилятором предполагается
29// одинаковая сигнатура, на выходе генерируется одинаковый JavaScript-код
30var f1 = function(i: number): number { return i * i; }
31// Предполагается возвращаемый тип
32var f2 = function(i: number) { return i * i; }
33var f3 = (i: number): number => { return i * i; }
34// Предполагается возвращаемый тип
35var f4 = (i: number) => { return i * i; }
36// Предполагается возвращаемый тип, в однострочной функции ключевое слово «return» не нужно
37var f5 = (i: number) => i * i;
38
39// Интерфейсы являются структурными; всё, что имеет свойства, совместимо с интерфейсом
40interface Person {
41 name: string;
42 // Опциональные свойства, помеченные символом «?»
43 age?: number;
44 // И, конечно, функции
45 move(): void;
46}
47
48// Объект, который реализует интерфейс «Person»
49// К нему можно обращаться, как к «Person», так как он имеет свойства «name» и «move»
50var p: Person = { name: "Бобби", move: () => {} };
51// Объекты, которые могут иметь опциональные свойства:
52var validPerson: Person = { name: "Бобби", age: 42, move: () => {} };
53// Это не «Person», поскольку «age» не является числовым значением
54var invalidPerson: Person = { name: "Бобби", age: true };
55
56// Интерфейсы могут также описывать функциональный тип
57interface SearchFunc {
58 (source: string, subString: string): boolean;
59}
60// Важны только типы параметров, имена — нет.
61var mySearch: SearchFunc;
62mySearch = function(src: string, sub: string) {
63 return src.search(sub) != -1;
64}
65
66// Классы. Члены класса по умолчанию являются публичными
67class Point {
68 // Свойства
69 x: number;
70
71 // Конструктор — ключевые слова public/private в данном контексте сгенерируют
72 // шаблонный код для свойства и для инициализации в конструкторе
73 // В данном примере «y» будет определён так же, как и «x», но меньшим количеством кода
74 // Значения по умолчанию также поддерживаются
75
76 constructor(x: number, public y: number = 0) {
77 this.x = x;
78 }
79
80 // Функции
81 dist() { return Math.sqrt(this.x * this.x + this.y * this.y); }
82
83 // Статические члены
84 static origin = new Point(0, 0);
85}
86
87var p1 = new Point(10 ,20);
88var p2 = new Point(25); //y будет равен 0
89
90// Наследование
91class Point3D extends Point {
92 constructor(x: number, y: number, public z: number = 0) {
93 super(x, y); // Явный вызов конструктора базового класса обязателен
94 }
95
96 // Перегрузка
97 dist() {
98 var d = super.dist();
99 return Math.sqrt(d * d + this.z * this.z);
100 }
101}
102
103// Модули, знак «.» может быть использован как разделитель для обозначения подмодулей
104module Geometry {
105 export class Square {
106 constructor(public sideLength: number = 0) {
107 }
108 area() {
109 return Math.pow(this.sideLength, 2);
110 }
111 }
112}
113
114var s1 = new Geometry.Square(5);
115
116// Локальный псевдоним для ссылки на модуль
117import G = Geometry;
118
119var s2 = new G.Square(10);
120
121// Обобщённое программирование
122// Классы
123class Tuple<T1, T2> {
124 constructor(public item1: T1, public item2: T2) {
125 }
126}
127
128// Интерфейсы
129interface Pair<T> {
130 item1: T;
131 item2: T;
132}
133
134// И функции
135var pairToTuple = function<T>(p: Pair<T>) {
136 return new Tuple(p.item1, p.item2);
137};
138
139var tuple = pairToTuple({ item1:"hello", item2:"world"});
140
141// Включение ссылки на файл определения:
142/// <reference path="jquery.d.ts" />