typescript笔记 2022最新

动态监听ts文件变动，自动编译js

//后面加上-w即可。 代表watch的意思
tsc index.ts -w

//若已经有配置文件存在,无需手动指定ts文件。可同时监听所有ts
tsc -w

生成ts配置文件

tsc --init

类型约束的基本语法

函数括号后的string 代表此函数的返回值必须是string类型
function add(test:number,test2:number):string{     
if(test==test2){
 return '我是字符串';
  }
}

ts的类型：
1.number类型： 数字类型统一为number类型，跟原生js一样，不区分float double int等。
2.boolean类型：跟原生js一样，true或者false
3.string类型： 跟原生js一样 字符串类型。支持ES6模板字符串
4.array类型：：

声明数组
代表这个数组只能装string类型的数据
let arr:string[]=[];
arr.push("123") √
arr.push(123)  ×

泛型的方式
let arr:Array<string>= [];

5.null类型与undefined类型:null类型代表一个对象不存在的值，空指针。undefined代表初始化未指定值。

声明为空后，后续也只能是unll和undefined
const a:null=null;
const b:undefined=undefined

6.any类型:代表任意类型，使用any类型间接性代表不让ts对此变量进行任何变量约束检测。 不建议使用。

const a:any;
a=100;
a="30"
a=true;
以上行为都可以通过编译。

const a;  如果声明变量不指定类型，那么ts解释器会自动隐式的追加此变量为any类型。

7.unknown： 代表未知的类型，跟any类似。不同的是，它是安全的未知类型， 一个被声明unknown类型的变量，不能再次被赋值给其他变量

const b:unknown;
b=30;√
b=true;√
const a:string;
a=b ×  不能将unknown类型赋值给其他变量，即使上面已经初始化为30或true


const c:unknown;
c = b; √   可以将unknown类型的变量再次赋值给unknown类型


const d:any;
d= b; √ 可以将unknown类型赋值给any类型；


有一种情况，由于unknown可以初始化为任何变量类型，所以一旦类型确定后，我们可以通过typeof判断，来将类型赋值给新的同种类型。例如
const b:unknown;
b=30;
const c:number;
if(typeof b==number){  因为有了判断 所以只有为number的时候才会赋值，编译是可以通过的。
  c =30; √
}
或者使用类型断言
c = b as string; √
或者使用泛型
c = <string> b; √

总结：unknown类型理论上不能赋值给任何类型，
但是它可以赋值给any类型和赋值给自己本身的unknown类型。
 还有一种方法就是使用typeof判断或者类型断言，也可以实现将unnown类型赋值给其他类型。

8.void类型： 一般用于函数中，定义函数的返回值为空。如果不加，函数隐式返回值就是void

function test():viod(){}

9：never类型：表示函数永远不会有返回值。（不常用）

function test():never{
  whlie(true){

   }或者
throw new Error '' 抛出异常。
有返回值代表此程序正常，无返回值 通常是程序异常中止，或者无限循环。
}

10：对象的声明与使用

普通对象
let user = {name:"张三"}
增加类型约束的方式
let user:{name:string}  //先声明这个对象的结构
user = {name:"张三"}// 根据结构赋对应的值

设置可选的值
let user:{name:string,age?:number}//携带问号表示此参数可选，实例化传参的时候age是可选的
user = {name:"张三"} √

设置可选值的情况下，同时设定可选值的类型也是可选的
let user:{name:string,age?:any}  //any表示任意类型
user={name:"张三"} √
user ={name:"李四",age:30} √

除了限定好的参数外，允许传入其他未知属性
let user:{name:string,age:number,[propName:string]:any}// 数组表示可以传N个未知属性，propName:string表示任意属性名称，并且是string类型， 最后any表示可以传入的值，any表示可以传入任意类型的值。
user = {name:"张三",age:30,fat:555}  √

11.函数的声明规范

跟对象类似，要先定义一个函数的格式模板
let  testFn:(name:number,age:number)=>number;
利用上面的函数模板 新建一个函数
  testFn = (name:number,age:number)=>name+age;

或者普通函数
testFN = function(name:number,age:number){
  return name+age;
 }
使用
testFn(1,2);

都需要按照testFn的类型约束定义函数

上面的写法等价于
testFn:(name:string)=>string = function(test:string){ return name+'你好' };
这个函数意思就是 声明了一个函数的模板必须包含一个参数 并且类型为string。 返回值为string。
接着直接用这个模板声明了一个匿名函数function(test:string)，也是一个实例化的过程。

12:联合类型声明： 就是除了可以声明一个类型外，可以额外指定N个其他类型

代表除了string之外 还可以是number类型      逻辑或语法
 let name:string|number
也可以给数组约束多个类型的值
let arr:(string|number)[] = ["123",123]

12.1. 用字面量的方式声明一个变量

let sex:0;
sex = 0; √
sex=1; × 
以上只能分配为1，相当于一个常量，除了0以外 其他都不能赋值。

可以用于变量只有预期的1-2种情况，例如
   let sex: '0' | '1' = '1';
    sex = '0';
代表sex声明了一个类型 类型可以是0或者1. 将来赋值更改 也只可以从0和1之间选择