Typescript: Visibility within the same Namespace across multiple files

Question

Can you help me out - is this a bug or am I misunderstanding the documentation?

I have two files in a namespace - you'll find a simpler version below.

The Typescript docs state that "Even though the files are separate, they can each contribute to the same namespace and can be consumed as if they were all defined in one". Therefore I would assume that a class from one file could access another file from within the same namespace even if it was not exported. (Because that would be the case if they were defined in the same place)

However, tsc complains that it can't find the name "Dispatcher". Why does this happen? Am I misunderstanding the documentation at this point? Or is it just a compiler bug? Would be a shame if it was the former, because namespace only visibility would help a lot for unit testing and encapsulating.

Code:

(code changed for simplicity. If syntax errors are present, they are caused by that):

Application.ts:

/// <reference path="Dispatcher.ts"/>
namespace Application {
    export class Application {
        constructor() {
            new Dispatcher(); 
        }
    }
}

Dispatcher.ts:

namespace Application {
    class Dispatcher { /* ... */ }
}

No, members must be exported in order to "contribute" to a namespace across different files. If you look at the generated JavaScript code you will see why this is, all values are declared inside an IIFE and so unexported values are only visible inside that specific function's context. Also, without this behaviour you couldn't have two private properties with the same name across any file that contributes to that namespace, which would be undesirable. — Sly_cardinal
– Sly_cardinal, Commented Sep 20, 2018 at 17:52

artem · Accepted Answer · 2018-09-20 17:39:28Z

6

The Typescript docs state that "Even though the files are separate, they can each contribute to the same namespace and can be consumed as if they were all defined in one".

It depends on the precise definition of "contribute to the same namespace". Current interpretation is "anything exported is available anywhere, anything not exported is available only inside the namespace part where it's defined". This is how it's explained in the language specification:

Namespaces provide a mechanism for organizing code and declarations in hierarchies of named containers. Namespaces have named members that each denote a value, a type, or a namespace, or some combination thereof, and those members may be local or exported. The body of a namespace corresponds to a function that is executed once, thereby providing a mechanism for maintaining local state with assured isolation. Namespaces can be thought of as a formalization of the immediately-invoked function expression (IIFE) pattern.

If there are several declarations of the same namespace, each one is compiled into a separate IIFE, as can be seen in compiled javascript code for Dispatcher.ts:

var Application;
(function (Application) {
    class Dispatcher {
    }
})(Application || (Application = {}));

The result is that Dispatcher is scoped inside the function, and it's not accessible from the outside.

Even if you had namespace Application repeated twice in the same file, each would be defining its own copy of Dispatcher - there is no error for this code:

namespace Application {
    class Dispatcher { /* ... */ }
}

namespace Application {
    class Dispatcher { /* ... */ }
}

The only way to make Dispatcher accessible from outside namespace { ... } is to export it. With export, Dispatcher becomes a property of Application object:

namespace Application {
    export class Dispatcher { /* ... */ }
}

compiled code:

var Application;
(function (Application) {
    class Dispatcher {
    }
    Application.Dispatcher = Dispatcher;
})(Application || (Application = {}));

This behavior makes sense implementation-wise. It would be really troublesome to implement namespace so that un-exported objects were shared among all namespace instances, but not accessible from outside.

edited Sep 20, 2018 at 17:39

answered Sep 20, 2018 at 17:00

artem

52.2k10 gold badges86 silver badges85 bronze badges

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

2 Comments

Matthias Over a year ago

Thanks a lot for the quick answer. One more question though: If I understand correctly, I am not declaring modules anywhere - there are just namespaces and reference directives. Is there any implicit conversion to modules happening?

Matthias Over a year ago

wow! thanks a lot that was an awesome answer! :) really what i wanted to know!

Collectives™ on Stack Overflow

Typescript: Visibility within the same Namespace across multiple files

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