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();
}