javascript设计模式-装饰着模式

装饰者模式，Decorator Pattern。在不改变原类和继承的情况下动态扩展对象功能，通过包装一个对象来实现一个新的具有原对象相同接口的新的对象。

装饰者模式特点：

    1. 不修改原对象的原本结构来进行功能添加。
    2. 装饰对象和原对象具有相同的接口，可以使客户以与原对象相同的方式使用装饰对象。
    3. 装饰对象中包含原对象的引用，即装饰对象为真正的原对象在此包装的对象。

装饰者模式可以为对象添加功能从而代替了编写大量子类的情况。
    以JS设计模式实例为例，首先自行车商店有4种类型自行车：

　　

<!DOCTYPE HTML>
<html>
<body>

<script>
    function ABicycle(){ }
    ABicycle.prototype = {
        wash : function(){ },
        ride : function(){ },
        getPrice : function(){
            return 999;
        }
    }

    function extend( subClass, superClass ){
        var F = function(){};
        F.prototype = superClass.prototype;
        subClass.prototype = new F();
        subClass.prototype.constructor = subClass;

        // 此处指向superClass的prototype 比直接保存superClass使用更为方便
        subClass.superclass = superClass.prototype;
        if( superClass.prototype.constructor === Object.prototype.constructor ){
            superClass.prototype.constructor = superClass;
        }
    }

    function BicycleDecorator( bicycle ){
        this.bicycle = bicycle;
    }
    BicycleDecorator.prototype = {
        wash : function(){
            return this.bicycle.wash();
        },
        ride : function(){
            return this.bicycle.ride();
        },
        getPrice : function(){
            return this.bicycle.ride();
        }
    }

    var BicycleBell = function( bicycle ){
        // 继承 BicycleDecorator 内部 this定义的数据或者方法
        BicycleBell.superclass.constructor(  bicycle );
    }
    // 继承 BicycleDecorator.prototype 并且添加 BicycleBell.superclass 指向 BicycleDecorator.prototype
    extend( BicycleBell, BicycleDecorator );
    // 添加或者修改
    BicycleBell.prototype.bell = function(){
        console.log("ding! ding! ding!");
    }
    BicycleBell.prototype.getPrice = function(){
        console.log(this)
        return this.bicycle.getPrice() + 100;
    }

    var bicycleA = new ABicycle();
    bicycleA = new BicycleBell( bicycleA );
    console.log(bicycleA.getPrice());







</script>

</body>
</html>

　　

posted @ 2015-11-06 12:57  Sean丶  阅读(257)  评论(0)    收藏  举报