装饰者模式

1.

//需要装饰的类(函数)

function Macbook() {

    this.cost = function () {

        return 1000;

    };

}



function Memory(macbook) {

    this.cost = function () {

        return macbook.cost() + 75;

    };

}



function BlurayDrive(macbook) {

    this.cost = function () {

        return macbook.cost() + 300;

    };

}





function Insurance(macbook) {

    this.cost = function () {

        return macbook.cost() + 250;

    };

}





// 用法

var myMacbook = new Insurance(new BlurayDrive(new Memory(new Macbook())));

console.log(myMacbook.cost());

2.

function ConcreteClass() {

    this.performTask = function () {

        this.preTask();

        console.log('doing something');

        this.postTask();

    };

}



function AbstractDecorator(decorated) {

    this.performTask = function () {

        decorated.performTask();

    };

}



function ConcreteDecoratorClass(decorated) {

    this.base = AbstractDecorator;

    this.base(decorated);



    decorated.preTask = function () {

        console.log('pre-calling..');

    };



    decorated.postTask = function () {

        console.log('post-calling..');

    };



}



var concrete = new ConcreteClass();

var decorator1 = new ConcreteDecoratorClass(concrete);

var decorator2 = new ConcreteDecoratorClass(decorator1);

decorator2.performTask();

3.

var tree = {};

tree.decorate = function () {

    console.log('Make sure the tree won\'t fall');

};



tree.getDecorator = function (deco) {

    tree[deco].prototype = this;

    return new tree[deco];

};



tree.RedBalls = function () {

    this.decorate = function () {

        this.RedBalls.prototype.decorate(); // 第7步:先执行原型(这时候是Angel了)的decorate方法

        console.log('Put on some red balls'); // 第8步 再输出 red

        // 将这2步作为RedBalls的decorate方法

    }

};



tree.BlueBalls = function () {

    this.decorate = function () {

        this.BlueBalls.prototype.decorate(); // 第1步:先执行原型的decorate方法,也就是tree.decorate()

        console.log('Add blue balls'); // 第2步 再输出blue

        // 将这2步作为BlueBalls的decorate方法

    }

};



tree.Angel = function () {

    this.decorate = function () {

        this.Angel.prototype.decorate(); // 第4步:先执行原型(这时候是BlueBalls了)的decorate方法

        console.log('An angel on the top'); // 第5步 再输出angel

        // 将这2步作为Angel的decorate方法

    }

};



tree = tree.getDecorator('BlueBalls'); // 第3步:将BlueBalls对象赋给tree,这时候父原型里的getDecorator依然可用

tree = tree.getDecorator('Angel'); // 第6步:将Angel对象赋给tree,这时候父原型的父原型里的getDecorator依然可用

tree = tree.getDecorator('RedBalls'); // 第9步:将RedBalls对象赋给tree



tree.decorate(); // 第10步:执行RedBalls对象的decorate方法

4.

/* The Bicycle interface. */



var Bicycle = new Interface('Bicycle', ['assemble', 'wash', 'ride', 'repair', 

    'getPrice']);



/* The AcmeComfortCruiser class. */



var AcmeComfortCruiser = function() { // implements Bicycle

  ...

};

AcmeComfortCruiser.prototype = {

  assemble: function() {

    ...

  },

  wash: function() {

    ...

  },

  ride: function() {

    ...

  },

  repair: function() {

    ...

  },

  getPrice: function() {

    return 399.00;

  }

};



/* The BicycleDecorator abstract decorator class. */



var BicycleDecorator = function(bicycle) { // implements Bicycle

  Interface.ensureImplements(bicycle, Bicycle);

  this.bicycle = bicycle;

}

BicycleDecorator.prototype = {

  assemble: function() {

    return this.bicycle.assemble();

  },

  wash: function() {

    return this.bicycle.wash();

  },

  ride: function() {

    return this.bicycle.ride();

  },

  repair: function() {

    return this.bicycle.repair();

  },

  getPrice: function() {

    return this.bicycle.getPrice();

  }

};



/* HeadlightDecorator class. */



var HeadlightDecorator = function(bicycle) { // implements Bicycle

  this.superclass.constructor(bicycle); // Call the superclass's constructor.

}

extend(HeadlightDecorator, BicycleDecorator); // Extend the superclass.

HeadlightDecorator.prototype.assemble = function() {

  return this.bicycle.assemble() + ' Attach headlight to handlebars.';

};

HeadlightDecorator.prototype.getPrice = function() {

  return this.bicycle.getPrice() + 15.00;

};





/* TaillightDecorator class. */



var TaillightDecorator = function(bicycle) { // implements Bicycle

  this.superclass.constructor(bicycle); // Call the superclass's constructor.

}

extend(TaillightDecorator, BicycleDecorator); // Extend the superclass.

TaillightDecorator.prototype.assemble = function() {

  return this.bicycle.assemble() + ' Attach taillight to the seat post.';

};

TaillightDecorator.prototype.getPrice = function() {

  return this.bicycle.getPrice() + 9.00;

};





/* Usage. */



var myBicycle = new AcmeComfortCruiser(); // Instantiate the bicycle.

alert(myBicycle.getPrice()); // Returns 399.00



myBicycle = new TaillightDecorator(myBicycle); // Decorate the bicycle object

                                               // with a taillight.

alert(myBicycle.getPrice()); // Now returns 408.00



myBicycle = new HeadlightDecorator(myBicycle); // Decorate the bicycle object

                                               // again, now with a headlight.

alert(myBicycle.getPrice()); // Now returns 423.00

你可能感兴趣的:(装饰者模式)