جاوااسکریپت - آرایهای با اشیاء مختلف در تایپاسکریپت

چگونه میتوانم یک کلاس برتر در TypeScript تنظیم کنم وقتی که اشیاء مختلفی را که از یک کلاس واحد ارث میبرند در یک آرایه جمع میکنم تا TypeScript خطا نشان ندهد؟

من دارم این را به این شکل امتحان میکنم:

interface IVehicle{
    modelName: string
}

interface ICar extends IVehicle{
    numberOfDoors: number,
    isDropTop: boolean
}

interface IBike extends IVehicle{
    hasDynamo: boolean
}


var vehicles: IVehicle[] =
    [
        {
            modelName: "carModelName", // Error
            numberOfDoors: 4,
            isDropTop: true
        },
        {
            modelName: "bikeModelName",
            hasDynamo: true
        }
    ]

با این روش، من خطا میگیرم.

من فقط قادر هستم اشیاء رابط برتر IVehicle را اضافه کنم اگر نخواهم هیچ خطایی نشان داده شود.

پاسخ شماره ۱

پس از اصلاح خطاهای سینتکس، میتوانید نوع هر ورودی جداگانه در آرایه را مشخص کنید.

interface IVehicle {
    modelName: string
}

interface ICar extends IVehicle {
    numberOfDoors: number,
    isDropTop: boolean
}

interface IBike extends IVehicle {
    hasDynamo: boolean
}

let vehicles: IVehicle[] =
    [
        {
            modelName: "carModelName",
            numberOfDoors: 4,
            isDropTop: true,
        } as ICar,
        {
            modelName: "bikeModelName",
            hasDynamo: true
        } as IBike
    ]

یا فقط نوع آرایه را به یک آرایه از وسیله نقلیه، ماشین یا دوچرخه به این صورت تغییر دهید:

let vehicles: Array<IVehicle | ICar | IBike> =
    [
        {
            modelName: "carModelName",
            numberOfDoors: 4,
            isDropTop: true,
        },
        {
            modelName: "bikeModelName",
            hasDynamo: true
        }
    ]

اگر بعداً بخواهید تعیین کنید که یک IVehicle آیا IBike است یا ICar، میتوانید از محافظهای نوع تعریف شده توسط کاربر برای این کار استفاده کنید.

function isBike(vehicle: IVehicle): vehicle is IBike {
    return (<IBike>vehicle).hasDynamo !== undefined;
}

function isCar(vehicle: IVehicle): vehicle is ICar {
    return (<ICar>vehicle).numberOfDoors !== undefined;
}

function log(vehicle: IVehicle) {
    if (isBike(vehicle)) {
        // tsc knows vehicle is IBike
        console.log(vehicle.hasDynamo);
    } else if (isCar(vehicle)) {
        // tsc knows vehicle is ICar
        console.log(vehicle.numberOfDoors);
    } else {
        console.log(vehicle.modelName);
    }
}

میتوانید دربارهٔ آنها بیشتر در بخش نوعهای پیشرفتهٔ راهنما بخوانید.

شما همچنین میتوانید یک نمونه کاری از کل کد را در اینجا در محیط بازی پیدا کنید.