面试题：TypeScript 中 instanceof 类型保护在类继承结构中的复杂应用

Question

假设有一个类继承体系，基类为 Animal ，有 eat 方法；子类 Dog 继承自 Animal 并新增 bark 方法。编写一个函数，接受一个 Animal 类型的实例，使用 instanceof 类型保护判断传入的实例是否为 Dog 类型，如果是，则调用 bark 方法并返回叫声，否则返回 'Not a dog' 。同时说明在复杂类继承结构中使用 instanceof 类型保护可能遇到的问题及解决方案。

Answer 1

class Animal {
    eat() {
        console.log('Animal is eating');
    }
}

class Dog extends Animal {
    bark() {
        return 'Woof!';
    }
}

function checkAndBark(animal) {
    if (animal instanceof Dog) {
        return animal.bark();
    } else {
        return 'Not a dog';
    }
}

在复杂类继承结构中使用 instanceof 类型保护可能遇到的问题：

1. 跨框架或跨上下文问题：在不同的 JavaScript 环境（如不同的 iframe 或不同的模块加载器上下文）中，类的构造函数可能不同，导致 instanceof 判断失效。因为 instanceof 是基于原型链来判断的，不同上下文的类构造函数的原型链可能不同。
2. 多重继承模拟导致的混淆：JavaScript 本身不支持多重继承，但通过一些技巧可以模拟多重继承。在这种复杂情况下，instanceof 可能给出不直观或错误的结果，因为一个对象可能有多个潜在的“父类”原型链需要判断。
3. 代码可维护性和可读性问题：随着类继承结构变得复杂，大量使用 instanceof 会使代码充满类型判断逻辑，降低代码的可读性和可维护性。代码会变得难以理解和修改，并且容易引入 bug。

解决方案：

1. 使用类型标记：在类中添加一个静态属性作为类型标记。例如：

class Animal {
    static type = 'animal';
    eat() {
        console.log('Animal is eating');
    }
}

class Dog extends Animal {
    static type = 'dog';
    bark() {
        return 'Woof!';
    }
}

function checkAndBark(animal) {
    if (animal.type === 'dog') {
        return animal.bark();
    } else {
        return 'Not a dog';
    }
}

2. 依赖注入与策略模式：避免直接使用 instanceof 进行类型判断，而是通过依赖注入的方式，将需要的行为作为参数传递给函数。这样可以解耦对象类型和行为，提高代码的可维护性和可测试性。例如：

class Animal {
    eat() {
        console.log('Animal is eating');
    }
}

class Dog extends Animal {
    bark() {
        return 'Woof!';
    }
}

function checkAndBark(animal, barkFunction) {
    if (barkFunction) {
        return barkFunction();
    } else {
        return 'Not a dog';
    }
}

let dog = new Dog();
checkAndBark(dog, dog.bark.bind(dog));

3. 使用 TypeScript 类型断言：如果项目使用 TypeScript，可以利用类型断言来进行更安全的类型操作。TypeScript 可以在编译时进行类型检查，减少运行时类型判断的复杂性。例如：

class Animal {
    eat() {
        console.log('Animal is eating');
    }
}

class Dog extends Animal {
    bark() {
        return 'Woof!';
    }
}

function checkAndBark(animal: Animal) {
    if ('bark' in animal) {
        return (animal as Dog).bark();
    } else {
        return 'Not a dog';
    }
}