接口的作用
在面向?qū)ο蟮木幊讨校涌谑且环N規(guī)范的定義辐马，它定義了行為和動(dòng)作的規(guī)范佑惠， 在程序設(shè)計(jì)里面，接口起到了限制和規(guī)范的作用
接口定義了某一批類(lèi)所需要遵守的規(guī)范，接口不關(guān)心這些類(lèi)的內(nèi)部狀態(tài)數(shù)據(jù)膜楷，不關(guān)心類(lèi)方法里面實(shí)現(xiàn)的細(xì)節(jié)旭咽，它只規(guī)定這批類(lèi)里面必須提供某些方法，
提供這些方法的類(lèi)就可以滿足實(shí)際需要
接口的類(lèi)型： 屬性赌厅、函數(shù)穷绵、可索引和類(lèi)等；
1. 屬性接口
interface FName {
fName: string;
sName: string
}
function say(foo:FName):string {
return `我的名字叫 ${foo.fName + foo.sName}`;
}
// 正確的 傳入的參數(shù)需要符合接口的定義
console.log(say({fName: '胡', sName:'火鍋'}));
let bar = {
fName: '胡',
sName:'火鍋',
age: 4
}
// 正確的, 定義在外的對(duì)象
console.log(say(bar));
// 錯(cuò)誤
// console.log(say({firstName: '胡', secondName:'火鍋', age: 4}));
可選屬性
interface FName {
fName: string;
sName: string;
age?:number; // 可選的屬性
}
function SayName(foo:FName):string {
return `我的名字叫 ${foo.fName + foo.sName}`;
}
console.log(SayName({fName: '胡', sName:'火鍋', age: 4}));
console.log(SayName({fName: '胡', sName:'火鍋'}));
2. 函數(shù)接口
對(duì)函數(shù)傳入的參數(shù)及返回值進(jìn)行約束
interface Say {
// 函數(shù)的參數(shù) 函數(shù)的返回值
(fname:string, age: number):string
}
// 正確的
const speak:Say = function (fname:string, age:number):string {
return `我的名字${fname}, 年齡為${age}`;
}
const say:Say = (fname:string, age:number):string => {
return `我的名字${fname}, 年齡為${age}`;
}
// 函數(shù)接口中的可選參數(shù)
/*
interface Say {
(fname: string, age?: number):string
}
// 如果age 不傳值會(huì)變成undefined
const speak:Say = function (fname:string, age?:number):string {
return `我的名字${fname}, 年齡為${age}`;
}
const say:Say = (fname:string, age?:number):string => {
return `我的名字${fname}, 年齡為${age}`;
}
*/
3. 可索引接口
對(duì)數(shù)組特愿、對(duì)象的約束
數(shù)組的約束
interface ArrIndex {
[index: number]:string
}
let arr:ArrIndex = ['1', '2'];
對(duì)象的約束
interface OPropName {
[propName: string]:string
}
let obj:OPropName = {
1: 'a'
}
3. 類(lèi)類(lèi)型接口
對(duì)類(lèi)的約束 (類(lèi)似抽象類(lèi))
// 回顧 抽象類(lèi)
/*
abstract class Animal {
abstract fname:string; // 抽象屬性
abstract eat(food:string):void // 抽象方法
}
class Dog extends Animal {
fname:string;
constructor(n:string) {
super();
this.fname = n;
}
eat(food:string) {
console.log(`${this.fname}喜歡吃${food}`)
}
}
*/
// 定義類(lèi)類(lèi)型接口
interface Animal {
fname:string;
eat(food:string):void
}
class Dog implements Animal {
fname:string;
constructor(n:string) {
this.fname = n;
}
eat(food:string) {
console.log(`${this.fname}喜歡吃${food}`)
}
}
let dog = new Dog('可樂(lè)');
console.log(dog);
dog.eat('胡蘿卜');
