Instances of Intl.NumberFormat and Intl.DateTimeFormat does not expose the format() function

[kivle]

I'm currently working on converting our product at work to use Typescript 1.4. One Javascript feature we use quite extensively is the possibility to make instances of Intl.NumberFormat and Intl.DateTimeFormat objects in the Intl namespace based on a specified culture. Example:

var formatter = new Intl.NumberFormat("zh-Hans-CN-u-nu-hanidec", 
                                      { useGrouping: true, maxDecimals: 3});
var numberAsString = formatter.format(123321.456); // Property 'format' does not exist on type 'Collator'

According to MDN this is perfectly valid in modern browsers (except for Safari), and it's working well for us.

However, the format() function is currently not exposed from the returned object with the Typescript mappings in Intl.d.ts. When you instantiate an Intl.NumberFormat object, the returned object is of type Collator instead of NumberFormat. Same problem for the Intl.DateTimeFormat object.

My suggestion is that the NumberFormat and DateTimeFormat interfaces should extend Collator, and the constructor function should return the relevant object interface that extends Collator. For example:

    interface NumberFormat extends Collator {
        format(value: number): string;
        resolvedOptions(): ResolvedNumberFormatOptions;
    }

    var NumberFormat: {
        // The following four functions return NumberFormat objects
        new (locales?: string[], options?: NumberFormatOptions): NumberFormat;
        new (locale?: string, options?: NumberFormatOptions): NumberFormat;
        (locales?: string[], options?: NumberFormatOptions): NumberFormat;
        (locale?: string, options?: NumberFormatOptions): NumberFormat;
        supportedLocalesOf(locales: string[], options?: NumberFormatOptions): string[];
        supportedLocalesOf(locale: string, options?: NumberFormatOptions): string[];
    }

[danquirk]

I assume this is a generated part of our .d.ts which complicates fixing it but we should do it either way.

[ashrafsabrym]

I have the same issue with the Intl.DateTimeFormat constructor. Here's my code:

var dateFormat = new Intl.DateTimeFormat("ar-EG", {
        hour12: true
    }), dateBinding: KnockoutBindingHandler = {
            update: (element: HTMLElement,
                …) =>
            {
                …
                element.textContent = dateFormat.format(value);
            }
        };

The compiler complains about the format function saying Property 'format' does not exist on type 'Collator'. as the constructor returns a Collator object. From lib.d.ts:

interface DateTimeFormat {
        format(date: number): string;
        resolvedOptions(): ResolvedDateTimeFormatOptions;
    }
    var DateTimeFormat: {
        new (locales?: string[], options?: DateTimeFormatOptions): Collator;
        new (locale?: string, options?: DateTimeFormatOptions): Collator;
        (locales?: string[], options?: DateTimeFormatOptions): Collator;
        (locale?: string, options?: DateTimeFormatOptions): Collator;
        supportedLocalesOf(locales: string[], options?: DateTimeFormatOptions): string[];
        supportedLocalesOf(locale: string, options?: DateTimeFormatOptions): string[];
    }

Should I open a new issue for this?

[mhegazy]

@ashrafsabrym I think this is the same issue.

[ashrafsabrym]

These constructors should be modified to return DateTimeFormat instead of Collator