Question

我正在尝试编写一个检查回调函数的库，然后在它准备好时调用它。这个想法是你可以异步地包含JS，然后当它被加载时它会检查回调并执行它。

我正在使用打字稿。以下JS工作但不会在TS中编译

if(typeof myFramework.ready === 'function') {
    myFramework.ready();
}

然后使用该库的开发人员可以执行以下操作：

var myFramework = myFramework || {}; // As the framework wont exists
myFramework.ready = function(){//Execute developer's code};

但是，使用TypeScript我会收到类型错误：Property＆＃39; ready＆＃39;在myFramework＆＃39;的类型＆＃39;类型中不存在 - 这并不奇怪。如果我执行以下操作，它会编译：

interface Window {
    ready(): void;
}

if(typeof window.ready === 'function') {
    window.ready();
}

但这意味着要向窗口对象添加更多内容。我想，调用一个全局的ready（）方法很可能是一个失败点！

你将如何实现这一目标？

感谢@ james-crosswell - 因为我在单独的文件中有类，所以具有Ajax处理位的文件看起来像：

module MyFramework {
    export interface IMyFramework {
        ready? : () => any;
    }

    export class HasLoaded implements IMyFramework {
        doReady = (framework: IMyFramework) => {
            if(typeof framework.ready === 'function') {
                framework.ready();
            }
        }
    }

    var newHost: HasLoaded = new HasLoaded();
    newHost.doReady(MyFramework);
}

我可能正在重新考虑让我来到这里的逻辑，但这是一个单独的问题！

Answer 1

为什么不在框架上定义用户在加载时调用的函数？像init(callback_to_developer_code);

这样的东西

但是如果你坚持按照自己的方式去做，你只需在框架类接口上定义一个可选属性，如下所示：

interface IMyFramework {
  ready? : Function;
}

class MyFramework implements IMyFramework {
}

var myFramework : MyFramework;

if(typeof myFramework.ready !== 'undefined') {
    myFramework.ready();
}

Answer 2

你当然可以在Typescript中的模块中声明/导出接口......但它们不会对你的框架用户有任何用处，除非那些用户也在使用Typescript（并且你的框架有tsd）。 / p>

有了这个警告，上面@gilamran的答案的以下变体在Typescript Playground上工作：

module MyModule {
    export interface IMyFramework {
        ready? : () => any;
    }

    class MyFramework implements IMyFramework {
    }

    class YourFramework implements IMyFramework {
        ready = () => {
            alert("You're ready");
        }
    }

    export class Host {
        doReady = (framework: IMyFramework) => {
            if(typeof framework.ready !== 'undefined') {
                framework.ready();
            }           
        }
    }

    var host: Host = new Host();
    host.doReady(new MyFramework());
    host.doReady(new YourFramework());

}

Answer 3

我是TypeScript的新手，所以请随意忽略我，但我个人更喜欢检查类型是否是一个函数，因为它更明确和安全（至少在vanilla JS中）。猜测这是我不知道的TypeScript的一部分，但是在定义时可以有很多引用。

if (typeof method === 'function') {
    method();
}

或者你可能会逃脱：

method && method();

在编译时可能不存在的Typescript调用函数

3 个答案: