TypeScript的介绍

什么是TypeScript

TypeScript是JavaScript类型的超集，它可以编译成纯JavaScript。
TypeScript可以在任何浏览器、任何计算机和任何操作系统上运行，并且是开源的。
本质上是向JavaScript这个语言添加了可选的静态类型和基于类的面向对象编程。扩展了JavaScript的语法。TypeScript是为大型应用的开发而设计。

安装TypeScript

两种方法：

	1、通过npm（Node.js包管理器）
	2、安装Visual Studio的TypeScript插件

通过npm下载

通过win + r  输入cmd打开命令窗口输入  **npm install -g typescript**，然后回车

安装完成后，输入tsc -v（安装成功会输出版本号）：

将.ts文件编译为.js

在.ts文件所在文件夹打开控制台输入 tsc 文件名.ts，会自动生成一个js文件

同时运行多个 ts 文件

tsc --init

TypeScript的数据类型

属性值要与数据类型一致，否则报错

1. 布尔类型(boolean)、

	let flag: boolean = false;
	flag = 123;//报错
	flag = true;//正确

2. 数字类型（number）

	 let num:number = 10;
	 num = 20;

3. 字符串类型（string）

	let str:string='hello world';

4. 数组类型（array）

	//第一种，这个数组中的元素必须都是number类型
	let arr:number[]=[1,2,3];
	//第二种
	let arr:Array<number>=[1,2,3];

5. 元组类型（tuple）

	// 属于数组的一种
	//元组类型指可以给数组中的每一个位置的元素指定类型，指定的类型与数组中的元素位置一一对应
	let arr:[number,string]=[123,'hello'];

6. 枚举类型（enum）

	enum Color {A,B,C};//如果不给标示符赋值，打印出来的就是标示符所在位置的下标
	enum Color {'A'=1,'b'=2,'C'=3};

7. 任意值类型（any）

	//允许被赋值为任意类型。
	let num:any=123;
	num='str';
	num=true;
	//变量如果在声明的时候，未指定其类型，那么它会被识别为任意值类型：
	let something;
	//在任意值上访问任何属性都是允许的，也允许调用任何方法

8. null和undefined

	//undefined 和 null 是所有类型的子类型
	let u: undefined = undefined;
	let n: null = null;
	
	let num:number;//报错
	let num:undefined;//正确，num只声明了但是没有赋值，如果要赋值，只能赋undefined
	

9. void类型

	//JavaScript 没有空值（Void）的概念，在 TypeScript 中，可以用 void 表示没有任何返回值的函数：
	function Name(): void {
	    alert('My name is Tom');
	}
	//void 类型的变量不能赋值给 number 类型的变量
	
	let u: void;
	let num: number = u;
	// Type 'void' is not assignable to type 'number'.

10. never类型

	//是其他类型（包括 null 和 undefined）的子类型，代表从不会出现的值。
	//这意味着声明never的变量只能被never类型所赋值。
	let x: never;
	let y: number;
	x = 123;// 编译错误，数字类型不能转为 never 类型
	x = (()=>{ throw new Error('exception')})();// 运行正确，never 类型可以赋值给 never类型
	y = (()=>{ throw new Error('exception')})();// 运行正确，never 类型可以赋值给 数字类型

11. 联合类型
    可以通过管道(|)将变量设置多种类型，赋值时可以根据设置的类型来赋值。

	let val:string|number 
	val = 10
	val = "fur" 

TypeScript函数

函数必须指定类型
函数声明

	function sum(x: number, y: number): number {
	    return x + y;
	}

函数表达式

 	let mySum = function sum(x: number, y: number): number {
	    return x + y;
	}
	//手动给 mySum 添加类型
	let mySum: (x: number, y: number) => number = function (x: number, y: number): number {
	    return x + y;
	};

默认参数

	//TypeScript 会将添加了默认值的参数识别为可选参数
	//不受可选参数必须接在必需参数后面的限制
	function (name:string,sex:string="男"):string{
	    if(sex){
	        return`${name}在跑步---${sex}`
	    }else{
	        return`${name}在跑步`
	    }
	}
	console.log(run("我"))//我在跑步    默认（男）
	console.log(run("你","女"))//你在跑步---女

可选参数

	//可选参数必须接在必需参数后面
	function fun(x: number, y ?: number): number{
	  if (y) {
	  	   return  x + y;
	  } else {
		   return  x ;
	  }
	}
	console.log(fun(1));//1
	console.log(fun(1,2));//3

剩余参数
三点运算符 接受新参传过来的值
类似agreement伪数组

	//arr 是一个数组。所以我们可以用数组的类型来定义它：
	function sum(...arr:number[]):number{
	    var item = 0;
	    var sum = 0;
	    for(item of arr){
	        sum += item
	    }
	    return sum;
	}
	console.log(sum(1,2,3,4,5,6))//21
	console.log(sum(1,2,3))//6
	

函数重载
重载允许一个函数接受不同数量或类型的参数时，作出不同的处理。

	//反转输入的参数
	function reverse(x: number | string): number | string {
	  if (typeof x === 'number') {
	      return Number(x.toString().split('').reverse().join(''));
	  } else if (typeof x === 'string') {
	      return x.split('').reverse().join('');
	  }
	}
	console.log(reverse(12345));//54321
	console.log(reverse('baidu'));//udiab

数组