一、基础了解
1、对象类型的最简单声明方法,就是使用大括号表示对象,在大括号内部声明每个属性和方法的类型
const obj:{
x:number;
y:number;
} = { x: 1, y: 1 };
// 对象obj的类型就写在变量名后面,使用大括号描述,内部声明每个属性的属性名和类型。
2.属性的类型可以用分号结尾,也可以用逗号结尾
// 属性类型以分号结尾
type MyObj = {
x:number;
y:number;
};
// 属性类型以逗号结尾
type MyObj = {
x:number,
y:number,
};
3.一旦声明了类型,对象赋值时,就不能缺少指定的属性,也不能有多余的属性。
type MyObj = {
x:number;
y:number;
};
const o1:MyObj = { x: 1 }; // 报错
const o2:MyObj = { x: 1, y: 1, z: 1 }; // 报错
// 变量o1缺少了属性y,变量o2多出了属性z,都会报错。
4.读写不存在的属性也会报错;也不能删除类型声明中存在的属性,修改属性值是可以的
const obj:{
x:number;
y:number;
} = { x: 1, y: 1 };
console.log(obj.z); // 报错
obj.z = 1; // 报错
// 读写不存在的属性z都会报错
const myUser = {
name: "Sabrina",
};
delete myUser.name // 报错:不能删除类型声明中存在的属性
myUser.name = "Cynthia"; // 正确:修改属性值是可以的
3.对象的方法使用函数类型描述
const obj:{
x: number;
y: number;
add(x:number, y:number): number;
// 或者写成
// add: (x:number, y:number) => number;
} = {
x: 1,
y: 1,
add(x, y) {
return x + y;
}
};
5.对象类型可以使用方括号读取属性的类型
type User = {
name: string,
age: number
};
type Name = User['name']; // string
6.除了使用type命令为对象声明一个别名,TS还提供了interface(接口)命令把对象类型提炼为一个接口
type Obj1 ={
x: number;
y: string
}
const objStr:Obj1 = {
x: 1,
y: 'obj1'
}
interface Obj2 {
x:number;
y:string
}
const obj2Str:Obj2 ={
x:1,
y:'obj2'
}
注意:
1.TS不分对象自身属性和继承属性,一律视为对象属性
interface MyInterface { toString(): string; // 继承的属性 prop: number; // 自身的属性 } const obj:MyInterface = { // 正确 prop: 123, }; // obj只写了prop属性,但是不报错。因为它可以继承原型上面的toString()方法。
2.用TS的对象声明方法用的const obj:{}:{}的形式;type命令定义别名的是type Obj = {};interface(接口)命令是 interface Obj {}
//对象声明类型方法 const obj:{ x:number; y:number; } = { x: 1, y: 1 }; // type命令声明 type Obj1 = { x: number; y: number } const Obj:Obj1 = { x: 1, y: 1 }; // interface(接口)命令定义类型 interface Obj2 { x:number; y:number } const obj:Obj2 = { x:1; y:1 }