JavaScript 的 7 种设计模式 javascript设计模式( 三 )

我为类VehicleFactory创建了一个新的工厂对象。然后，我们通过调用factory.createVehicle方法并传递options对象来创建一个新的car或truck对象，其vehicleType属性可能是Car或Truck 。
不及物动词装饰模式装饰模式用于在不修改现有类或构造函数的情况下扩展对象的功能。这种模式可用于向对象添加功能，而无需修改底层代码。
这种模式的一个简单例子是:
function Car(name) {this.name = name;// Default valuesthis.color = 'White';}// Creating a new Object to decorateconst tesla= new Car('Tesla Model 3');// Decorating the object with new functionalitytesla.setColor = function(color) {this.color = color;}tesla.setPrice = function(price) {this.price = price;}tesla.setColor('black');tesla.setPrice(49000);// prints blackconsole.log(tesla.color);
这种模式的一个更实际的例子是:
假设一辆车的成本取决于它的功能数量。如果没有装饰模式，我们将不得不为不同的功能组合创建不同的类，并且每个类都有一个成本方法来计算成本。例如:
class Car() {}class CarWithAC() {}class CarWithAutoTransmission {}class CarWithPowerLocks {}class CarWithACandPowerLocks {}
但是，通过decorator模式，我们可以创建一个基类car，并通过decorator函数为不同的对象添加相应的成本逻辑。
class Car {constructor() {// Default Costthis.cost = function() {return 20000;}}}// Decorator functionfunction carWithAC(car) {car.hasAC = true;const prevCost = car.cost();car.cost = function() {return prevCost + 500;}}// Decorator functionfunction carWithAutoTransmission(car) {car.hasAutoTransmission = true;const prevCost = car.cost();car.cost = function() {return prevCost + 2000;}}// Decorator functionfunction carWithPowerLocks(car) {car.hasPowerLocks = true;const prevCost = car.cost();car.cost = function() {return prevCost + 500;}}
首先，我们创建了汽车的基础类Car 。然后，为要添加的特性创建一个装饰器，这个装饰器将一个汽车对象作为参数。然后，通过返回更新的汽车成本来覆盖对象的成本函数，并添加一个属性来标识是否添加了一个特性。
要添加新功能，我们只需像下面这样做:
const car = new Car();console.log(car.cost());carWithAC(car);carWithAutoTransmission(car);carWithPowerLocks(car);
最后，我们可以这样计算汽车的成本:
// Calculating total cost of the carconsole.log(car.cost());
结论我们已经了解了JavaScript中使用的各种设计模式，但是这里没有可以用JavaScript实现的设计模式。
虽然了解各种设计模式很重要，但不过度使用它们也同样重要。在使用设计模式之前，你应该仔细考虑你的问题是否适合设计模式。要知道某个模式是否适合你的问题，你要研究设计模式及其应用。