首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何在解析信任的库(如Ampersand.js )中使用类型记录来构建原型

如何在解析信任的库(如Ampersand.js )中使用类型记录来构建原型
EN

Stack Overflow用户
提问于 2014-08-10 09:35:46
回答 1查看 697关注 0票数 1

我的问题是如何使用像AmpersandJS这样的库或解析信任的其他库来使用类型记录构建(类)对象(我不确定这种模式是否有名称)。例如,Ampersand.JS使用一个函数(.extend)根据您的配置构建一个原型:

代码语言:javascript
复制
    // This object contains the configuration that Ampersand uses to build my model.
    var config = {
        props: {
            firstName: 'string',
            lastName: 'string'
        }
    };

    // Create a Person model with getters, setters, validation etc. 
    var Person = AmpersandModel.extend(config);

    // A basic usage to create an instance of a Person object
    var myPerson = new Person({firstName:"John", lastName:"Doe"});
    myPerson.firstName = "NewJohn"; // runs the first name setter build by ampersand

我很难用类型记录来实现上面的例子。对于其他库,如主干,您可以使用普通/直截了当的类型记录方法:

代码语言:javascript
复制
    MyModel extends Backbone.Model{}

但是,对于Ampersand.JS这样的库,我不能使用:

代码语言:javascript
复制
    Person extends AmpersandModel{}

因为这将永远不会执行AmpersandModel的定制extend()代码,该代码基于传递给extend()函数的配置构建原型。

我不知道其他库也面临同样的问题,他们使用什么解决方案。任何使用Ampersand模式的库的例子都可能有帮助。

EN

回答 1

Stack Overflow用户

发布于 2014-08-11 14:37:29

下面是我想出的--首先我删除了Ampersand.js模块的定义。我从来没有使用过Ampersand,所以就离开他们的文档:

代码语言:javascript
复制
declare module ampersand {
    interface AmpersandState {
        // todo...
    }

    interface AmpersandCollection {
        // todo...
    }

    interface ModelExtendOptions {
        parse?: boolean;
        parent?: AmpersandState;
        collection?: AmpersandCollection;
    }

    interface ModelSaveOptions {
        patch?: boolean;
    }

    interface AmpersandModel<TProps> {
        save: (attrs?: TProps, options?: ModelSaveOptions) => void;
        // todo:  fetch, destroy, sync, etc...
    }

    interface AmpersandModelConstructor<TProps, TModel extends AmpersandModel<any>> {
         new (attrs: TProps, options?: ModelExtendOptions): TModel;
    }   

    interface ExtendOptions {
        props?: {};
        session?: {};
        derived?: {};
    }   

    interface AmpersandModelStatic {
        extend: <TProps, TModel extends AmpersandModel<any>>(options: ExtendOptions) => AmpersandModelConstructor<TProps, TModel>;
    }
} 

declare var AmpersandModel: ampersand.AmpersandModelStatic;

下面是如何使用上述符号和模块定义来定义您自己的接口,等等。

由于类型记录、泛型和继承的局限性,您需要为每个模型类型创建两个接口:一个用于其属性,另一个用于组合属性和符号和基本模型:

代码语言:javascript
复制
// interface for person properties...
interface PersonProps {
    firstName: string;
    lastName: string;
}

// interface to tie everything together...
interface PersonModel extends PersonProps, ampersand.AmpersandModel<PersonProps> {
}

// use AmpersandModel's extend method...
var Person = AmpersandModel.extend<PersonProps, PersonModel>({ props: { firstName: 'string', lastName: 'string' } });

// at this point you now have full intellisense/type checking for the constructor and properties.
var me = new Person({ firstName: 'Jeremy', lastName: 'Danyow' });
me.firstName = 'Ron';  // yes!
me.eyeColor = 'Brown'; // compile error!

[这里有一个在类型记录操场上运行代码的链接](http://www.typescriptlang.org/Playground#src=declare%20module%20ampersand%20%7B%0A%20%20%20%20interface%20AmpersandState%20%7B%0A%20%20%20%20%20%20%20%20%2F%2F%20todo...%0A%20%20%20%20%7D%0A%0A%20%20%20%20interface%20AmpersandCollection%20%7B%0A%20%20%20%20%20%20%20%20%2F%2F%20todo...%0A%20%20%20%20%7D%0A%0A%20%20%20%20interface%20ModelExtendOptions%20%7B%0A%20%20%20%20%20%20%20%20parse%3F%3A%20boolean%3B%0A%20%20%20%20%20%20%20%20parent%3F%3A%20AmpersandState%3B%0A%20%20%20%20%20%20%20%20collection%3F%3A%20AmpersandCollection%3B%0A%20%20%20%20%7D%0A%0A%20%20%20%20interface%20ModelSaveOptions%20%7B%0A%20%20%20%20%20%20%20%20patch%3F%3A%20boolean%3B%0A%20%20%20%20%7D%0A%09%0A%09interface%20AmpersandModel%3CTProps%3E%20%7B%0A%20%20%20%20%20%20%20%20save%3A%20(attrs%3F%3A%20TProps%2C%20options%3F%3A%20ModelSaveOptions%29%20%3D%3E%20void%3B%0A%20%20%20%20%20%20%20%20%2F%2F%20todo%3A%20%20fetch%2C%20destroy%2C%20sync%2C%20etc...%0A%20%20%20%20%7D%0A%09%0A%09interface%20AmpersandModelConstructor%3CTProps%2C%20TModel%20extends%20AmpersandModel%3Cany%3E%3E%20%7B%0A%09%09%20new%20(attrs%3A%20TProps%2C%20options%3F%3A%20ModelExtendOptions%29%3A%20TModel%3B%0A%09%7D%09%0A%0A%20%20%20%20interface%20ExtendOptions%20%7B%0A%20%20%20%20%20%20%20%20props%3F%3A%20%7B%7D%3B%0A%20%20%20%20%20%20%20%20session%3F%3A%20%7B%7D%3B%0A%20%20%20%20%20%20%20%20derived%3F%3A%20%7B%7D%3B%0A%20%20%20%20%7D%20%20%20%0A%0A%20%20%20%20interface%20AmpersandModelStatic%20%7B%0A%20%20%20%20%20%20%20%20extend%3A%20%3CTProps%2C%20TModel%20extends%20AmpersandModel%3Cany%3E%3E(options%3A%20ExtendOptions%29%20%3D%3E%20AmpersandModelConstructor%3CTProps%2C%20TModel%3E%3B%0A%20%20%20%20%7D%0A%7D%20%0A%0Adeclare%20var%20AmpersandModel%3A%20ampersand.AmpersandModelStatic%3B%0A%0Ainterface%20PersonProps%20%7B%0A%20%20%20%20firstName%3A%20string%3B%0A%20%20%20%20lastName%3A%20string%3B%0A%7D%0A%0Ainterface%20PersonModel%20extends%20PersonProps%2C%20ampersand.AmpersandModel%3CPersonProps%3E%20%7B%0A%7D%0A%0A%0Avar%20Person%20%3D%20AmpersandModel.extend%3CPersonProps%2C%20PersonModel%3E(%7B%20props%3A%20%7B%20firstName%3A%20'string'%2C%20lastName%3A%20'string'%20%7D%20%7D%29%3B%0A%0Avar%20me%20%3D%20new%20Person(%7B%20firstName%3A%20'Jeremy'%2C%20lastName%3A%20'Danyow'%20%7D%29%3B%0A)

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/25227309

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档