TypeScript 基础（一）

TypeScript 入门

TypeScript简介

1. TS的来历

   TypeScript（简称TS）由微软于2013年发布，是ECMA的三巨头语言的老小（JS、AS、TS）。

2. TS的特点

   TypeScript是一种强类型语言，相对于弱类型语言，开发更容易，（但更难学）。

3. TS的使用方法

   • 安装：打开终端，输入npm i typescript -g
   • 编程：创建一个.ts为后缀的文件开始编程
   • 编译运行：在终输入tsc filename.ts即可编译TypeScript文件，生成一个同名的js文件。

let 关键字

在TS中，let和var都可以定义变量，但是let是JavaScript的新概念，可以解决很多常见的问题，所以一般使用let来定义。

字符类型

1. 数字类型 number （所有数字都是浮点数）

   let a:number = 6;	// :类型 表示强类型，不可更改类型
   let b:number = 0xf00d;
   a = 0x00ff;
   a = 1.2e+2;
   

2. 布尔类型 boolean

   let a:boolean = false;
   

3. 字符串类型 string

   let a:string = "a";
   let b = "b";
   

4. 数组 array（JS中没有数组）

   数组中的元素类型必须统一

   // number限定数组中的元素类型
   let a:number[] = [1,2,3,4]; 
   
   // 另一种限制元素类型的写法 推荐写法
   let b:Array<string> = ["a","b","c","d"]; 
   

5. 元组 Tuple

   元组是元素类型不统一的数组

   let a:[string,boolean,number] = ["a",false,1]
   

6. 枚举 enum（enumerate，意味枚举）

   可以理解为一种类，当中列出的静态常量

   enum Color {
       RED="0xFF0000",
       GREEN="0x00FF00",
       BLUE="0X0000FF"
   }
   let a:Color = Color.RED;
   
   enum MouseEvents {
       CLICK="click",
       MOUSE_DOWN = "mousedown",
       MOUSE_UP = "mouseup"
   }
   doucument.addEventListener(MouseEvents.CLICK,clickHandler);
   function clickHandler(){
       //...
   }
   

7. 任意值 any

   任意类型

   let a:any = 3;
   a = "a";
   a = false;
   let b = 4; //默认为any类型
   

8. null 和 undefined

   let o:object = {a:1,b:2};
   o = null; // 不会报错
   let a; // 默认为undefined
   
   let u:undefined = undefined;
   let n:null = null;
   

9. void

   void可以理解为与any类型相反，它没有任何类型，通常当一个函数没有返回值时，返回类型写void

   声明一个void类型的变量没什么意义，因为只能给它赋值为undefined或者null；

   function haha():void{
       console.log("haha");
   }
   

10. 不存在的值类型 Never

    // --
    

11. 非原始类型 Object

    // --
    

类型断言

在编程中，当你清楚地知道一个实体的具体类型的时候，可以通过类型断言的方式告诉编辑器"莫给老子报错"。类型断言好比其他语言里的类型转换，但是不进行特殊的数据检查和解构，运行时没有影响，只在编译的阶段起作用。

类型断言有两种方式：

1. 尖括号写法，在要断言的数据前加上<数据类型>：

   let someValue:any = "string";
   let strLength:number = (<string>someValue).length;
   

2. as 语法：(… as …)

   let someValue:any = "string";
   let strLength:number = (someValue as string).length;
   

函数写法

在函数后写入:类型，表示返回什么类型，return的结果是什么类型

设置void表示当前函数不返回任何值

function fn(a:string,b:number = 1):void{
    // :void 表示该函数没有返回值
}
function getSum(a:number,b:number = 10):number{
    // :number 表示该函数返回一个数值类型
    return a+b
}

---

类、继承与接口内容较多，将在下个章节更新

​