javascript - 如何在 typescript 中使用抽象类

Question

我正在尝试(以简化的方式)将以下示例移植到 typescript ，因为我想在 typescript 中演示抽象工厂模式。

https://gerardnico.com/wiki/lang/java/dao

到目前为止，我创建的代码如下(仅结构)

export default class Customer{
    public id: string;
    public firstName: string;
    public lastName: string;
}


import Customer from "./Customer";

export default interface ICustomerDAO{
    insertCustomer(): number;
    deleteCustomer(): boolean;
    findCustomer(): Customer;
    updateCustomer(): boolean;
    listCustomers(): Customer[];
}


import CustomerDAO from "./ICustomerDAO";
import SharepointListDAOFactory from "./SharepointListDAOFactory";
import JsonDAOFactory from "./JsonDAOFactory";


export default abstract class DAOFactory{
    public static SHAREPOINTLIST: number = 1;
    public static REMOTEJSON : number = 2;

    public abstract getCustomerDAO(): CustomerDAO;

    public  getDAOFactory(whichFactory: number): DAOFactory {

      switch (whichFactory) {
        case 1: 
            return new SharepointListDAOFactory();
        case 2: 
            return new JsonDAOFactory();      
        default  : 
            return null;
      }
    }
}


import DAOFactory from "./DAOFactory";
import ICustomerDAO from "./ICustomerDAO";
import JsonCustomerDAO from "./JsonCustomerDAO";


export default class JsonDAOFactory extends DAOFactory{
    getCustomerDAO(): ICustomerDAO{
        return new JsonCustomerDAO();
    }
}

import DAOFactory from "./DAOFactory";
import ICustomerDAO from "./ICustomerDAO";
import SharepointCustomerDao from "./SharepointCustomerDAO";

export default class SharepointListDAOFactory extends DAOFactory{

    getCustomerDAO(): ICustomerDAO{
        return new SharepointCustomerDao();
    }
}

import ICustomerDAO from "./ICustomerDAO";
import Customer from "./Customer";

//actual implementation
export default class JsonCustomerDAO implements ICustomerDAO{

    public insertCustomer(): number{
        return 1;
    }

    public deleteCustomer(): boolean{
        return true;
    }

    public findCustomer(): Customer{
        return new Customer();
    }

    public updateCustomer(): boolean{
        return true;
    }

    public listCustomers(): Customer[]{
        let c1= new Customer();
        let c2= new Customer();
        let list: Array<Customer> = [c1, c2 ];
        return list;
    } 
}

import ICustomerDAO from "./ICustomerDAO";
import Customer from "./Customer";

//actual implementations
export default class SharepointCustomerDao implements ICustomerDAO{

    public insertCustomer(): number{
        return 1;
    }

    public deleteCustomer(): boolean{
        return true;
    }

    public findCustomer(): Customer{
        return new Customer();
    }

    public updateCustomer(): boolean{
        return true;
    }

    public listCustomers(): Customer[]{
        let c1= new Customer();
        let c2= new Customer();
        let list: Array<Customer> = [c1, c2 ];
        return list;
    } 
}

代码可以编译，但我在如何使用来自上述代码的客户端或调用者的抽象类方面遇到问题，它是一个 SPFx REACT 组件

import * as React from 'react';
import styles from './TypescriptDesignPatterns02AbstractFactory.module.scss';
import { ITypescriptDesignPatterns02AbstractFactoryProps } from './ITypescriptDesignPatterns02AbstractFactoryProps';
import { escape } from '@microsoft/sp-lodash-subset';
import { ITypescriptDesignPatterns02AbstractFactoryState } from './ITypescriptDesignPatterns02AbstractFactoryState';
import SharepointListDAOFactory from './Factory/SharepointListDAOFactory';
import DAOFactory from './Factory/DAOFactory';

export default class TypescriptDesignPatterns02AbstractFactory extends React.Component<ITypescriptDesignPatterns02AbstractFactoryProps, ITypescriptDesignPatterns02AbstractFactoryState> {
  constructor(props: ITypescriptDesignPatterns02AbstractFactoryProps, state: ITypescriptDesignPatterns02AbstractFactoryState) {
    super(props);
    this.setInitialState();
  }

  public render(): React.ReactElement<ITypescriptDesignPatterns02AbstractFactoryProps> {
    switch(this.props.datasource) {
      case "Sharepoint":
        let sharepointlistdaofactory: SharepointListDAOFactory =   DAOFactory.getDAOFactory(1);



        break;
      case "JSON":
        break;
    }
    return null;
  }

  public setInitialState(): void {
    this.state = {
      items: []
    };
  }



}

我不确定语法或如何将这些行翻译成 typescript

DAOFactory OracleDbFactory =   
  DAOFactory.getDAOFactory(DAOFactory.DAOORACLEDB); 

// Create a DAO
CustomerDAO custDAO = 
  OracleDbFactory.getCustomerDAO();

Answer 1

目前您的代码需要实例化 DAOFactory 才能访问 getDAOFactory 方法:

const daoFactory = new DAOFactory;

但是你不能这样做，因为 DAOFactory 是抽象的。

相反，工厂函数不需要是一个对象方法——它可以是一个类方法(静态的)或者甚至只是一个函数。

const getDAOFactory = (whichFactory: number): DAOFactory => {
  switch (whichFactory) {
    case 1: 
        return new SharepointListDAOFactory();
    case 2: 
        return new JsonDAOFactory();      
    default  : 
        return null;
  }
}

现在您只需调用 OracleDbFactory = getDAOFactory(DAOFactory.DAOORACLEDB);(函数的返回类型是隐式类型)。

我确实想知道为什么您需要这个额外的抽象层。看起来像 custDao = getDao(DaoTypes.Customer) 这样的东西就足够了。