TS基础用法

JS的升级版
下载依赖包

npm i typescript -g

下载之后,验证

tsc -v

ts文件转换成js文件

tsc  ts文件名

声明普通类型

let str: string = "str"
let num: number = 12
let num: number = undefined
let num: number = null
let flaf: boolean = true
// undefined和null是所有类型的子集
let und: undefined = undefined
let nul: null = null

当一个变量有多个类型,使用联合类型或 – |

let count: string | number = "true"

any – 所有类型(一般在TS中不使用,丧失了TS的功能)

let num : any = {}

通过ts定义对象 – interface => 接口 ,起名字有个隐士规则,大写的I,就是接口的意思

readonly:只读属性
interface IuserInfo {
    // 只读属性,对只读属性重新赋值时会报错
    readonly use_name:string,
    use_pwd:number,
    // 非必选项
    remember?:boolean
}
let obj:IuserInfo = {
    use_name:"张三",
    use_pwd:22,
   remember:true 
}
// 这里会报错
obj.user_name = "aaa"

对数组验证【数组合并了相同类型的对象】

let arr: [number,number,number] = [1,2,3]

元组验证【元组(Tuple)合并了不同类型的对象】【元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同】

let arr: [number , string] = [11 , 'str']

枚举 – enum【在一个范围中选取其中一个】
两种写法
获取数值:1)Euble.Up – 下标 2)Euble[0] – key
写法一:

enum Euble{
    Up,
    Down,
    Left,
    Right
}

js写法

var Eublr;
(function (Eublr) {
	Eublr[Eublr["Up"]=0] = "Up";
	Eublr[Eublr["Down"]=1] = "Down";
	Eublr[Eublr["Left"]=2] = "Left“;
	Eublr[Eublr["Right"]=3] = "Right";
})(Eublr || (Eublr = {}));
console.log(111);

写法二:(IDE知识)

enum Euble{
    U = "UUUU",
    D = "DDDD",
    L = "LLLL"
}
console.log(Euble.U)  -- UUUU
console.log(Euble[1]) -- undefined

泛型 – Generics – 一般在函数上使用 – 指定数据类型,充当占位符,先占一个位置,在后面使用的时候可以读取类型,在后面有任意的操作,就可以捕捉到是否正确

// echo(arg:string) -- 给参数定义类型
// echo(arg:string):string -- 给返回值定义类型
function echo(arg:string):string{
    return arg
}
console.log(echo("sss"))

如果函数的返回值为空
void:函数没有返回值

function echo(arg:string):void{
    // 这时写return返回值时会报错
    // return arg
}
console.log(echo("sss"))
// 第一个--T:相当是占位的作用,是指定的类型,具体是什么数据类型只有使用的时候才知道
// 第二个--T:与第一个T一模一样,是指定的类型,具体是什么数据类型只有使用的时候才知道
// 第三个--T:返回的T,返回值是T数据类型
function echo<T>(arg:T):T{
    return arg
}
let res = echo("111")

约束性泛型
因为代码的运行顺序是从上往下,函数中的T只是起到占位的作用,在这里不知道是什么数据类型,所以输出tuple.length会提示有错误,不智能,这只就要用到约束性泛型,就是把泛型和接口合并

function swap<T>(tuple:T):T{
    // 约定了数据类型要有字符长度
    console.log(tuple.length)
    return tuple
})
let res = swap("111")

就是把泛型和接口合并

interface IApi{
    length?:number
}
// extends:继承,通过extends继承length的属性
function swap<T extends IApi>(tuple:T):T{
    console.log(tuple.length)
    return tuple
}
let res = swap("111")

类型别名,通过type进行定义

interface IApi{
    length?:number,
    push:any
}
interface IApi2{
    length?:number,
    push:any
}
type abc = IApi & IApi2
上一篇:vue数据持久化 (刷新后数据不重置)


下一篇:Object.create()、new Object()和{}