学习JavaScript设计模式(多态)

学习JavaScript设计模式的过程中，多态是一个重要的概念。本篇攻略将详细讲解什么是多态，以及如何在JavaScript中实现多态。

什么是多态

多态是面向对象编程中的一个重要概念，它指的是不同的对象可以对同一消息做出不同的响应。简单来说，就是同一个函数的不同形态。

在实际编程中，多态可以大大提高代码的复用性和可扩展性。通过多态，我们可以方便地实现代码的扩展和修改，而不必改变原有的代码结构。

如何实现多态

在JavaScript中，有多种方式可以实现多态，以下介绍两种常见的方法。

方法重载

方法重载是最常见的实现多态的方式之一。方法重载指的是同一个函数名，但是有不同的参数表，这样不同的参数调用同一个函数时，会根据参数类型的不同自动识别并调用相应的函数。

例如，我们可以定义一个sum函数，接收不同的参数来实现多态：

function sum (a, b) {
    if (typeof a === 'number' && typeof b === 'number') {
        return a + b;
    }
    if (typeof a === 'string' && typeof b === 'string') {
        return a + b;
    }
    return '参数类型不匹配';
}

调用时，可以根据不同参数的类型得到不同的结果：

console.log(sum(1, 2));       // 3
console.log(sum('1', '2'));   // 12
console.log(sum(1, '2'));    // 参数类型不匹配

继承和重写

继承和重写也是实现多态的一种方式。通过继承一个父类，并在子类中重写父类中的方法，可以实现不同的子类对同一个父类方法的不同实现。

例如，我们可以定义一个Animal父类和若干个Cat和Dog子类：

class Animal {
    speak () {
        console.log('Animal speaks');
    }
}

class Cat extends Animal {
    speak () {
        console.log('Cat meows');
    }
}

class Dog extends Animal {
    speak () {
        console.log('Dog barks');
    }
}

调用时，不同的子类会有不同的行为：

const animal = new Animal();
animal.speak();      // 输出: Animal speaks

const cat = new Cat();
cat.speak();         // 输出: Cat meows

const dog = new Dog();
dog.speak();         // 输出: Dog barks

示例

下面通过一个实际的示例来进一步理解多态。假设现在有一个Shape类作为所有形状的父类，拥有getArea方法来计算形状的面积。我们可以通过继承Shape类，并在不同的子类中重写getArea方法来实现不同形状的计算。

class Shape {
    // 计算形状的面积
    getArea () {
        return 0;
    }
}

class Square extends Shape {
    constructor (side) {
        super();
        this.side = side;
    }

    // 重写getArea方法计算正方形面积
    getArea () {
        return this.side ** 2;
    }
}

class Circle extends Shape {
    constructor (radius) {
        super();
        this.radius = radius;
    }

    // 重写getArea方法计算圆形面积
    getArea () {
        return Math.PI * this.radius ** 2;
    }
}

调用时，可以根据不同的子类来计算它们的面积：

const square = new Square(5);
console.log(square.getArea());    // 输出: 25

const circle = new Circle(5);
console.log(circle.getArea());    // 输出: 78.53981633974483

综上所述，通过方法重载和继承重写两种方式，我们可以在JavaScript中实现多态，方便地进行代码的扩展和修改。