javascript - 使用 Typescript 延迟加载模式

Question

因此，对于 C# 和其他具有属性获取和设置评估程序的语言，构建延迟加载模式非常简单。

我最近才开始使用 Type Script，并且我正在尝试实现相同的目标。我正在通过 Ajax 调用加载具有大部分属性的 Poco。问题可以描述如下:

export interface IDeferredObject<T> {
    HasLoaded: boolean;
    DeferredURI: string;         
}

export class Library{        

    LibraryName: string;
    Books: IDeferredObject<Book[]>;        
}   

export class Book {
    Title: string;
    UniqueNumber: number;
}



window.onload = () => {
    //Instantiate new Library
    var lib = new Library();

    //Set some properties
    lib.LibraryName = "Some Library";

    //Set the Deferred URI Rest EndPoint
    lib.Books.DeferredURI = "http://somerestendpoint";
    lib.Books.HasLoaded;      



    //Something will trigger a  GET to lib.Books which then needs to load using the Deferred Uri       

};

几个问题:我

• 在这里使用接口(interface)是否合适？
• 我想在访问 Library Books Property 时触发 Load 操作。这可能吗？

我知道这是一个悬而未决的问题，只是想寻找一些关于如何构建该模式的指导。

谢谢

Answer 1

Books 可以声明为一个属性(参见 get and set in TypeScript )并且在它的 getter 中你可以开始一个 ajax 调用。唯一的问题是您不知道 ajax 调用何时返回，并且您不想在加载 Books 的值时阻止代码执行。您可以使用 promise解决你的问题。以下代码使用 JQuery Deferred Object由 $.ajax 调用返回(自 1.5 版本起)。

一项更改 - HasLoaded 和 DeferredURI。它们应该驻留在“加载器类”中，即 Library，因为在我的示例中，Library 类负责数据检索。

export class Library {
    private _loadedBooks: Book[];
    public get Books(): any {
        var result: any = null;
        // Check first if we've already loaded values from remote source and immediately resolve deferred object with a cached value as a result
        if(this.HasLoaded) {
            result = $.Deferred();
            result.resolve(this._loadedBooks);
        }
        else {
            // Initiate ajax call and when it is finished cache the value in a private field
            result = $.ajax(this.DeferredURI)
                          .done((values) => {
                              this.HasLoaded = true;
                              this._loadedBooks = values; 
                          });
        }
        return result;
   }
}

然后代码消费者将按如下方式使用Books:

var library = new Library();
library.Books.done((books: Book[]) => {
    // do whatever you need with books collection
});

对我来说，这种设计是违反直觉的，并且此代码的​​用户不会期望 Books 字段/属性返回延迟对象。所以我建议将其更改为方法，例如 loadBooksAsync()。此名称将表明此方法中的代码是异步的，并暗示返回值是一个延迟对象，该值稍后将在某处可用。