相当于 JS 模块模式的打字稿答案

【问题标题】：Typescript equivalent to JS Module pattern相当于 JS 模块模式的打字稿
【发布时间】：2014-11-29 18:50:40
【问题描述】：

我正在使用 JS 模块模式（如 this post 中所述），并且我的代码如下所示：

Foo = (function($, ko) {

    //Constructor for Foo
    var Foo = function () {
        //Uses $ and ko
    };
    return Foo;

})($, ko)

我想将此模式转换为等效的 TypeScript，但我不确定那会是什么。我用这个替换整个 IIFE 吗？

 class Foo {
     constructor() {
         //Uses $ and ko
     }
 }

这看起来大致相同，但它失去了我的依赖项的显式注入。这是在 TypeScript 中执行此操作的方法吗？

【问题讨论】：

标签： javascript module typescript

【解决方案1】：

Typescript 是 JavaScript 的超集，因此您的 JavaScript 代码是有效的 TypeScript。下面的代码编译成完全相同的 JavaScript；

var $, ko;
var Foo = (function($, ko) {

    //Constructor for Foo
    var Foo = function () {
        //Uses $ and ko
    };
    return Foo;

})($, ko)

var theFoo = new Foo();

或者，如果你想使用 TypeScript 类，你可以将值传递给 TypeScript 中的构造函数；

var $, ko;
class Foo {
    constructor($, ko) {
     //Uses $ and ko
    }
}

var theFoo = new Foo($, ko);

生成这个 Javascript：

var $, ko;
var Foo = (function () {
    function Foo($, ko) {
        //Uses $ and ko
    }
    return Foo;
})();
var theFoo = new Foo($, ko);

这并不直接等同于您的原始代码，但它可以达到目的。

【讨论】：

是的；我不希望我的库成为我构造的每个对象的参数。我的目标不是构造单个对象，而是使用此模块定义其他模块可以使用的构造函数，而不是强制其他模块每次构造对象时都向我提供所有库。
而且，是的，我知道我现有的代码仍然是“合法的打字稿”；但关键是我想使用打字稿，这样我的 Foo 对象都有一个一致的接口。

【解决方案2】：

 import $ = require("../vendor/jquery")

这就是你要找的东西？

要记住的一点是，任何 JavaScript 代码都是有效的 TypeScript 代码。像以前一样使用 jQuery，它会正常工作。否则你需要更具体。

【讨论】：

这根本不是真的。尝试编译 var x = { foo: 5 }; x.bar = "是";