typescript interface 接口

//interface

// 接口的原理

function createPerson(person:{name:string,sex:boolean}){

    console.log(person.name+person.sex)

}

//我们传入的对象参数实际上会包含很多属性，但是编译器只会检查那些必需的属性是否存在，并且其类型是否匹配

let onePerson={name:'iwan',sex:true,age:5}

let errorPerson={name:'wian',sex:false,aged:6666}

createPerson(onePerson);

---

 

interface PersonValue{

    name:string

    sex:boolean

    age?:number //可选属性 带有可选属性的接口与普通的接口定义差不多，只是在可选属性名字定义的后面加一个?符号。

    mobile?:string

    readonly real_name?:string //只读属性 只能在对象刚刚创建的时候修改其值,其余时间不可以

}

 

 

createPerson2(errorPerson)

 

//PersonValue接口就好比一个名字，用来描述上面例子里的要求。 它代表了有一个 name属性且类型为string,sex为boolean的      对象

function createPerson2(person:PersonValue){

    console.log(person.name+person.sex)

    if(person.age){

        console.log(person.age)

    }

    if(person.mobile){

        console.log(person.mobile)

    }

    console.log(person.real_name)

}

let twoPerson={name:'jeeny',sex:false,age:6,real_name:'段'}

let threePerson:PersonValue={name:'john',sex:true,real_name:'5555'}

createPerson2(twoPerson);

threePerson.real_name='666'   //error  不能继承 只读属性

//

let arr:ReadonlyArray<number>=[1,2,3]

arr[1]=5;  //error  报错 

 

 

 readonly vs const

// 最简单判断该用readonly还是const的方法是看要把它做为变量使用还是做为一个属性。 做为变量使用的话用 const，若做为属性则使用readonly。

---

函数类型

//接口能够描述JavaScript中对象拥有的各种各样的外形。 除了描述带有属性的普通对象外，接口也可以描述函数类型。

//为了使用接口表示函数类型，我们需要给接口定义一个调用签名。 它就像是一个只有参数列表和返回值类型的函数定义。参数列表里的每个参数都需要名字和类型。

interface functionValue{

    (age:number,gender:boolean,name:string):boolean

}

 let a_fun:functionValue;

 a_fun=function(age:number,gender:boolean,name:string){

     if(age>10){

        return true

                   

     }else{

         return false

     }

}

---

//可索引的类型

interface index{

    [index:number]:string

    [str:string]:string 

}

let arr2:index;

arr2=[1,'2']  //这个索引签名表示了当用 number去索引StringArray时会得到string类型的返回值。 否则报错