Skip to content

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并不需要呢

image.png

js
使用 ? 来表示,这个时候我们`person`对象上的`sayHi`方法就可以随意使用

type Person = {
        name: string
        sayHi:(type:string,total?:string)=>void
}
person.sayHi('type');

Released under the MIT License.