От автора: сегодня мы поговорим о том, как и для чего происходит в TypeScript объявление переменных. Согласно определению, переменная является «именованной областью памяти», которая хранит значения. Другими словами, она ведет себя как контейнер для значений в программе. Переменные TypeScript должны соответствовать правилам именования JavaScript.
Именования переменных могут содержать буквы и цифры.
Они не должны содержать пробелы и специальные символы, кроме подчеркивания (_) и символа доллара ($).
Имена переменных не должны начинаться с цифр.
Перед использованием переменная должна быть объявлена. Ччтобы объявить переменную, используется ключевое слово var.
Объявление переменной в TypeScript
Синтаксис типа для объявления переменной в TypeScript должен содержать двоеточие (:) после имени переменной, за которым следует тип. Как и в JavaScript, мы используем ключевое слово var, чтобы объявить переменную. Когда вы объявляете переменную, у вас есть четыре опции:
Объявить ее тип и значение в одном операторе.
Объявить ее тип, но не объявлять значения. В этом случае, переменная будет задана как неопределенная.
Объявить ее значение, но не объявлять тип. Переменная будет задана как any.
Не объявлять ни значение, ни тип. В этом случае тип данных переменной будет задан как any и она будет инициализирована как неопределенная.
Ниже приведен корректный синтаксис для объявления переменной:
var name:string = «mary» — Переменная хранит значение строчного типа
var name:string; — Это переменная string. Значение переменной задано как undefined по умолчанию
var name = «mary» — Тип переменной определяется по типу данных значения. Здесь переменная – это переменная строчного типа
var name; — Тип данных переменной – any. Ее значение задано как undefined по умолчанию.
Пример: переменные в TypeScript
|
1 2 3 4 5 6 7 8 |
var name:string = "John"; var score1:number = 50; var score2:number = 42.50 var sum = score1 + score2 console.log("name"+name) console.log("first score: "+score1) console.log("second score: "+score2) console.log("sum of the scores: "+sum) |
После компиляции мы получим следующий код JavaScript.
|
1 2 3 4 5 6 7 8 9 |
//Сгенерировано посредством typescript 1.8.10 var name = "John"; var score1 = 50; var score2 = 42.50; var sum = score1 + score2; console.log("name" + name); console.log("first score: " + score1); console.log("second score : " + score2); console.log("sum of the scores: " + sum); |
Результат вышеприведенной программы:
|
1 2 3 4 |
name:John first score:50 second score:42.50 sum of the scores:92.50 |
Компилятор TypeScript сгенерирует ошибку, если мы попытаемся присвоить значение переменной с несоответствующим типом. Отсюда следует, что в TypeScript реализуется строгая типизация. Синтаксис строгой типизации гарантирует, что типы, указанные с каждой стороны оператора присвоения (=), идентичны. Вот почему вследствие ошибки компиляции мы получит такой код:
|
1 |
var num:number = "hello" // получится в результате ошибки компиляции |
Присвоение типа в TypeScript
TypeScript позволяет изменить тип переменной с одного на другой. Этот процесс называет присвоение типа. Синтаксис заключается в том, что нужно разместить нужный тип между символами < > и указать его напротив переменной или выражения. Следующий пример иллюстрирует этот принцип:
Пример
|
1 2 3 |
var str = '1' var str2:number = <number> <any> str //str теперь имеет числовой тип console.log(str2) |
Если вы в Visual Studio Code наведете курсор на оператор присвоения типа, то увидите изменения в типе данных переменной. Фактически получается переназначение с типа S на тип T, при условии, что S – это подтип T или T – это подтип S.
Это не называется «преобразованием типов» потому, что преобразование подразумевает что-то вроде поддержки исполнения, а «присвоение типа» — это просто конструкция на стадии компиляции и способ обеспечить компилятору подсказки того, как нужно анализировать код. После компиляции вы получите следующий JavaScript код.
|
1 2 3 4 |
// Сгенерировано посредством typescript 1.8.10 var str = '1'; var str2 = str; //str теперь имеет числовой типа console.log(str2); |
В результате мы получим следующее: 1
Типизация с поддержкой вывода типов в TypeScript
Принимая по внимание тот факт, что Typescript является строго типизированным, эта функция необязательна. TypeScript также способствует динамической типизации переменных. А это значит, что TypeScript способствует объявлению переменной без типа. В таких случаях компилятор будет определять тип переменной на основе присвоенного ей значения. TypeScript находит первое использование переменной внутри кода, определяет тип значения, которое было первоначально задано для переменной, и потом предполагает тот же тип для этой переменной в остальном коде.
В следующем фрагменте кода продемонстрирована эта концепция:
Пример: типизация с поддержкой вывода типов
|
1 2 3 4 |
var num = 2; // тип данных выведен как число console.log("value of num "+num); num = "12"; console.log(num); |
В этом фрагменте −
В коде объявляется переменная, и для нее задается значение 2. Обратите внимание, что при объявлении переменной не указывается тип данных. Отсюда следует, что программа использует типизацию с поддержкой вывода типов, чтобы определить тип данных переменной, то есть, переменной присваивается тип соответствующий первому значению, заданному для переменной.
Когда далее в коде мы пытаемся задать переменной строчное значение, компилятор выдает ошибку, так как тип переменной уже задан как числовой.
В результате мы получим следующее:
|
1 |
error TS2011: Cannot convert 'string' to 'number'. |
Область видимости переменной TypeScript
Область видимости переменной указывает, где переменная определена. Доступность переменной внутри программы определяется областью видимости. Для переменных TypeScript могут задаваться следующие области видимости:
Глобальная область видимости – Глобальные переменные объявляются за пределами программной конструкции. Получить доступ к этим переменным можно из любого места внутри кода.
Классовая область видимости – Эти переменные также называются полями. Поля или переменные класса объявляются внутри класса, но за пределами метода. Получить доступ к этим переменным можно с помощью объекта класса. Поля также могут быть статическими. Чтобы получить доступ к статическим полям, нужно использовать имя класса.
Локальная область видимости – Локальные переменные, как следует из их названия, объявляются внутри таких конструкций как методы, циклы и т.д. Получить доступ к локальным переменным можно только внутри конструкции, в которой они были объявлены.
Следующий пример иллюстрирует область видимости переменных в TypeScript.
Пример: Область видимости переменных
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
var global_num = 12 //глобальная переменная class Numbers { num_val = 13; //классовая переменная static sval = 10; //статическое поле storeNum():void { var local_num = 14; //локальная переменная } } console.log("Global num: "+global_num) console.log(Numbers.sval) //статическая переменная var obj = new Numbers(); console.log("Global num: "+obj.num_val) |
После транспиляции мы получим следующий JavaScript код:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
var global_num = 12; //глобальная переменная var Numbers = (function () { function Numbers() { this.num_val = 13; //классовая переменная } Numbers.prototype.storeNum = function () { var local_num = 14; // локальная переменная }; Numbers.sval = 10; //статическое поле return Numbers; }()); console.log("Global num: " + global_num); console.log(Numbers.sval); //статическая переменная var obj = new Numbers(); console.log("Global num: " + obj.num_val); |
В результате мы получим следующее:
|
1 2 3 |
Global num: 12 10 Global num: 13 |
Если вы попробуете получить доступ к локальной переменной за пределом метода, возникнет ошибка компиляции.
|
1 |
error TS2095: Could not find symbol 'local_num'. |
Источник: //www.tutorialspoint.com/
Редакция: Команда webformyself.
