1.安装node
node -v
npm -v
查看node对应支持的版本，最好node支持在14.0版本以上，npm支持在6.0版本以上
网络异常，图片无法展示
|
2.全局安装typescript
npm install -g typescript
cnpm install -g typescript
yarn add global typescript
// 查看对应的typescript版本
tsc -v
3.Typescript开发工具vscode自动编译.ts文件
- 创建tsconfig.json文件 tsc --init 生成配置文件
- 并把outDir改成./js
网络异常，图片无法展示
|
- 版本vscode点击：终端 -> 运行任务 -> tsc：监视-tsconfig.json 然后就可以自动生成代码了
网络异常，图片无法展示
|
- 选择typescript
网络异常，图片无法展示
|
- 选择监视-tsconfig.json
网络异常，图片无法展示
|
[typescript中的数据类型]
typescript中为了使编写的代码更规范，更有利于维护，增加了类型校验，在typescript中主要给我们提供了以下数据类型
布尔类型（boolean）
// es5的写法 （正确写法） ts中（错误写法） var flag=true flag=456 // Typescript中为了使编写的代码更规范，更有利于维护，增加了类型校验 // 写ts代码必须指定类型 var flag:boolean=true // flag=123; //错误 flag=false; //正确 console.log(flag); 复制代码
数字类型（number）
var num:number=123; num=456; console.log(num); /正确/ num = 'str'; //错误 复制代码
字符串类型(string)
var str:string='this is ts'; str='haha'; //正确 str=true; //错误 复制代码
数组类型（array）
// 数组类型（array） ts中定义数组有两种方式 // var arr=['1','2']; //es5定义数组 // 1.第一种定义数组的方式 var arr:number[]=[11,22,33]; console.log(arr); //2.第二种定义数组的方式 var arr:Array<number>=[11,22,33]; console.log(arr) 复制代码
元组类型（tuple）
// 元组类型（tuple） 属于数组的一种 var arr:Array<number>=[11,22,33]; console.log(arr) //元祖类型 let arr:[number,string]=[123,'this is ts']; console.log(arr); 复制代码
枚举类型（enum）
随着计算机的不断普及，程序不仅只用于数值计算，还更广泛地用于处理非数值的数据。
例如：性别、月份、星期几、颜色、单位名、学历、职业等，都不是数值数据。 在其它程序设计语言中，一般用一个数值来代表某一状态，这种处理方法不直观，易读性差。 如果能在程序中用自然语言中有相应含义的单词来代表某一状态，则程序就很容易阅读和理解。 也就是说，事先考虑到某一变量可能取的值，尽量用自然语言中含义清楚的单词来表示它的每一个值，
这种方法称为枚举方法，用这种方法定义的类型称枚举类型。
enum 枚举名{ 标识符[=整型常数], 标识符[=整型常数], ... 标识符[=整型常数], } ; enum Flag {success=1,error=2}; let s:Flag=Flag.success; console.log(s); // 1 enum Flag {success=1,error=2}; let f:Flag=Flag.error; console.log(f); // 2 enum Color {blue,red,'orange'}; var c:Color=Color.red; console.log(c); //1 如果标识符没有赋值 它的值就是下标 enum Color {blue,red=3,'orange'}; var c:Color=Color.red; console.log(c); //3 var c:Color=Color.orange; console.log(c); //4 var Err; (function (Err) { Err[Err["undefined"] = -1] = "undefined"; Err[Err["null"] = -2] = "null"; Err[Err["success"] = 1] = "success"; })(Err || (Err = {})); var e = Err.success; console.log(e); 复制代码
任意类型（any）
null 和 undefined
void类型
typescript中的void表示没有任何类型，一般用于定义方法的时候方法没有返回值。
never类型
是其他类型 （包括 null 和 undefined）的子类型，代表从不会出现的值。这意味着声明never的变量只能被never类型所赋值
any类型
let notSure: any = 4 notSure = 'maybe it is a string' notSure = 'boolean' // 在任意值上访问任何属性都是允许的： notSure.myName // 也允许调用任何方法： notSure.getName() 复制代码
总结小练习
let isDone: boolean = false // 接下来来到 number，注意 es6 还支持2进制和8进制，让我们来感受下 let age: number = 10 let binaryNumber: number = 0b1111 // 之后是字符串，注意es6新增的模版字符串也是没有问题的 let firstName: string = 'viking' let message: string = `Hello, ${firstName}, age is ${age}` // 还有就是两个奇葩兄弟两，undefined 和 null let u: undefined = undefined let n: null = null // 注意 undefined 和 null 是所有类型的子类型。也就是说 undefined 类型的变量，可以赋值给 number 类型的变量： let num: number = undefined 复制代码
Array和Tuple，数组和元祖
Typescript 文档地址：Array和Tuple
元组中的元素可以是不同类型，而数组只能是相同类型的，除此之外，其它属性与方法与数组一致。
//最简单的方法是使用「类型 + 方括号」来表示数组： let arrOfNumbers: number[] = [1, 2, 3, 4] //数组的项中不允许出现其他的类型： //数组的一些方法的参数也会根据数组在定义时约定的类型进行限制： arrOfNumbers.push(3) arrOfNumbers.push('abc') // 元祖的表示和数组非常类似，只不过它将类型写在了里面 这就对每一项起到了限定的作用 let user: [string, number] = ['viking', 20] //但是当我们写少一项 就会报错 同样写多一项也会有问题 user = ['molly', 20, true] // 元组类型定义 let myTuple1: [number, string, boolean] = [1, 'Poplar', true]; // 正确 let myTuple2: [number, string, boolean, any] = [1, 'Poplar', true]; // 长度不符 let myTuple3: [number, string] = [1, 'Poplar', true]; // 长度不符 let myTuple4: [string, number, string] = [1, 'Poplar', true]; // 类型不符 let myTuple5 = [1, 'Poplar', true]; // 类型推断,等同 let myTuple5: (string | number | boolean)[] let myTuple6 = new Array(1, "ts", false); // 错误：数组中元素类型必须相同 let myTuple7: (string | number | boolean)[] = [1, “ts”, false, 2, true, “js”]; // 正确，长度没有限制
