初识typescript 初识typescript

诞生背景起源于使用JavaScript开发的大型项目。由于JavaScript语言本身的局限性，难以胜任和维护大型项目开发。因此微软开发了Typescript ，使得其能够胜任开发大型项目。
TS与JS的关系相关

以js为基础
是js的超集
可以在支持js的平台执行
拓展了js的类型，
不能被js解析器直接执行，需要转化为js

增加

类型
支持es新特性
添加了es没有的新特性
丰富的配置选项：例如可以配置编译后的es版本，兼容性高
强大的开发工具

简单了解声明方式

声明时指定变量类型

let a: string; a = 'dddd'

声明时直接赋值

let b:boolean=true

如果变量的声明和赋值是同时进行的，ts可以自动对变量进行类型检测,ts编译成js默认是es3规范

let c=false c=1//报错

4.1 js中的函数是不考虑参数的类型和个数的

function sum(a,b) { return a+b } console.log(sum(123,456))// 579 console.log(sum(123,'456'))//'123456'

4.2 指定函数类型：参数类型和返回值类型类型名小写

function sum(a:number,b:number):number { return a+b } let result =sum(333,333)

基本类型
以下是除了number，string，boolean等基本数据类型

字面量

1.1 使用字面量进行类型声明，相当于赋值成常量

let a: 10 a = 10 a = 11//报错

1.2 也可以使用 | 来链接多个类型(联合类型)

let b: 'male' | 'female' b = 'female' b = 'male'let c:boolean | string c=true c='dd'

2.1 any表示任意类型，一个变量设置类型为any后相当于对该变量关闭了ts的类型检测,使用ts时，不建议使用any

let d:any d='33' d=22

【初识typescript】2.2 声明变量如果不指定类型，则ts解析器会自动判断变量的类型为any(隐式any)

let e e=33 e='ddd'

unknown 表示未知类型的值

let f:unknown; f=88 f=true f='ddd'

注1 any类型可以赋值给任意变量，且不会报错，但会改变原变量类型(暂定了解的是这样)

let e let g:boolean g=e//不会报错

注2 unknown实际上是一个类型安全的any，不能直接赋值给其他变量

let f:unknown; let s :string s=f//报错 if(typeof f==='string'){ s=f }

注3 类型断言，可以用来告诉解析器变量的实际类型,两种都可以
一般形式有个 变量 as 类型 or <类型>变量

s=f as string; s=f;

void 用来表示空，以函数为例，就表示没有返回值的函数，或者返回undefined，null

function fn():void{}

never 表示永远不会返回结果，一般用来报错

function fn2():never{ throw new Error('报错了') }

object 表示一个js对象

let aa:object; aa=function () {}

{}用来指定对象中可以包含哪些属性
语法：{属性名：属性值，属性名：属性值}
在属性名后面加上？，表示属性是可选的

let bb:{name:string,age?:number} bb={name:'dd'}

[propName:string]:any} 表示任意类型的属性，[propName:string]表示属性名是string

let cc:{name:string,[propName:string]:any}; cc={name:'dd',age:111,gender:'女'}

设置函数结构的类型声明
语法：(形参：类型，形参：类型。。。)=>返回值

let dd:(a:number,b:number)=>number

array数组的类型声明
类型[]orArray<类型>

let ee:string[] let ff:Array

元祖就是固定长度的数组
语法：[类型，类型，类型]

let gg:[string ,string ] gg=['ss','ddd']

enum枚举

enum Gender{ Male=0, Female=1 } let i:{name:string,gender:Gender} i={name:'dd',gender:Gender.Male}

注4 & 表示同时具有

let j:{name:string }&{age:number} j={name:'dd',age:33}

注5 类型的别名

type myType=1|2|3|4|5 let k:myType let l:myType

拓展了解
类型声明

类型声明是TS非常重要的一个特点；
通过类型声明可以指定TS中变量（参数、形参）的类型；
指定类型后，当为变量赋值时，TS编译器会自动检查值是否符合类型声明，符合则赋值，否则报错；
简而言之，类型声明给变量设置了类型，使得变量只能存储某种类型的值；
语法：

let 变量: 类型; let 变量: 类型 = 值; function fn(参数: 类型, 参数: 类型): 类型{ ... }

自动类型判断

TS拥有自动的类型判断机制
当对变量的声明和赋值是同时进行的，TS编译器会自动判断变量的类型
所以如果你的变量的声明和赋值时同时进行的，可以省略掉类型声明

类型：

类型例子描述 number1, -33, 2.5 任意数字 string'hi', "hi", hi任意字符串 boolean true、false布尔值true或false 字面量其本身限制变量的值就是该字面量的值 any *任意类型 unknown *类型安全的any void空值（undefined）没有值（或undefined） never没有值不能是任何值 object{name:'孙悟空'}任意的JS对象 array[1,2,3] 任意JS数组 tuple[4,5]元素，TS新增类型，固定长度数组 enumenum{A, B}枚举，TS中新增类型

相关学习链接：
文档学习链接：https://github.com/JasonkayZK/typescript_learn
学习视频链接：https://www.bilibili.com/video/BV1Xy4y1v7S2?from=search&seid=15602557276237461916