Question

我需要向HTMLElement添加成员，换句话说，我需要将数据存储到元素中。这就是我想要实现的，就好像我在ScriptSharp进行编码一样。

/** My method */
public DoIt(element: Element, obj: Object) {
  Literal("{0}.extended = {1}", element, obj); // This is not standard Typescript!
}

在我的示例中 ScriptSharp（将C＃代码转换为Javascript的项目）提供了一个Script.Literal对象，允许开发人员在无法进行C＃抽象时编写纯Javascript。

以便Javascript输出为：

// Probably Typescript will render it a bit differently, but basically
// this is what we get in the end...
var _doit = function(element, obj) {
  element.extended = obj;
};

如何在打字稿中实现这一目标？或许我应该以不同的方式处理这个问题？

Answer 1

任何有效的JavaScript也都是有效的TypeScript。这意味着您可以在代码中的任何位置编写文字JS。

var _doit = function(element, obj) {
  element.extended = obj;
};

这是有效的JS 和 TS。

但是，由于您使用TypeScript，您可能还希望对代码使用静态类型。如果你只是在代码中添加类型，它将正确编译，但你会收到语义错误：

var _doit = function(element:HTMLElement, obj) {
  element.extended = obj; // error: HTMLElement doesn't have property 'extended'
};

要防止此错误，您可以通知编译器您打算在HTMLElement上创建新属性：

interface HTMLElement {
  extended?: any;
}

现在，编译器知道extended上有一个（可选）属性HTMLElement，并且编译时没有错误。您还将在此属性上获得代码自动完成（如果提供了JSDoc）。

Answer 2

这对我有用：

class Foo {
  public DoIt(element: Element, obj: Object) {
    var anyElement: any = element;
    anyElement.extended = obj;
  }
}

问题（您可能已经注意到）是Element没有声明名称为extended的属性，因此TypeScript执行其工作并强制执行Element类型。如果您想解决此问题，可以使用any类型执行此操作。

Answer 3

或许我应该以不同的方式处理这个问题？

如果你想彻底摆脱编译器检查只需要一个标准的javascript文件。请注意，如果您想使用这个 from typescript ，您必须告诉typescript（使用ambient declarations）。

个人建议：只需使用TypeScript即可。

如何在Typescript中编写文字Javascript

3 个答案: