Question

我正在使用TypeScript 0.9和Dojo 1.8。

尝试将以下dojo代码转换为Typescript，但不是很成功。它使用dojo.declare来创建一个类。还使用this.inherited（arguments）来调用超类方法。有人可以帮助我用d.ts文件转换它。

// Define class A
var A = declare(null, {
    myMethod: function(){
        console.log("Hello!");
    }
});

// Define class B
var B = declare(A, {
    myMethod: function(){
        // Call A's myMethod
        this.inherited(arguments); // arguments provided to A's myMethod
        console.log("World!");
    }
});

具有多重继承的更复杂的情况是：

define(["dojo/_base/declare",
    "dijit/_Widget",
    "dijit/_TemplatedMixin",
    "dijit/_WidgetsInTemplateMixin".
    "text!/some.html"],
    function (dojo_declare, _Widget, _TemplateMixin, _WidgetsInTemplateMixin,  template) {
        var mod =
        {

            templateString: template,
            constructor: function () {
            },
            postCreate: function () {
                // do something here....
                this.inherited(arguments);
            }
        };

        return dojo_declare("sample", [_Widget, _TemplateMixin, _WidgetsInTemplateMixin], mod);
    });

Answer 1

如果您正在尝试为现有JavaScript代码创建声明文件，则需要以下内容：

declare class A {
    myMethod(): void;
}

declare class B extends A {}

要将该代码转换为TypeScript，您需要以下内容：

class A {
    myMethod(): void {
        console.log("Hello!");
    }
}

class B extends A {
    myMethod(): void {
        super.myMethod();
        console.log("World!");
    }
}

区别在于一个包含一个实现，另一个只是签名。

我已经将一些dojo代码转换为TypeScript，我可以告诉你标准的TypeScript类可以使用dojo.declare类进行扩展，但是你不能使用TypeScript类扩展dojo.declare类。 Dojo做了很多有趣的事情，只有它知道如何处理。

Answer 2

我相信你尽可能接近。您可以在.d.ts文件中手动编写接口，并为构造的实例分配类型，但是您无法获得要去的位置，因为dojo继承与typescript继承不兼容。它似乎让这个工作，我们必须能够告诉typescript我们的意思是“extends”，例如，一个编译器指令说objectmodel = dojo。

Answer 3

在dojojs中declare函数是一种解决方法，用于创建类，以便下一个代码：

// Define class A
var A = declare(null, {
    myMethod: function(){
        console.log("Hello!");
    }
});

// Define class B
var B = declare(A, {
    myMethod: function(){
        // Call A's myMethod
        this.inherited(arguments); // arguments provided to A's myMethod
        console.log("World!");
    }
});

应该相当于：

// Define class A
class A {
    myMethod() {
        console.log("Hello!");
    }
}

// Define class B
class B extends A {
    myMethod() {
        // Call A's myMethod
        super.myMethod(); // arguments provided to A's myMethod
        console.log("World!");
    }
});

对于第二个示例中显示的多重继承的情况，Typescript本身不支持它。这意味着您应该使用辅助函数来执行此操作。例如代码：

define(["dojo/_base/declare",
    "dijit/_Widget",
    "dijit/_TemplatedMixin",
    "dijit/_WidgetsInTemplateMixin".
    "text!/some.html"],
    function (dojo_declare, _Widget, _TemplateMixin, _WidgetsInTemplateMixin,  template) {
        var mod =
        {

            templateString: template,
            constructor: function () {
            },
            postCreate: function () {
                // do something here....
                this.inherited(arguments);
            }
        };

        return dojo_declare("sample", [_Widget, _TemplateMixin, _WidgetsInTemplateMixin], mod);
});

你可以这样做：

import declare = require("dojo/_base/declare");
import _Widget = require("dijit/_Widget");
import _TemplateMixin = require("dijit/_TemplatedMixin");
import _WidgetsInTemplateMixin = require("dijit/_WidgetsInTemplateMixin");
import template = require("text!/some.html");

// Most likely you should extend _Widget since it is the one which contains  
// the method `postCreate`
class Sample extends _Widget implements _TemplateMixin, _WidgetsInTemplateMixin {

  templateString: string = template;

  constructor() {}

  postCreate() {
    // do something here....
    super.postCreate(arguments);
  }

  // here you should put the overridden methods from the `implements` statement
  buildRendering: Function;
  destroyRendering: Function;
  getCachedTemplate: Function;
  //...
}

// This line is possibly wrong
applyMixins (Sample, [_TemplateMixin, _WidgetsInTemplateMixin]);
</pre>

函数applyMixins应如下所示：

function applyMixins(derivedCtor: any, baseCtors: any[]) {
    baseCtors.forEach(baseCtor => {
        Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {
             if (name !== 'constructor') {
                derivedCtor.prototype[name] = baseCtor.prototype[name];
            }
        });
    });
}

PD：Typescript中的declare关键字用于创建定义文件（*.d.ts），而不是用于声明类。如果你想制作任何类，函数或变量public，你应该在它们面前加上关键字export。

Answer 4

嘿，我希望参加晚会不会太迟。

使用dojo和typescript要求您拥有dojo的类型定义文件，以便您可以使用typescript提供的awesome类型检查。

要获得这些，您可以使用npm install @ types / dojo 参考https://www.npmjs.com/package/@types/dojo

通过这种方式，您将能够访问dojo类型。

import * as dojoDeclare from "dojo/_base/declare";

然后你可以继续使用declare。

let dojoBootstrapProgressBar = dojoDeclare("BootstrapProgressBar.widget.BootstrapProgressBar", [_WidgetBase], (function(Source: any) {
let result: any = {};
for (let i in Source.prototype) {
    if (i !== "constructor" && Source.prototype.hasOwnProperty(i)) {
        result[i] = Source.prototype[i];
    }
}
return result;
} (BootstrapProgressBar)));

export = BootstrapProgressBar;

如何使用Typescript编写dojo.declare和继承函数？

4 个答案: