typeScript入门构建环境和数据类型

Posted 2021-01-11 tzzf

最近入坑v-cli 3.0,发现ts越来越常用了，于是开始入坑学习。

1.构建ts环境

npm install -g typescript

Mac和vscode用户可以用以下方式构建tsdemo项目

mkdir tsdemo && cd tsdemo && tsc --init

在生成的tsconfig.json中的配置“outDir”的值改成‘./js’

然后就是“终端”—>“运行任务”，监视tsconfig.json

最后新建一个index.html和index.ts,index.html引入的js路径是./js/index.js，因为index.ts会被编译到./js/index.js里。

2.ts的数据类型

布尔类型（boolean）

数字类型（number）

字符串类型(string)

数组类型（array）

元组类型（tuple）

枚举类型（enum）

任意类型（any）

null 和 undefined

void类型

never类型

 

1）布尔类型（boolean）

var flag:boolean=true;

2）数字类型（number）

var num:number=123;

3）字符串类型(string)

var str:string=‘this is ts’;

4）数组类型（array）

var arr:number[]=[11,22,33];

var arr:Array<number>=[11,22,33];

var arr3:any[]=[‘131214‘,22,true];

这两种定义数组的方式都是对的

5）元组类型（tuple）

元组类型允许表示一个已知元素数量和类型的数组

let arr:[number,string]=[123,‘this is ts‘];

6）枚举类型（enum）

为了考虑到一个变量有多种可能的值称为枚举类型。

enum Flag {success=1,error=2};

let f:Flag=Flag.error;

赋值的时候需要注意一下，它是:Flag，表示在这个枚举中取值。

7）任意类型（any）

any可以是其他的任意ts类型，用于不清楚变量的类型但又想为其指定类型

比如：var oBox:any=document.getElementById(‘box’);

8）null 和 undefined

默认情况下null和undefined是所有类型的子类型。 就是说你可以把 null和undefined赋值给任何类型的变量。但是你在开启strictNullChecks标记后，就需要在定义的时候，给你变量多种类型

var nums:number | null;

9）void类型 :typescript中的void表示没有任何类型，一般用于定义方法的时候方法没有返回值。

function run():void{

   console.log(‘run‘)

}

run();

10）never类型

never类型表示的是那些永不存在的值的类型，比如闭包

var a:never;

a=(()=>{

   throw new Error(‘错误‘);

})()