在js文件中,我建立了可能需要在各个页面上使用的常用功能的库。我通过模拟命名间隔方案来组织功能,并且我还使用了一种模式来尽可能地隐藏不想公开直接使用的私有属性和函数。
这是图案
var mynamespace = (function () {
var private = {
funcX: function (): any {..},
};
var public =
{
subnamespace1: {
func1: function (ctl: HTMLElement): boolean {...},
},
subnamespace2: {
func2: function (sender: any, args: any): void {...},
func3: function (sender: any, args: any): void {
private.funcx();
},
}
};
return public;
})();
只要页面包含js,我就可以轻松地执行该库中的任何功能:
mynamespace.subnamespace2.func2(x,y);
到目前为止,此方法运行良好,但是我正尝试首次使用TypeScript,并且正在寻求实现类似的模式。我希望库以Typescript构建,但是页面只能使用js,而不是typescript。
我的第一个尝试就是这样做...
namespace mynamespace {
namespace subnamespace1 {
export function func1(): boolean {...}
}
namespace subnamespace2 {
export function func2(): boolean {...}
export function func3(): boolean {...}
}
}
...这不起作用,因为我无法访问子名称空间
所以我尝试了这个...
namespace mynamespace {
export class subnamespace1 {
func1(): boolean {...}
}
export class subnamespace2 {
func2(): boolean {...}
func3(): boolean {...}
}
}
...这不起作用,因为尽管我可以访问子名称空间,但无法访问功能。
是否有可能以一种与我的原始javascript模式遵循的相似方式输出js的方式构建Typescript,或者它可以完成相同的事情?
答案 0 :(得分:0)
您可以使用名称空间方法,只需要导出子名称空间
namespace mynamespace {
function funcX(): boolean { return false; }
namespace private {
export function funcPrivate(): boolean { return false; }
}
export namespace subnamespace1 {
export function func1(): boolean { return funcX(); }
}
export namespace subnamespace2 {
export function func2(): boolean { return private.funcPrivate(); }
export function func3(): boolean { return true; }
}
}
mynamespace.subnamespace1.func1(); // ok in both js and ts
mynamespace.subnamespace2.func2(); // ok in both js and ts
mynamespace.funcX() // not accesible
mynamespace.private.funcPrivate() // not accesible
名称空间解决方案将不会输出与您的手写版本完全相同的js(它更多地依赖于函数闭包),但是功能应该相同。
如果生成相同的JS模式对您很重要,则可以坚持使用添加了TS类型的JS版本。应该没有理由不起作用:
var mynamespace = (function () {
var private = {
funcX: function (): any {},
};
var public =
{
subnamespace1: {
func1: function (ctl: HTMLElement): boolean { return true;},
},
subnamespace2: {
func2: function (sender: any, args: any): void { },
func3: function (sender: any, args: any): void {
private.funcX();
},
}
};
return public;
})();
mynamespace.subnamespace1.func1(null); // ok in both js and ts
mynamespace.subnamespace2.func2(null, null); // ok in both js and ts