TypeScript-3.接口(interface)

博客围绕接口展开,介绍了接口的可选属性和只读属性,实现接口时接口方法须在继承类实现,接口可多继承,还说明了接口继承类时会继承类成员但不包括实现。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.接口

 (1) ? ----- 可选属性

 (2) readonly ----- 只读属性(只能在对象刚刚创建的时候修改其值)

interface Config {
    width: number,
    height: number,
    color? : string,
    readonly name: string
}

let config: Config = {width: 20, height: 30, color: "black", name: 'mySquare'}
// config.name = 'mySquare2'; // error!
function createSquare(config: Config): {color: string; area: number} {
    let newSquare = {color: "white", area: 100};
    // 可选属性使用
    if (config.color) {
      newSquare.color = config.color;
    }
    if (config.width && config.height) {
      newSquare.area = config.width * config.height;
    }
    return newSquare;
}
  
let mySquare = createSquare(config);

2. 实现接口

(1) 接口方法 ----- 必须在继承类实现

interface ShapeConfig {
    getArea(): number
}

class Square implements ShapeConfig {
    private _width: number;
    private _height: number;
    constructor (width: number, height: number) {
        this._width = width;
        this._height = height;
    }

    
    public get width() : number {
        return this._width
    }
    
    public get height() : number {
        return this._height
    }

    getArea(): number {
        return this.width * this.height
    }
}

let square = new Square(20, 30);
let area = square.getArea();
console.log(area)   // 600

3. 继承接口

(1) 接口继承 --- 接口可多继承

interface SquareConfig extends ShapeConfig, Config{
    shape: string
}

let squareConfig = <SquareConfig> {};
squareConfig.shape = 'Square';
squareConfig.color = 'red';

4. 接口继承类

(1) 接口继承了一个类类型时,它会继承类的成员但不包括其实现

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值