首页 前端知识 typescript学习笔记-基本类型声明

typescript学习笔记-基本类型声明

2024-10-27 22:10:03 前端知识 前端哥 40 747 我要收藏

ts的类型

类型例子描述
number1 -33,2.5任意数字
string“hi” “hello”任意字符串
booleantrue/false布尔值true或false
object{ name:“孙悟空”}任意js对象
array[1,12,345]任意js数组
tuple[1,12]元素,TS新增类型,固定长度数组
enumenum { A,B }枚举、TS中新增类型
自变量其本身限制变量的值就是该字面量的值
any*任意类型
unknown*类型安全的any
void空值(undefined)没有值(或undefined)
never没有值不是任何值

类型复合

使用 | 来链接多个类型,表示只需要满足其中之一的条件就行了

// "100" 就是字面量 
// | 就是或的意思
let a: "100" | "222"
let a: string | number

使用 & 表示 与 ,表示多个条件都要满足。

let j: {name:string} & {age: number}
j = {name: "孙悟空",age: 1}

type 类型的别名

相当给 类型 或复合类型 取个别名
相当于自己定义一个类型 这个类型是类型的集合

type myType = string | number | 3

let sss: myType

类型转换

let a:unknown

a=111
a="45"
a=true

let b:string
b= "hello"
a = b

// 报错 因为 b是广泛类型 赋值给 窄类型 
// b=a

// 解决报错方式一 可以手动加判断 
if(typeof a =="string") {
	b=a
}

// 解决报错方式二 这里相当于使用as 将unknow的范围缩小的
b = a as string;
// 解决报错方式三 这种写法和上面的是一样的
b = <string>a;

void 类型

void 用来表示空,以函数为例,就表示没有返回值的函数

// void 指返回为空 返回只能是下面的两种 不能是 return null
function fn(): void {
	return
}
function fn2(): void {
	return undefined
}
// 这个会报错
function fn3(): void {
	return null
}

never类型

never 表示永远不会返回结果

// 只有下面抛出错误才行 
function fnn(): never {
	throw new Error("")
}
// 报错 不能将类型“undefined”分配给类型“never”。
// return null 依旧报错 说明不能有return 同时必须抛出错误
function fnn2(): never {
	return 
}

object 对象的类型声明

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

一、基本限制
let bb :{
    name: string,
    age: number
}
// 赋值错误  不能缺少类型中定义了的值
// 类型 "{ name: string; }" 中缺少属性 "age",但类型 "{ name: string; age: number; }" 中需要该属性。
bb = {
    name: "John"
}
// 赋值错误 不能多赋值定义对象类型外的属性
// 不能将类型“{ name: string; age: number; sss: string; }”分配给类型“{ name: string; age: number; }”。
//   对象字面量只能指定已知属性,并且“sss”不在类型“{ name: string; age: number; }”中。
bb = {
    name: "John",
    age: 18,
    sss: "ss"
}
二、属性名后面加上?,表示属性是可选的
let aa : {
    name: string,
    // 这里的? 表示 赋值的时候可以有这个属性 也可以没有
    age?: number
}
aa = {
    name: "John"
}
三、统一设置对象属性类型
let aa : {
    name: string,
    // 这里的? 表示 赋值的时候可以有这个属性 也可以没有
    age?: number,
    // 因为不可能所有属性都去加? 工作量过大,所以使用下面的方式来 统一设置
    [propName:string]: any
}

aa = {
    name: "John",
    sss: ""
}

function 函数的类型声明

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

let fuss : (a:string,b:number)=>string
fuss =function(a,b) {
    return "ss"
}

array 数组类型声明

数组的类型声明:
类型[]
Array<类型>

let  f : string[]
let g : Array<string>

tuple 元组类型声明

元组,元组就是固定长度的数组
语法:[类型,类型,类型,类型…]

let tuple : [string,string,number]
// 报错=》 不满足声明元组的数量
tuple = ["12"]

// 报错=》 多了也不行
tuple = ["12","ss",44,ss]

enum 枚举类型声明

指在多个值直接选择时候,适合使用枚举。

enum 性别 {= 1,= 2,
    公公= 3 

}

let pension : {
    name: string,
    age: number
}
pension = {
    name: "Pension",
    age: 性别.公公
}
转载请注明出处或者链接地址:https://www.qianduange.cn//article/19282.html
标签
评论
发布的文章

JQuery中的load()、$

2024-05-10 08:05:15

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!