Is there a design pattern that functions like observer mixed with decorator?

Question

I noticed that when using something like XNA/C# (game engine) a while ago that you simply added components to an object and that gave it extra functionality. For example:

Class Spaceship has components, Collidable, Gravity, Controls and more...

Typically these components implement IUpdatable/IDrawable Interfaces or DrawableGameComponent or something else: https://gamedev.stackexchange.com/questions/20918/what-happens-when-i-implement-iupdateable-or-idrawable-in-xna

When it comes time to update/draw or some other "event" all components get called that have those events on them, which makes me think of observer pattern. Yet these functions seem like they are "decorating" the main class.

Is this a known pattern? What is it called? Is this a good pattern to use beyond game dev? The reason I tagged JavaScript is because I was thinking about doing something like this in JS, and I was wondering if anyone has seen someone do something similar.

It may look something like this:

function Watcher() {
    this.components = [];
    this.update() = function() {
        for (component in this.components) {
            if (typeof component.update === "function") {
                component.update();
            }                
        }            
    };
}

function Component() {
    this.update = function() {
    };
}

function Wiggle(obj) {
    _.extend(this, Component.prototype);
    this.obj = obj;
    this.wiggled = false;
    this.update = function() {
        if (this.wiggled) {
            this.obj.x -= 1;         
        } else {
            this.obj.x += 1;            
        }
        wiggled = !wiggled;           
    };
}

function Car() {
    this.x = 0;
    _.extend(this, Watcher.prototype);
    this.components.push(new Wiggle(this));
}

Events might then get triggered and all of cars components would be updated.

score 2 · Answer 1 · edited May 23 '17 at 12:02

2

I think you mean mixins (Javascript) or Traits (PHP)

Mixins are basically just _.extend'ing (or $.extend'ing) your current object with another object (that already has some attributes / functions). You can read up more on it at http://www.joezimjs.com/javascript/javascript-mixins-functional-inheritance/

Traits for PHP (5.4) are a bit stronger and you can do a lot of really cool things. Here's a good example from stackoverflow: Traits in PHP – any real world examples/best practices?

edited May 23 '17 at 12:02

Community

1
1

answered Oct 16 '12 at 22:54

Peeter

9,282
5
36
53

Well I don't think anything is being extended. If some update function exists in these "components" it will get called when the update function of the main object gets called. I could however reverse that logic and just call all the update functions of the nested objects, but that doesn't really make use of the design pattern I think. – Parris Oct 16 '12 at 23:01
Yea, that is what I was saying. However, this is sort of what I'd be trying to do: http://jsfiddle.net/B4ARF/1/ it should't actually work. Just think of it as psuedo code. Updating the question! Thanks! – Parris Oct 16 '12 at 23:29

score 1 · Accepted Answer · answered Oct 18 '12 at 06:50

1

Composite pattern?

Define an interface (Component) for the common behaviour (the update method)

Let all the components impletment Component (Collidable, Gravity, Controls etc)

Let the parent class SpaceShip maintain a list of Components

Let the parent class SpaceShip implement Component as well.

From client perspective SpaceShip is an object that provides update method.

Internally, in it's update method, SpaceShip calls update on all the Components

answered Oct 18 '12 at 06:50

Sameer

4,379
1
23
23

This could work! I also identified it as action/event-listener. Yes the actions are limited, you could add one more piece of functionality that lets you add more "actions" or "events". I am just going to accept yours! ha :) – Parris Oct 19 '12 at 01:21

Is there a design pattern that functions like observer mixed with decorator?

2 Answers2