骨干网和打字稿，不幸的婚姻：构建类型安全的＆QUOT;获得＆QUOT;？ [英] Backbone and TypeScript, an unhappy marriage: Building a type-safe "get"?

问题描述

我想使用打字稿与Backbone.js的。它作品，但大部分的类型安全是由骨干的get（）和（）设置丢失。我想写这将恢复类型安全的辅助方法。事情是这样的：

I am trying to use TypeScript with Backbone.js. It "works", but much of the type safety is lost by Backbone's get() and set(). I am trying to write a helper method that would restore type-safety. Something like this:

我把这个在我的模型：

object() : IMyModel  {
    return attributes; // except I should use get(), not attributes, per documentation
}

和这个在消费者：
     VAR myVar的= this.model.object（）myProperty的;

通过这种语法，我得到myProperty的存在，并且是布尔打字稿的知识，这是真棒。但是， Backbone.js的文档告诉我使用get和set，而不是直接的属性乱码。那么，有没有神奇的Javascript的方式，通过获取对象的管的使用和设置是否正确？

With this syntax, I get TypeScript's knowledge that MyProperty exists and is bool, which is awesome. However, the backbone.js docs tell me to use get and set rather than the attributes hash directly. So is there any magic Javascript way to pipe usage of that object through get and set properly?

推荐答案

我们使用的是与骨干大量的打字原稿，并想出了一个新的解决方案。结果
请看下面的code：

We are using backbone with TypeScript heavily, and have come up with a novel solution.
Consider the following code:

interface IListItem {
    Id: number;
    Name: string;
    Description: string;
}

class ListItem extends Backbone.Model implements IListItem {
    get Id(): number {
        return this.get('Id');
    }
    set Id(value: number) {
        this.set('Id', value);
    }
    set Name(value: string) {
        this.set('Name', value);
    }
    get Name(): string {
        return this.get('Name');
    }
    set Description(value: string) {
        this.set('Description', value);
    }
    get Description(): string {
        return this.get('Description');
    }

    constructor(input: IListItem) {
        super();
        for (var key in input) {
            if (key) {
                //this.set(key, input[key]);
                this[key] = input[key];
            }
        }
    }
}

请注意，该接口定义了模型的属性，并构造确保传递的任何对象将具有的Id，名称和描述的特性。 for语句只是调用每个属性的骨干集。使得下面的测试将通过：

Note that the interface defines the properties of the model, and the constructor ensures that any object passed will have the Id, Name and Description properties. The for statement simply calls backbone set on each property. Such that the following test will pass:

describe("SampleApp : tests : models : ListItem_tests.ts ", () => {
    it("can construct a ListItem model", () => {
        var listItem = new ListItem(
            {
                Id: 1,
                Name: "TestName",
                Description: "TestDescription"
            });
        expect(listItem.get("Id")).toEqual(1);
        expect(listItem.get("Name")).toEqual("TestName");
        expect(listItem.get("Description")).toEqual("TestDescription");

        expect(listItem.Id).toEqual(1);

        listItem.Id = 5;
        expect(listItem.get("Id")).toEqual(5);

        listItem.set("Id", 20);
        expect(listItem.Id).toEqual(20);
    });
});

更新：
我已经更新了code碱基使用ES5 get和set语法，以及构造。基本上，你可以使用骨干不用彷徨和.SET内部变量。

Update: I have updated the code base to use ES5 get and set syntax, as well as the constructor. Basically, you can use the Backbone .get and .set as internal variables.

这篇关于骨干网和打字稿，不幸的婚姻：构建类型安全的＆QUOT;获得＆QUOT;？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！