創建打字稿類與現有的Javascript和Backbone對象配合使用

我開始研究使用Backbone和Javascript的項目。我不確定如何開始整合Typescript。例如，我們有我們公司的命名空間之前我們的觀點，模型，對象等，所以創建一個骨幹物體看起來像這樣沒有打字稿：創建打字稿類與現有的Javascript和Backbone對象配合使用

Company.Views.MyNewView = (function() { return Backbone.View.extend({ } })();

所以，現在，使用打字稿，我以爲我可以做類似

class Company.Views.MyNewView { 

}

但是，Typescript不喜歡名稱中的時間段。所以我的第一個問題是如何在我的項目中使用Typescript和現有的命名空間？這些命名空間被簡單地定義爲

var Company = Company || {}; 
Company.Views = Company.Views || {};

我的第二個問題是更一般的。展望未來，Typescript能否輕鬆整合現有項目，其中所有內容都是使用標準JavaScript定義的？我不確定如何訪問我的任何非Typescript類對象。提前致謝。

編輯：嘗試與現有的JavaScript對象結合

declare module Company.Views { 
    export class MyNewRouter extends Company.BaseRouter { 
     // It does not recognize Company.BaseRouter 
    } 
}

來源

2013-05-20 Crystal

打字稿有模塊的概念。一個模塊實際上等同於公司|| {}。

所以，你可以做到以下幾點：

module Company{ 
    export module Views{ 
     export function MyNewView(){ 
      return <any>Backbone.View.extend({ }); 
     } 
    } 
}

哪個編譯成：

var Company; 
(function (Company) { 
    (function (Views) { 
     function MyNewView() { 
      return Backbone.View.extend({ 
      }); 
     } 
     Views.MyNewView = MyNewView; 
    })(Company.Views || (Company.Views = {})); 
    var Views = Company.Views; 
})(Company || (Company = {}));

一個簡單的例子

以下打字稿：

module Company{ 
    // You need to do at least one export 
    // for compiler to generate any code 
    export var foo = 123; 
}

產生：

var Company; 
(function (Company) { 
    Company.foo = 123; 
})(Company || (Company = {}));

對於整合現有的JS

你需要爲打字稿創建聲明來了解你的js。 Js不關心你是否在一個文件中聲明一個變量並在另一個文件中使用它。因爲它需要編譯時間檢查，所以TypeScript會這樣做。

最簡單的聲明是：

declare var SomeJSStuff:any;

，您可以build up from there。

來源

2013-05-20 01:19:46 basarat

所以，它聽起來就像至少在舊的命名空間，我至少需要將其導出爲模塊？ – Crystal

否。如果你想在打字稿中使用現有的命名空間，你可以使用聲明。對於新的命名空間使用模塊 – basarat

但是，如果我有一個已經存在的JS對象被稱爲公司。BaseRouter，我不能擴展那種類型嗎？我添加了我在原始帖子底部嘗試的代碼段。 – Crystal

對於第二部分的下面是你會怎麼做：

// Declare your JS stuff 
declare module Company { 
    export class BaseRouter { 
     // Additionally declare any memebers of BaseRouter 
     // e.g: 
     someProp:number; 
    } 
} 

// Now use your JS Stuff in typescript 
module Company.Views { 
    export class MyNewRouter extends Company.BaseRouter { 
     // It recognizes Company.BaseRouter 
    } 
}

來源

2013-05-20 03:45:14 basarat

創建打字稿類與現有的Javascript和Backbone對象配合使用

回答

相關問題