TS对象类型
TS对象类型🌟(Object Types)
object: 用于表示非原始类型的值(即排除 number、string、boolean、null 和 undefined)
JS
let obj: object = { name: "Alice", age: 25 };
js
常见的对象是这样子:
let person= {}
当我们约定为对象:
let person: {} = {}
// {} 'person'
console.log(person,'person');
// 添加属性以后
let person: { name: string } = {
name: '同学'
}
console.log(person,'person');
// 输出的结果就是:
{name: '同学'}'person'
👉如果这个对象之中有方法呢
js
指定对象的多个属性类型时,使用 `;`(分号)来分隔
那我们的方法就写成了
let person: { name: string; sayHi(): void } = {
name: 'jack',
sayHi() {
console.log('sayHi');
}
}
console.log(person,'person');
优化一下我们上面的函数
通过换行来分隔多个属性类型,可以去掉 `;`
let person: {
name: string
sayHi(): void
} = {
name: 'jack',
sayHi() {console.log('sayHi');}
}
👉使用类型别名简化对象约束
js
// 创建类型别名
type Person = {
name: string
sayHi(): void
}
// 使用类型别名作为对象的类型
let person: Person= {
name: 'jack',
sayHi() {console.log('sayHi');return 'sayHi';}
}
console.log(person,'person');
接下来我们要调取上面对象之中的sayHi 方法,这个时候我们要传入一个参数type
js
// 创建类型别名
type Person = {
name: string
sayHi(type:string,total:string): void
}
// 使用类型别名作为对象的类型
let person: Person= {
name: 'jack',
sayHi(type,total) {
console.log('sayHi');
console.log(type,'type');
console.log(total,'total');
return 'sayHi';
}
}
console.log(person,'person');
👉把上面的方法改成我们的箭头函数形式
js
// 创建类型别名
type Person = {
name: string
sayHi:(type:string,total:string)=>void
}
// 使用类型别名作为对象的类型
let person: Person= {
name: 'jack',
sayHi(type,total) {
console.log('sayHi');
console.log(type,'type');
console.log(total,'total');
return 'sayHi';
}
}
console.log(person,'person');
👉但如果其实total并不需要呢
js
使用 ? 来表示,这个时候我们`person`对象上的`sayHi`方法就可以随意使用
type Person = {
name: string
sayHi:(type:string,total?:string)=>void
}
person.sayHi('type');