How to distinguish between module level variables and local variables in TypeScript

Question

Consider this module:

export module Example{
    let customer : any;

    export function myExample(customer: string) {
        // How to reference the module level customer object here?
        // Is there a standard to make these module level variables Pascal Case to prevent this overlap?
    }
}

The customer in the myExample function is a string. How do I reference the module level customer?

If it was a class, I could use this.customer but this doesn't work in a module, and Example.customer doesn't work either, unless customer is exported...

score 2 · Answer 1 · answered Sep 29 '16 at 16:04

2

In general, modules export either classes, functions, or other elements like enums.

The export module Example as shown in this example only specifies that Example is in fact a namespace, meaning that any reference to the myExample function must be pre-fixed by the namespace name, i.e. Example.myExample().

You are correct when you say that customer is not available unless exported. This is because export module Example is only specifying a namespace, and not exported variables or classes.

It is difficult to surmise why you are using the export module, instead of export class:

export class Example2 {
    customer: string = 'Example2.customer';
    myExample(customer: string) {
        console.log(`Example ${this.customer}`);
        console.log(`Example ${customer}`);
    }
}

This class is in fact a module, due to the use of the export keyword.

answered Sep 29 '16 at 16:04

blorkfish

21,800
4
33
24

According to @RyanCavanaugh http://stackoverflow.com/questions/13255158/when-to-use-classes-or-modules-in-typescript (And this is from 2012, so it may have changed since then) `if you are going to have multiple instances of something with data associated with each instance, class is the way to go. If you're just grouping logically-connected sets of stateless functions together, module is more appropriate`, For my actual use, of this example IRL, modules makes more sense. – Daryl Sep 29 '16 at 17:25
Granted. So what is the const customer doing then ? It is not a stateless function ? This means that you are attempting to group a stateless function with a constant value ? – blorkfish Sep 30 '16 at 06:01
Not sure why it matters. I changed it to just an any for now. – Daryl Sep 30 '16 at 10:50

score 0 · Accepted Answer · answered Oct 04 '16 at 12:09

Here is the JS generated version of the question TS:

define(["require", "exports"], function (require, exports) {
    "use strict";
    var Example;
    (function (Example) {
        var customer;
        function myExample(customer) {
            // How to reference the module level customer object here?
            // Is there a standard to make these module level variables Pascal Case to prevent this overlap?
        }
        Example.myExample = myExample;
    })(Example = exports.Example || (exports.Example = {}));
});

Since customer is not being exported, it is generated as private. And now, the standard Javascript variable scoping rules take effect, and there is no way to refer to module level customer. The simplest and easiest solution, (and IMHO a standard convention for module level private variables) is to underscore the outer most customer:

export module Example{
    let _customer : any;

    export function myExample(customer: string) {
        _customer = customer;
    }
}

How to distinguish between module level variables and local variables in TypeScript

2 Answers2