TypeScript静态类型
定义:静态类型一旦定义即不可改变,如我们的const,且继承了类型的api
let count : number = 1
//count为数字类型,不能为其他类型,同时count有了number的api,如toFiexd等等
基础静态类型和对象静态类型
基础静态类型 :加上数据类型
const count : number = 918
const myName : string = 'zhiwei'
//还有 null undefinde boolean void symbol 等等
对象静态类型
对象类型
const pelpeo :{
name:string,
age:number
} = {
name:'zhiwei',
age:18
}
数组类型
const xiaojiejie: string [] = [‘小姐姐1’, '小姐姐2', '小姐姐3']
//代表是数组里面的数据为字符串
class类型
class person{
}
const xxx : person = new person()
函数类型
const xx : () => string = ()=>{ return '字符串'}
函数返回一个字符串的值
类型注解和类型推断
当我们的ts能够分析我们的类型的时候,我们就不用写类型注解,当不能够分析的时候,就需要写类型注解了
类型注解:
:number 这就是一个注解 冒号加上一个类型就是注解
let count : number
count = 123
类型推断
通过值相加就可以推个总值的类型
这里total不需要给类型注解,因为通过one和two就可以推断出total的类型了
对象中属性的类型
const XiaoJieJie = {
name: "刘英",
age: 18,
};
工作使用问题(潜规则)
如果 TS 能够自动分析变量类型, 我们就什么也不需要做了
如果 TS 无法分析变量类型的话, 我们就需要使用类型注解
函数参数和返回类型的注解
函数返回类型的注解
//返回值为number
function getTotal(one: number, two: number): number {
return one + two;
}
const total = getTotal(1, 2);
//没有返回值 void
function a () : void {
xxx
}
等等
函数参数注解
//如果传入的为一个对象,刚学的同学可能会这样写
function getPeople({name:string, age:number}){
xxx
}
这是错误的
正确的写法
function getPeople({name,age} : {name:string, age: number}){
xxx
}
这里的意思就是一个参数需要一个注解,前面为参数,后面为注解
数组类型的注解
//写法
const numberArr : number[] = [1,2,3]
表示数组里面的每个数据都为number类型的
const stringArr: string[] = ['1','2']
表示数组里面的每个数据都为string类型的
还有undefined的,等等
混合类型
cosnt arr : (number | string)[] = [1,'1']
数组里面有对象的
cosnt person : {name:string, age: number}[] = [
{
name:'zhiwei',
age:18
}
]
也可以用接口之类的谢在一个地方
interface person {
name : string;
age:number;
}
cosnt person : person[] = [
{
name:'zhiwei',
age:18
}
]
interface接口
interface Girl {
name: string;
age: number;
bust: number;
}
const girl = {
name: "大脚",
age: 18,
bust: 94,
};
const screenResume = (girl: Girl) => {
girl.age < 24 && girl.bust >= 90 && console.log(girl.name + "进入面试");
girl.age > 24 || (girl.bust < 90 && console.log(girl.name + "你被淘汰"));
};
screenResume(girl);
interface和type的区别
interface写成类型对象的 形式
interface a {
name:string
}
type可以直接等
type name = string
?的使用
//判断一个类型是否拥有
name? : string 代表name如果有就为string,没有就不用管
允许加入任意值
interface a {
name:string;
[propname: string]: any; //这里表示属性名为string, 属性值为any
get():string //这里表示get方法,需要返回一个string的数据类型
}
接口的继承
interface a {
name:string;
[propname: string]: any; //这里表示属性名为string, 属性值为any
get():string //这里表示get方法,需要返回一个string的数据类型
}
interface b extends a {
age:number
}
这里b有所有a的类型定义和类型判断,还有自己的age的类型判断
枚举类型
创建枚举
enum 枚举名称 {成员1,成员2,...}
创建枚举通过enum关键字创建,关键字后面加上枚举名称,在后面加上花括号,花括号里面放入枚举的成员,枚举成员可以有多个。
枚举名称、成员名称首个字母大写,多个成员之间用逗号隔离。
//家庭枚举:妈妈,爸爸和我
enum Family {Mom,Father,Me}
使用枚举
枚举是一种类型,可以作为变量的类型注解
enum Gender {Female,Male}
let userGender:Gender
访问枚举中的成员,作为变量的值
userGender = Gender.Female
userGender = Gender.Male
注意:枚举中的成员只能访问,不能赋值
Gender.Female = '男' //错误
枚举的成员是有值的,默认从0开始自增。
我们把枚举成员为数字类型的成为数字枚举。
我们也可以给枚举成员初始化值:
enum Gender {Female = 1,Male}
//这样Female的值就为1,而且Male的值也会随之变化为2
enum Gender {Female = 1,Male = 100}
//Female的值为1
//Male的值为100
枚举成员为字符串的称为字符串枚举
字符串枚举没有自增长的值,所以字符串枚举必须有初始值
enum Gender {Female = '男',Male = '女'}
//Female的值就为男
//Male的值为女