[Typescript]第1章-ts基本语法

在线运行界面 https://www.typescriptlang.org/zh/play

const hello : string = "Hello World!"
console.log(hello)

TypeScript 基础数据类型

number：双精度 64 位浮点值。它可以用来表示整数和浮点数。TS中没有int和float，只有一个number。

string：一个字符系列，使用单引号（'）或双引号（"）来表示字符串类型。反引号（`）来定义多行文本和内嵌表达式。

boolean：表示逻辑值：true 和 false。

enum：枚举类型用于定义数值集合。

enum Color {Red, Green, Blue};
let c: Color = Color.Blue;
console.log(c);    // 输出 2

void：用于标识方法返回值的类型，表示该方法没有返回值。

还有其他几个不太常用的数据类型：null、undefined、any、never

TypeScript 变量声明

var [变量名] : [类型] = 值;
var uname:string = "hello";

声明变量的类型，但没有初始值，变量值会设置为 undefined：

var [变量名] : [类型];
var uname:string;

声明变量并初始值，但不设置类型，该变量可以是任意类型：

var [变量名] = 值;
var uname = "hello";

声明变量没有设置类型和初始值，类型可以是任意类型，默认初始值为 undefined：

var [变量名];
var uname;

变量作用域

变量作用域指定了变量定义的位置。

程序中变量的可用性由变量作用域决定。

TypeScript 有以下几种作用域：

• 全局作用域 − 全局变量定义在程序结构的外部，它可以在你代码的任何位置使用。
• 类作用域 − 这个变量也可以称为 字段。类变量声明在一个类里头，但在类的方法外面。 该变量可以通过类的对象来访问。类变量也可以是静态的，静态的变量可以通过类名直接访问。
• 局部作用域 − 局部变量，局部变量只能在声明它的一个代码块（如：方法）中使用。

var global_num = 12          // 全局变量
class Numbers { 
   num_val = 13;             // 实例变量
   static sval = 10;         // 静态变量
   
   storeNum():void { 
      var local_num = 14;    // 局部变量
   } 
} 
console.log("全局变量为: "+global_num)  
console.log(Numbers.sval)   // 静态变量
var obj = new Numbers(); 
console.log("实例变量: "+obj.num_val)

TypeScript 主要包含以下几种运算：

• 算术运算符
• 逻辑运算符
• 关系运算符
• 按位运算符
• 赋值运算符
• 三元/条件运算符
• 字符串运算符
• 类型运算符

算术运算符

var num1:number = 10 
var num2:number = 2
var res:number = 0
    
res = num1 + num2 
console.log("加:"+res); 

res = num1 - num2; 
console.log("减:"+res) 

res = num1*num2 
console.log("乘:"+res) 

res = num1/num2 
console.log("除:"+res)

res = num1%num2 
console.log("余数:"+res) 

num1++ 
console.log("num1 自增运算: "+num1) 

num2-- 
console.log("num2 自减运算: "+num2)

关系运算符

关系运算符用于计算结果是否为 true 或者 false。包括==、!=、<、>、<=、>=

var num1:number = 5;
var num2:number = 9;
 
console.log("num1 的值为: "+num1); 
console.log("num2 的值为:"+num2);
 
var res = num1>num2 
console.log("num1 大于n num2: "+res)
 
res = num1<num2 
console.log("num1 小于 num2: "+res)  
 
res = num1>=num2 
console.log("num1 大于或等于  num2: "+res)
 
res = num1<=num2
console.log("num1 小于或等于 num2: "+res)  
 
res = num1==num2 
console.log("num1 等于 num2: "+res)  
 
res = num1!=num2  
console.log("num1 不等于 num2: "+res)

逻辑运算符

逻辑运算符用于测定变量或值之间的逻辑。包括&&、||、!

var avg:number = 20; 
var percentage:number = 90; 
 
console.log("avg 值为: "+avg+" ,percentage 值为: "+percentage);
  
var res:boolean = ((avg>50)&&(percentage>80)); 
console.log("(avg>50)&&(percentage>80): ",res);
 
var res:boolean = ((avg>50)||(percentage>80)); 
console.log("(avg>50)||(percentage>80): ",res);
 
var res:boolean=!((avg>50)&&(percentage>80)); 
console.log("!((avg>50)&&(percentage>80)): ",res);

&& 与 || 是短路运算符。&& 与 || 运算符可用于组合表达式。 && 运算符只有在左右两个表达式都为 true 时才返回 true。

赋值运算符

赋值运算符用于给变量赋值。

= (赋值)

+= (先进行加运算后赋值)

-= (先进行减运算后赋值)

*= (先进行乘运算后赋值)

/= (先进行除运算后赋值)

var a: number = 12 
var b:number = 10  
 
a = b 
console.log("a = b: "+a)
 
a += b
console.log("a+=b: "+a)
 
a -= b 
console.log("a-=b: "+a)
 
a *= b 
console.log("a*=b: "+a)
 
a /= b 
console.log("a/=b: "+a)  
 
a %= b 
console.log("a%=b: "+a)

三元运算符 (?)

三元运算有 3 个操作数，并且需要判断布尔表达式的值。该运算符的主要是决定哪个值应该赋值给变量。

Test ? expr1 : expr2

• Test − 指定的条件语句
• expr1 − 如果条件语句 Test 返回 true 则返回该值
• expr2 − 如果条件语句 Test 返回 false 则返回该值

var num:number = -2 
var result = num > 0 ? "大于 0" : "小于 0，或等于 0" 
console.log(result)

字符串运算符: 连接运算符 (+)

• 运算符可以拼接两个字符串

var msg:string = "hello "+"world" 
console.log(msg)

类型运算符

typeof 运算符

typeof 是一元运算符，返回操作数的数据类型。

var num = 12 
console.log(typeof num);   //输出结果: number