In this post I will be talking about the Composite pattern. In a nutshell, this item (as I understand) is a structural (reference #1) pattern that builds a complex object by parts. Similar in concept to the Builder pattern, but different in implementation. The Builder pattern abstracts the creation of a complex object by adding parts and allowing the composite object to be called at anytime. It uses a single array to keep track of its ‘parts’.
The Composite pattern does this as well…kinda. The difference is that the Composite pattern can have multiple levels while the Builder only allows one. Put another way, the Builder is a one level tree and the Composite is an actual tree.
▪ Make GET call
▪ Review results
The compositeDriver.js runs everything.
In my implementation, I chose to implement the constituent parts (as defined in reference #1) as follows:
▪ Composite – A Composite (I choose to call my composites components) is the entire object with methods to operate on its components. In my implementation, I choose to directly inherit from AbsExampleComponent.js and override each method and define each property. There is no file. Each composite object is created in compositeDriver.js -> createComponentObject(args).
▪ Leaf – TreeComponent.js – A Leaf is a Composite that cannot have sub composites. I choose to not have a separate module/object for this, but use a boolean to indicate state on each composite (i.e. isLeaf = true is a leave and isLeaf = false is a regular component).
From the results display, you can see that I added a three level tree. Level 1 is the root, level 2 is the root’s children and level 3 consists of the root’s grand children (i.e. 7 components in total).