Interfaces in Typescript
Article Directory
The role of the interface
In object-oriented programming, an interface is a normative definition, which defines behavior and norms, and plays a restrictive and normative role. The interface defines the specifications that a certain class needs to follow. The interface does not care about the internal data and implementation details of the class. It only stipulates that certain methods must be provided in this batch of classes. The classes that provide these methods can meet the actual needs (that is, define standard)
property interface
Define the interface interface in ts
interface FullName {
firstName:string;
secondName:string
}
function printName(name:FullName) {
//必须包含firstName和secondName
console.log(name.firstName + '---' + name.secondName);
}
var obj={
age:20,
firstName:'z',
secondName:'s'
}
printName(obj) //传入的必须包含firstName和secondName，你可以利用obj传入多的值，但是你不能使用，比如使用了name.age就会报错
optional attributes
interface FullName{
firstName:string;
lastName?:string; //当你加了问号以后，这个属性就可传可不传，不加问号就一定要传，否则会报错
}
function getName(name:FullName){
console.log(name)
}
//参数的顺序可以不一样，但是一定要有要传的参数
getName({
firstName:'zhang'，
})
function type interface
Function type interface: Constrain the parameters and return values passed in by the method, and batch constraints can also be performed
Cryptographic Function Type Interface
interface encrypt{
(key:string,val:string):string
}
let md5:encrypt = function(key:string,val:string):string{
//模拟操作
return key+val
}
console.log(md5('zhang','san'))
//其他方法也可调用
let arr:encrypt = fuction(key:string,val:string):string{
return key+val
}
console.log(md5('li','si'))
indexable interface
Constraints on arrays and objects (not commonly used)
//对数组的约束
interface userArray{
[index:number]:string
}
var arr:userArray = ['aa','bb']
console.log(arr[0])
Class type interface: a constraint on the class, which is a bit like an abstract class abstract method
Understanding: That is, the parent defines a standard, and its subclass inherits it to implement the standard defined by the parent in the subclass
interface Animal{
//父定义一个标准
name:string;
eat(str:string):void;
}
class Dog implements Animal{
name:string;
constructor(name:string){
this.name = name
}
eat(){
//子类实现
console.log(this.name+'吃骨头')
}
}
var d = new Dog('小白')
d.eat()
interface extension
Interface extension: Interfaces can inherit interfaces
interface Animal{
eat():void;
}
interface Person extends Animal{
work():void;
}
class Web implements Person{
public name:string
constructor(name:string){
this.name = name
}
eat(){
console.log(this.name+'今天想吃憨八哥')
}
work(){
console.log(this.name+'今天的工作是干饭')
}
}
var w = new Web('小白')
w.work();
w.eat();
interface inheritance
interface Animal{
eat():void;
}
interface Person extends Animal{
work():void;
}
class Programmer {
public name:string
constructor(name:string){
this.name = name
}
coding(code:string){
console.log(this.name + code)
}
}
class Web extends Programmer implements Person{
constructor(name:string){
super(name)
}
eat(){
console.log(this.name+'今天想吃憨八哥')
}
work(){
console.log(this.name+'今天的工作是干饭')
}
}
var w = new Web('小白')
w.work();
w.eat();
w.coding('写代码')