这个问题直接类似于TypeScript中的类类型检查
我需要在运行时找出任何类型的变量是否实现了接口。这是我的代码:
interface A{
member:string;
}
var a:any={member:"foobar"};
if(a instanceof A) alert(a.member);
如果您在typescript游乐场中输入这段代码，最后一行将被标记为错误，“名称A不存在于当前作用域”。但事实并非如此，该名称确实存在于当前作用域中。我甚至可以更改变量声明为var a: a ={成员:"foobar"};没有编辑的抱怨。在浏览网页并找到其他问题后，我将接口更改为类，但我不能使用对象字面量来创建实例。
我想知道A类型是如何消失的，但看看生成的javascript就能解释这个问题:
var a = {
member: "foobar"
};
if(a instanceof A) {
alert(a.member);
}
没有将A表示为接口，因此不可能进行运行时类型检查。
我知道javascript作为一种动态语言没有接口的概念。是否有方法对接口进行类型检查?
typescript游乐场的自动完成显示typescript甚至提供了一个方法实现。我怎么使用它?
因为在运行时类型是未知的，所以我写了如下代码来比较未知对象，不是与类型进行比较，而是与已知类型的对象进行比较:
创建正确类型的示例对象
指定它的哪些元素是可选的
将你的未知对象与这个样本对象进行深度比较
下面是我用于深度比较的(接口不可知)代码:
function assertTypeT<T>(loaded: any, wanted: T, optional?: Set<string>): T {
// this is called recursively to compare each element
function assertType(found: any, wanted: any, keyNames?: string): void {
if (typeof wanted !== typeof found) {
throw new Error(`assertType expected ${typeof wanted} but found ${typeof found}`);
}
switch (typeof wanted) {
case "boolean":
case "number":
case "string":
return; // primitive value type -- done checking
case "object":
break; // more to check
case "undefined":
case "symbol":
case "function":
default:
throw new Error(`assertType does not support ${typeof wanted}`);
}
if (Array.isArray(wanted)) {
if (!Array.isArray(found)) {
throw new Error(`assertType expected an array but found ${found}`);
}
if (wanted.length === 1) {
// assume we want a homogenous array with all elements the same type
for (const element of found) {
assertType(element, wanted[0]);
}
} else {
// assume we want a tuple
if (found.length !== wanted.length) {
throw new Error(
`assertType expected tuple length ${wanted.length} found ${found.length}`);
}
for (let i = 0; i < wanted.length; ++i) {
assertType(found[i], wanted[i]);
}
}
return;
}
for (const key in wanted) {
const expectedKey = keyNames ? keyNames + "." + key : key;
if (typeof found[key] === 'undefined') {
if (!optional || !optional.has(expectedKey)) {
throw new Error(`assertType expected key ${expectedKey}`);
}
} else {
assertType(found[key], wanted[key], expectedKey);
}
}
}
assertType(loaded, wanted);
return loaded as T;
}
下面是我如何使用它的一个例子。
在本例中，我期望JSON包含一个元组数组，其中第二个元素是一个名为User的接口实例(它有两个可选元素)。
TypeScript的类型检查将确保我的示例对象是正确的，然后assertTypeT函数检查未知(从JSON加载的)对象是否与示例对象匹配。
export function loadUsers(): Map<number, User> {
const found = require("./users.json");
const sample: [number, User] = [
49942,
{
"name": "ChrisW",
"email": "example@example.com",
"gravatarHash": "75bfdecf63c3495489123fe9c0b833e1",
"profile": {
"location": "Normandy",
"aboutMe": "I wrote this!\n\nFurther details are to be supplied ..."
},
"favourites": []
}
];
const optional: Set<string> = new Set<string>(["profile.aboutMe", "profile.location"]);
const loaded: [number, User][] = assertTypeT(found, [sample], optional);
return new Map<number, User>(loaded);
}
您可以在用户定义的类型保护的实现中调用这样的检查。
export interface ConfSteps {
group: string;
key: string;
steps: string[];
}
private verify(): void {
const obj = `{
"group": "group",
"key": "key",
"steps": [],
"stepsPlus": []
} `;
if (this.implementsObject<ConfSteps>(obj, ['group', 'key', 'steps'])) {
console.log(`Implements ConfSteps: ${obj}`);
}
}
private objProperties: Array<string> = [];
private implementsObject<T>(obj: any, keys: (keyof T)[]): boolean {
JSON.parse(JSON.stringify(obj), (key, value) => {
this.objProperties.push(key);
});
for (const key of keys) {
if (!this.objProperties.includes(key.toString())) {
return false;
}
}
this.objProperties = null;
return true;
}
你也可以向子组件发送多个输入，其中一个是鉴别器，另一个是实际数据，并检查子组件中的鉴别器，如下所示:
@Input() data?: any;
@Input() discriminator?: string;
ngOnInit(){
if(this.discriminator = 'InterfaceAName'){
//do stuff
}
else if(this.discriminator = 'InterfaceBName'){
//do stuff
}
}
显然，你可以把它移动到任何它适用的地方，比如ngOnChanges函数或setter函数，但这个想法仍然成立。如果你想要一个响应式表单，我还建议尝试将ngModel绑定到输入数据上。你可以使用这些if语句根据传入的数据来设置ngModel，并在html中反映:
<div [(ngModel)]={{dataModel}}>
<div *ngFor="let attr of (data | keyvalue)">
<!--You can use attr.key and attr.value in this situation to display the attributes of your interface, and their associated values from the data -->
</div>
</div>
或者用这个代替:
<div *ngIf = "model == 'InterfaceAName'">
<div>Do This Stuff</div>
</div>
<div *ngIf= "model == 'IntefaceBName'">
<div>Do this instead</div>
</div>
(您可以使用attr。键和attr。值在这种情况下显示接口的属性，以及它们从数据中关联的值)
我知道这个问题已经有了答案，但我认为这可能对试图构建半模糊的角形式的人有用。你也可以将此用于角材料模块(例如对话框)，通过数据参数发送两个变量——一个是你的实际数据，另一个是判别器，并通过类似的过程检查它。最终，这将允许您创建一个表单，并围绕流入其中的数据塑造表单。
现在这是可能的，我刚刚发布了一个增强版的TypeScript编译器，它提供了完整的反射功能。您可以从类的元数据对象实例化类，从类构造函数检索元数据，并在运行时检查接口/类。你可以在这里查看
使用的例子:
在你的一个typescript文件中，创建一个接口和一个实现它的类，如下所示:
interface MyInterface {
doSomething(what: string): number;
}
class MyClass implements MyInterface {
counter = 0;
doSomething(what: string): number {
console.log('Doing ' + what);
return this.counter++;
}
}
现在让我们打印一些已实现接口的列表。
for (let classInterface of MyClass.getClass().implements) {
console.log('Implemented interface: ' + classInterface.name)
}
使用reflect -ts编译并启动它:
$ node main.js
Implemented interface: MyInterface
Member name: counter - member kind: number
Member name: doSomething - member kind: function
有关接口元类型的详细信息，请参阅reflect .d.ts。
更新:
您可以在这里找到一个完整的工作示例
使用字符串文字是很困难的，因为如果你想重构你的方法或接口名称，那么你的IDE可能不重构这些字符串文字。
我为您提供我的解决方案，如果在接口中至少有一个方法
export class SomeObject implements interfaceA {
public methodFromA() {}
}
export interface interfaceA {
methodFromA();
}
检查object是否为interface类型:
const obj = new SomeObject();
const objAsAny = obj as any;
const objAsInterfaceA = objAsAny as interfaceA;
const isObjOfTypeInterfaceA = objAsInterfaceA.methodFromA != null;
console.log(isObjOfTypeInterfaceA)
注意:即使我们删除了'implements interfaceA'，我们也会得到true，因为SomeObject类中仍然存在该方法
