// -------------------------- 04-接口interface、对象类型的使用
/**
* 1、interface接口使用
*/
/**
* 1、 interface
*
* 知识点
* 1、重名 会 重合
* 2、任意key (常用于接口返回的res 不想全拿回来 只想要部分数据 不想一个个的定义类型 就可以使用任意key)
* 3、? 可有可无
* 4、readonly 只读属性
* 5、interface继承 (相当于重合 合在一起 关键字extends)
* 6、定义函数类型
*/
// 首先注意 key不能少 也不能多 两者必须一致 -- 强校验
interface A extends B {
name:string,
like:boolean,
[result:string]:any, // 任意key -- 除了A里面强校验数据 其他数据你随便吧 any了 result是随便定义的 [xxx:strign]:any
// '?' 正常来说 我们再interface下定义了数据类型 那么使用这个的对象 他的属性就要和他保持一致
// 不能多不能少不然就报错 但是有时候可能我们的某个数据 可能后端给 可能不给 所以可以使用这个
user?:string, // 没有也可以 有就校验
readonly id:number, // 只读属性
readonly fn:()=>{}, // 只读属性
}
interface A { // 此时发生重名的情况 A和A 那么就会重合
age:number
}
interface B{ // 演示一下继承 让A 继承 B 的东西 通过关键字extends
xxx:number
}
// 2、对象类型的使用
let obj:A = {
name:'1',
like:false,
age:2000,
a:1, // 任意key
b:3, // 任意key
c:'false', // 任意key
d:{
name:'1' // 任意key
},
id:1,
fn:()=>{return false},
xxx:1
}
// 可能有人会尝试修改 id 或者修改函数的返回值 但是我们并不希望别人修改这个东西 所以我们可以给他设置成只读属性
// obj.id = 2
// obj.fn = ()=>{return true}
interface fn{
// (xxx函数的参数):return函数的返回值
(name:string):number[] // 这个函数有一个参数name 数据类型是string类型 他的返回值是一个数字类型的数组
}
const changText:fn = (name)=>{
console.log(name);
return [1,2,3]
}
changText('悟空')
原创:前端-悟空 请勿抄袭 可以转载