📜  TypeScript-变量

📅  最后修改于: 2020-10-19 03:49:15             🧑  作者: Mango


根据定义,变量是“存储在内存中的命名空间”。换句话说,它充当程序中值的容器。 TypeScript变量必须遵循JavaScript命名规则-

  • 变量名称可以包含字母和数字。

  • 它们不能包含空格和特殊字符,下划线(_)和美元($)符号除外。

  • 变量名称不能以数字开头。

必须先声明变量,然后才能使用它。使用var关键字声明变量。

TypeScript中的变量声明

在TypeScript中声明变量的类型语法是在变量名后加一个冒号(:),后跟其类型。就像在JavaScript中一样,我们使用var关键字声明变量。

声明变量时,有四个选项-

  • 在一条语句中声明其类型和值。

声明类型

  • 声明其类型,但无值。在这种情况下,变量将设置为undefined。

未定义

  • 声明其值,但不声明类型。变量类型将设置为分配值的数据类型。

任何

  • 声明两个值都不是类型。在这种情况下,变量的数据类型将为any,并将被初始化为undefined。

任何和未定义

下表说明了如上所述的变量声明的有效语法-

S.No. Variable Declaration Syntax & Description
1.

var name:string = ”mary”

The variable stores a value of type string

2.

var name:string;

The variable is a string variable. The variable’s value is set to undefined by default

3.

var name = ”mary”

The variable’s type is inferred from the data type of the value. Here, the variable is of the type string

4.

var name;

The variable’s data type is any. Its value is set to undefined by default.

示例: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代码。

//Generated by 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"     // will result in a compilation error

TypeScript中的类型断言

TypeScript允许将变量从一种类型更改为另一种类型。 TypeScript将此过程称为Type Assertion 。语法是将目标类型放在<>符号之间,并将其放置在变量或表达式的前面。以下示例解释了此概念-

var str = '1' 
var str2:number =   str   //str is now of type number 
console.log(typeof(str2))

如果将鼠标指针悬停在Visual Studio Code中的类型声明语句上,它将显示变量数据类型的更改。基本上,如果S是T的子类型或T是S的子类型,则允许从类型S到T的声明成功。

之所以不称其为“类型转换”,是因为类型转换通常意味着某种运行时支持,而“类型断言”纯粹是一种编译时结构,是一种向编译器提示如何代码的方式。被分析。

编译时,它将生成以下JavaScript代码。

"use strict";
var str = '1';
var str2 = str; //str is now of type number 
console.log(typeof (str2));

它将产生以下输出-

string

在TypeScript中推断输入

鉴于Typescript是强类型的,因此此功能是可选的。 TypeScript还鼓励动态键入变量。这意味着TypeScript鼓励声明不带类型的变量。在这种情况下,编译器将根据分配给它的值来确定变量的类型。 TypeScript将在代码中找到该变量的首次用法,确定其初始设置的类型,然后在代码块的其余部分中对该变量采用相同的类型。

以下代码段对此进行了解释-

示例:推断输入

var num = 2;    // data type inferred as  number 
console.log("value of num "+num); 
num = "12";
console.log(num);

在上面的代码片段中-

  • 该代码声明一个变量并将其值设置为2。请注意,变量声明未指定数据类型。因此,程序使用推断的类型来确定变量的数据类型,即,它分配变量设置为的第一个值的类型。在这种情况下,将num设置为类型编号。

  • 当代码尝试将变量的值设置为字符串。编译器抛出错误,因为变量的类型已经设置为数字。

它将产生以下输出-

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

TypeScript变量范围

变量的范围指定了变量的定义位置。程序中变量的可用性由其范围决定。 TypeScript变量可以具有以下范围-

  • 全局范围-全局变量在编程构造之外声明。可以从代码中的任何位置访问这些变量。

  • 类范围-这些变量也称为字段。字段或类变量在类内但在方法外声明。可以使用类的对象访问这些变量。字段也可以是静态的。可以使用类名称访问静态字段。

  • 局部作用域-顾名思义,局部变量在方法,循环等结构中声明。局部变量仅在声明它们的结构中可访问。

下面的示例说明TypeScript中的变量作用域。

示例:可变范围

var global_num = 12          //global variable 
class Numbers { 
   num_val = 13;             //class variable 
   static sval = 10;         //static field 
   
   storeNum():void { 
      var local_num = 14;    //local variable 
   } 
} 
console.log("Global num: "+global_num)  
console.log(Numbers.sval)   //static variable  
var obj = new Numbers(); 
console.log("Global num: "+obj.num_val) 

在编译时,将生成以下JavaScript代码-

var global_num = 12;              //global variable 
var Numbers = (function () {
   function Numbers() {
      this.num_val = 13;          //class variable 
   }
   Numbers.prototype.storeNum = function () {
      var local_num = 14;        //local variable 
   };
   Numbers.sval = 10;            //static field 
   return Numbers;
}());

console.log("Global num: " + global_num);
console.log(Numbers.sval);       //static variable  

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'.