敲碎时间的人的个人专栏
上一篇

js设计模式(组合,装饰)

广告
选中文字可对指定文章内容进行评论啦,→和←可快速切换按钮,绿色背景文字可以点击查看评论额。
大纲

组合设计模式

正如名称所暗示的,组合模式创建原始对象或对象集合。这有助于构建深度嵌套的结构。

在我们的玩具工厂,组合有以下功能:

我们有两个部门,一个是手动部门,两个是自动化部门。

在手动部门,我们有一堆玩具(叶子节点)。

在自动化部门,我们有另一套玩具(叶子节点)。

var Node = function (name) {
    this.children = [];
    this.name = name;
}

Node.prototype = {
    add: function (child) {
        this.children.push(child);
    }
}

function run() {
    var tree = new Node("Star_Wars_Toys");
    var manual = new Node("Manual")
    var automate = new Node("Automated");
    var darth_vader = new Node("Darth Vader");
    var luke_skywalker = new Node("Luke Skywalker");
    var yoda = new Node("Yoda");
    var chewbacca = new Node("Chewbacca");

    tree.add(manual);
    tree.add(automate);

    manual.add(darth_vader);
    manual.add(luke_skywalker);

    automate.add(yoda);
    automate.add(chewbacca);
}

装饰设计模式

装饰器模式扩展了对象的属性和方法,在运行时为其添加了新的行为。多个装饰器可用于添加或覆盖对象的实际功能。

在我们的玩具工厂里,我们有一个给玩具起名字的功能。而且,我们还有一个额外的装饰器来说明该类型。

var Toy = function (name) {
    this.name = name;
    this.display = function () {
        console.log("Toy: " + this.name);
    };
}

var DecoratedToy = function (genre, branding) {
    this.toy = toy;
    this.name = user.name;  // ensures interface stays the same
    this.genre = genre;
    this.branding = branding;
    this.display = function () {
        console.log("Decorated User: " + this.name + ", " +
            this.genre + ", " + this.branding);
    };
}
function run() {
    var toy = new User("Toy");
    var decorated = new DecoratedToy(toy, "fantasy", "Star Wars");
    decorated.display();
}

版权声明:著作权归作者所有。

X

欢迎加群学习交流

联系我们