TypeScript

TS搭建环境，基本类型，配置选项

以js为基础，进行扩展，添加了类型

可以在任何支持js的平台中执行

TS不能被js解析器直接执行，需要编译 ，可以编译成任意js版本

搭建环境

下载编译器： npm i -g typescript

检验是否完成： tsc

新建记事本，后缀改成ts，用vscode打开

在文件夹里面打开终端，输入

tsc 文件名（加后缀）

会生成一个同名js文件

类型

类型声明

指定类型后，变量只能存储指定类型

let a: number;
a = 10;
a = 'hello';//会报错
let b: boolean = true;

//如果声明和赋值同时进行，ts会自动判断变量类型(字面量)，变量值就固定了，不能更改
let c = 'hello';
//可以将以下多个字面量赋值给c
let c = "male" | "female";
//联合类型
let c:boolean | string;
c = true;
c = "hello";

//可以用于规定参数类型 和 返回值类型
function sum(x:number,y:number):number{
    return a + b;
}

每次修改都要重新编译，要看效果，新建一个html文件，导入js文件

基本类型

any

任意类型，设置为any后相当于关闭了ts类型检测，不建议使用

声明变量时不指定变量类型，编译器会自动设置为any

any类型变量可以赋值给任意变量

unknow

安全any类型

unknow类型变量不可以赋值给其他变量

//类型断言,告诉解析器变量实际类型
let s: string;
let e: unknow;
e = "hello";
 
s = e as string;
s = <string>e;

void

表示空

function fn():void{
//没有返回值
}

never

没有值，表示永远不会返回结果，抛出异常时可用

object

let a:object;

//定义对象    必须按照以下的格式赋值，不能出现其他属性
//属性名？   代表可选
//[属性名：属性名类型]:any   任意数据
let b:{name:string,age?:number，[propName:string]:any};

//定义函数方法   (形参：类型，......):返回值类型
//参数和其类型需一一对应  
let d: (a:number,b:number) => number;
d = function(n1,n2):number{
    return n1 + n2;
}

//数组声明类型
//  类型[]
//  Array<类型>
let e : string[];
e = ['a','b'];

let f : Array<number>;
    
//元祖：固定长度的数组  [类型，类型.....]
let g : [string,number];
h = ["hello",123]

//&表示并且，同时有
let h = {name:string} & {age: number };
h = {name:'孙悟空'，age：18}

enum

在几个值之间选的值，例如性别，星期，可用数字表示，节省空间

enum Gender{
    Male,
    Female 
}
//使用时会变成数字（具体是几不重要）

let i :{name:string,gender:Gender};
i = {
    name:"sunwuk"
    gender:Gender.Male
}

//表示

类型别名

type myType = 1 | 2 | 3 | 4;
let k = myType;

编译选项

监视ts单个文件

tsc 文件名.ts -w

监视所有ts文件

在项目下新建tsconfig.json

{   /* 
    ts配置文件，根据此文件信息对代码进行编译
    include 指定要编译的文件 /** 表示任意目录    /*表示任意文件
    exclude 指定不用编译的文件
    extends 继承配置文件
    files  指定被编译的列表，一个一个写文件名，文件少时用
    */
    "include":[
        "./src/**/*",
        "./data/**/*"
    ],
    "exclude":[
        "./src/**/*"
    ]  
}

在项目目录下输入tsc 或者 tsc -w

compilerOptions

有很多子选项，很多选项默认为false

{
    "compilerOptions":{
        {   /*
            target ：用来指定ts被编译为js的版本
    通用技巧：传错误值，报错会显示可选版本
            */
            "target":"es6",
            //module    指定要使用的模块化规范
            "module":"es6",
        	//lib    指定要使用的库,默认不用动
        
        	//outDir   指定编译后的js文件所在目录
			"outDir":"./dist",
        	//outFile  将代码合并成一个文件（编译后的js文件）
        	//是否对js文件进行编译，默认false
        	"allowJs":true,
        	//checkJs  检查js是否符合语法规范，默认false
        	"checkJs":true,
        	//removeCommons  是否移除注释，默认false
        	"removeCommons":true,
        	//noemit  不生成编译后的文件(少用）
        
        	//noEmitOnError  ts代码有错误时不编译
        	"noEmitOnError":true,
        	//alwaysStript   设置编译后的文件是否使用严格模式
        	"alwaysScript":true,
        	//noImplicitAny不允许隐式any类型
        	"noImplicitAny":true,
        	//noImplicitThis  不允许隐式this，不明确的
        	
        	//stricNullChecks  严格检查空值
        	"stricNullChecks":true
        	//strict  所有严格检查总开关，一般设置为true，写在所有严格选项前面
        }
    }
}