TypeScript — Объявление переменных

TypeScript — Объявление переменных

От автора: сегодня мы поговорим о том, как и для чего происходит в TypeScript объявление переменных. Согласно определению, переменная является «именованной областью памяти», которая хранит значения. Другими словами, она ведет себя как контейнер для значений в программе. Переменные TypeScript должны соответствовать правилам именования JavaScript.

Именования переменных могут содержать буквы и цифры.

Они не должны содержать пробелы и специальные символы, кроме подчеркивания (_) и символа доллара ($).

Имена переменных не должны начинаться с цифр.

Перед использованием переменная должна быть объявлена. Ччтобы объявить переменную, используется ключевое слово var.

Объявление переменной в TypeScript

Синтаксис типа для объявления переменной в TypeScript должен содержать двоеточие (:) после имени переменной, за которым следует тип. Как и в JavaScript, мы используем ключевое слово var, чтобы объявить переменную. Когда вы объявляете переменную, у вас есть четыре опции:

Объявить ее тип и значение в одном операторе.

TypeScript — Объявление переменных

Объявить ее тип, но не объявлять значения. В этом случае, переменная будет задана как неопределенная.

TypeScript — Объявление переменных

Объявить ее значение, но не объявлять тип. Переменная будет задана как any.

TypeScript — Объявление переменных

Не объявлять ни значение, ни тип. В этом случае тип данных переменной будет задан как any и она будет инициализирована как неопределенная.

TypeScript — Объявление переменных

Ниже приведен корректный синтаксис для объявления переменной:

var name:string = «mary» — Переменная хранит значение строчного типа

var name:string; — Это переменная string. Значение переменной задано как undefined по умолчанию

var name = «mary» — Тип переменной определяется по типу данных значения. Здесь переменная – это переменная строчного типа

var name; — Тип данных переменной – any. Ее значение задано как undefined по умолчанию.

Пример: переменные в TypeScript

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.

//Сгенерировано посредством 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);

Результат вышеприведенной программы:

name:John 
first score:50 
second score:42.50 
sum of the scores:92.50

Компилятор TypeScript сгенерирует ошибку, если мы попытаемся присвоить значение переменной с несоответствующим типом. Отсюда следует, что в TypeScript реализуется строгая типизация. Синтаксис строгой типизации гарантирует, что типы, указанные с каждой стороны оператора присвоения (=), идентичны. Вот почему вследствие ошибки компиляции мы получит такой код:

var num:number = "hello" // получится в результате ошибки компиляции 

Присвоение типа в TypeScript

TypeScript позволяет изменить тип переменной с одного на другой. Этот процесс называет присвоение типа. Синтаксис заключается в том, что нужно разместить нужный тип между символами < > и указать его напротив переменной или выражения. Следующий пример иллюстрирует этот принцип:

Пример

var str = '1' 
var str2:number = <number> <any> str //str теперь имеет числовой тип
console.log(str2)

Если вы в Visual Studio Code наведете курсор на оператор присвоения типа, то увидите изменения в типе данных переменной. Фактически получается переназначение с типа S на тип T, при условии, что S – это подтип T или T – это подтип S.

Это не называется «преобразованием типов» потому, что преобразование подразумевает что-то вроде поддержки исполнения, а «присвоение типа» — это просто конструкция на стадии компиляции и способ обеспечить компилятору подсказки того, как нужно анализировать код. После компиляции вы получите следующий JavaScript код.

// Сгенерировано посредством typescript 1.8.10
var str = '1';
var str2 = str; //str теперь имеет числовой типа
console.log(str2);

В результате мы получим следующее: 1

Типизация с поддержкой вывода типов в TypeScript

Принимая по внимание тот факт, что Typescript является строго типизированным, эта функция необязательна. TypeScript также способствует динамической типизации переменных. А это значит, что TypeScript способствует объявлению переменной без типа. В таких случаях компилятор будет определять тип переменной на основе присвоенного ей значения. TypeScript находит первое использование переменной внутри кода, определяет тип значения, которое было первоначально задано для переменной, и потом предполагает тот же тип для этой переменной в остальном коде.

В следующем фрагменте кода продемонстрирована эта концепция:

Пример: типизация с поддержкой вывода типов

var num = 2; // тип данных выведен как число 
console.log("value of num "+num); 
num = "12";
console.log(num);

В этом фрагменте −

В коде объявляется переменная, и для нее задается значение 2. Обратите внимание, что при объявлении переменной не указывается тип данных. Отсюда следует, что программа использует типизацию с поддержкой вывода типов, чтобы определить тип данных переменной, то есть, переменной присваивается тип соответствующий первому значению, заданному для переменной.

Когда далее в коде мы пытаемся задать переменной строчное значение, компилятор выдает ошибку, так как тип переменной уже задан как числовой.

В результате мы получим следующее:

error TS2011: Cannot convert 'string' to 'number'.

Область видимости переменной TypeScript

Область видимости переменной указывает, где переменная определена. Доступность переменной внутри программы определяется областью видимости. Для переменных TypeScript могут задаваться следующие области видимости:

Глобальная область видимости – Глобальные переменные объявляются за пределами программной конструкции. Получить доступ к этим переменным можно из любого места внутри кода.

Классовая область видимости – Эти переменные также называются полями. Поля или переменные класса объявляются внутри класса, но за пределами метода. Получить доступ к этим переменным можно с помощью объекта класса. Поля также могут быть статическими. Чтобы получить доступ к статическим полям, нужно использовать имя класса.

Локальная область видимости – Локальные переменные, как следует из их названия, объявляются внутри таких конструкций как методы, циклы и т.д. Получить доступ к локальным переменным можно только внутри конструкции, в которой они были объявлены.

Следующий пример иллюстрирует область видимости переменных в TypeScript.

Пример: Область видимости переменных

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 код:

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);

В результате мы получим следующее:

Global num: 12
10
Global num: 13

Если вы попробуете получить доступ к локальной переменной за пределом метода, возникнет ошибка компиляции.

error TS2095: Could not find symbol 'local_num'.

Источник: https://www.tutorialspoint.com/

Редакция: Команда webformyself.

Курс по TypeScript

Прямо сейчас посмотрите курс по TypeScript!

Смотреть курс

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree