演练为Javascript对象转换为Typescript等价物？

Question

我非常厌倦了JavaScript的变幻莫测，认真考虑将相对较大的项目移植到Typescript中。我已经看过教程并获得了Typescript的要点，但是我承认，如果我看到一些从JavaScript到Typescript的“之前”和“之后”的例子，这将非常有帮助。特别是，从一些流行的对象定义模式转换成我在JS中已经很糟糕了。举例来说，如果我有一个JS对象声明如下：

var app = app || {}; 

app.SomeSingleton = function() { 

var someProp; 

var someFunction = function(e) { 

}; 

var somePublicFunction = function(e) { 

}; 

return { 
    somePublicFunction: somePublicFunction 
} 

}(); 

即使只输入了这一点，在帮我看看我通过方法属性和方法可能只是重新编码财产......但奇怪（我）内联类定义在JS中的东西仍然抛出我。所以，与上面相同的问题，转换为TS时如何查看以下存根？

var app = app || {}; 

app.MVVMThing = (function() { 
    "use strict"; 

    //model 
    var MVVMModel = (function() { 
     LoggerInstanceDeclaredElsewhere.log("blah"); 

     var mvvmModel = { 

      id: 'Id' 

     }; 

     var datasource = "blah"; 

     return { 
      model: mvvmDatasource 
     }; 
    }()); 

    // view model 
    var MVVMViewModel = (function() { 

     var init = function() { 

     }; 

     var show = function() { 

     }; 

     return { 
      init: init, 
      show: show,   
     }; 
    }()); 

    return MVVMViewModel; 
}()); 

我是对的，虽然在JS中有很多类定义和实例化的方言，但在TS中真的只有一个主要方法吗？

希望有人是TypeScript的粉丝，愿意将我指向我无法找到的文章或提供他们自己的回复。

谢谢， 戴夫Gerding

Answer 1

类的定义和实例在JS的许多方言有真的只有一个在TS

晴这样做的主要途径。但是所有有效的JS都是有效的TS，所以你仍然拥有所有这些权力。

模块/命名空间格局

你在这里做什么：

var app = app || {}; 

app.SomeSingleton = function() { 
} 

是使用模块模式。与其他语言的命名空间类似。您将前缀app附加到SomeSingleton。在打字稿：

module app{ 
    export function SomeSingleton(){} 
} 

产生：

var app; 
(function (app) { 
    function SomeSingleton() { 
    } 
    app.SomeSingleton = SomeSingleton; 
})(app || (app = {})); 

刚刚超过您的原始JS santized。

揭示模块模式（用于创建对象）

您的JS：

var SomeClass = function() { 
    var someProp; 
    var someFunction = function(e) { }; 

    var somePublicFunction = function(e) { }; 

    return { 
     somePublicFunction: somePublicFunction 
    } 
}; 

是完全有效的TS，只是更多的类型安全由于打字稿类型推断：

同对于你的单身人士来说，它的TypeScript很好：

var SomeSingleton = function() { 
    var someProp; 
    var someFunction = function(e) { }; 

    var somePublicFunction = function(e) { }; 

    return { 
     somePublicFunction: somePublicFunction 
    } 
}(); 

要了解更多，只需google：https://www.google.com.au/search?q=revealing%20module%20pattern