Converting a WinJS function definition with a sub-function to TypeScript

Question

I've been trying to contribute to excellent DefinitelyTyped repository of TypeScript.

I encountered an unusual function declaration in WinJS though and wondered what the most succinct TypeScript definition would be for the function, so that the compiler won't complain and Visual Studio Intellisense works correctly.

The method I don't know how to translate to a TypeScript definition/stub is render.value (MSDN):

template.render.value(href, dataContext, container)

Most functions are easy to translate, but the function on the function, value, I don't know how to represent cleanly/correctly.

So far, I've got this for the Template class (MSDN), I just want it to be complete:

class Template {
    public element: HTMLElement;
    public extractChild: boolean;
    public processTimeout: number;
    public debugBreakOnRender: boolean;
    public disableOptimizedProcessing: boolean;
    public isDeclarativeControlContainer: boolean;
    public bindingInitializer: any;

    constructor(element: HTMLElement, options?: any);
    public render(dataContext: any, container?: HTMLElement): WinJS.Promise<any>;
    public renderItem(item: any, recycled?: HTMLElement);
    // public render.value(  ***TODO 
}

Here's my quick stab, not knowing anything about WinJS. It doesn't look like render should be a promise. value looks like a promise. render just looks like a property that has a value property that is a promise. — Alex Dresko
– Alex Dresko, Commented Oct 2, 2013 at 13:58
Also, you can't have a method named "render.value", so you'll have to split them up somehow. — Alex Dresko
– Alex Dresko, Commented Oct 2, 2013 at 13:59
render returns a Promise (I'm using it). I understand that functions can't be named that way. It's a function declared on a function in JavaScript. The WinJS library has the function. I didn't create it. — WiredPrairie
– WiredPrairie, Commented Oct 2, 2013 at 14:02

Jeffery Grajkowski · Accepted Answer · 2013-10-02 15:34:54Z

2

Here's what I came up with.

declare class Template {
    element: HTMLElement;
    extractChild: boolean;
    processTimeout: number;
    debugBreakOnRender: boolean;
    disableOptimizedProcessing: boolean;
    isDeclarativeControlContainer: boolean;
    bindingInitializer: any;

    constructor(element: HTMLElement, options?: any);
    render: {
        (dataContext: any, container?: HTMLElement): WinJS.Promise<HTMLElement>;
        value(href: string, dataContext: any, container?: HTMLElement): WinJS.Promise<HTMLElement>;
    };
    renderItem(item: any, recycled?: HTMLElement);
}

My understanding of the WinJS.Promise object returned from render is that it's wrapping the HTMLElement passed in as container or a new div. So that's why I typed the promise WinJS.Promise<HTMLElement>.

For render I just inlined the type rather than giving it a name and declaring it elsewhere because I think that's neater. The first line inside its definition says what happens when you treat it like a function, and the second is just a regular member of that object.

answered Oct 2, 2013 at 15:34

Jeffery Grajkowski

4,07023 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

WiredPrairie Over a year ago

That seems to do the trick. I wasn't aware of the syntax for declaring the function on the render object directly.

Jeffery Grajkowski Over a year ago

Yeah it doesn't come up often.

Collectives™ on Stack Overflow

Converting a WinJS function definition with a sub-function to TypeScript

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related