Question

因此，使用C＃和其他语言，您可以在属性上获得get and set评估器，构建延迟加载模式非常简单。

我最近才开始玩类型脚本，我试图实现同样的目标。我通过Ajax Call为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       

};

几个问题：我

接口在这里使用是否正确？
我想在某些内容访问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()。此名称表示此方法中的代码是异步的，并且提示返回值是一个延迟对象，该值将在以后的某个地方可用。

Answer 2

接口在这里使用是否正确？

是，使用接口简化了TypeScript

中的耦合问题

另请参阅：Programmers: Why are interfaces useful?

当某些内容访问Library Books Property时，我想触发Load操作。这甚至可能吗？

是，可以实现您喜欢的任何加载模式。 TypeScript。

但，对于中小型应用，加载通常不会在JavaScript级别处理，而是由TypeScript和module loader处理。< / p>

支持声明：

https://github.com/SlexAxton/yepnope.js#deprecation-notice

弃用通知

... yepnope的作者认为前端社区现在提供了更好的软件来加载脚本，以及有条件地加载脚本。这些新工具的API都不像yepnope那么容易，但我们向您保证，它可能值得您花时间。我们没有正式认可任何替换，但我们强烈建议您使用模块，然后使用require.js，webpack，browserify或其他许多优秀的依赖管理<之一来打包您的应用程序/ strong>构建工具......

另见：

Stack Overflow: How do AMD loaders work under the hood?

Stack Overflow: When to use Requirejs and when to use bundled javascript?

Programmers: Practices for organizing JavaScript AMD imports

使用Typescript延迟加载模式

2 个答案: