<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>ActionScript 3.0 Design Patterns &#187; Class Relations</title>
	<atom:link href="http://www.as3dp.com/category/class-relations/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.as3dp.com</link>
	<description>OOP Techniques for Flash and Flex Developers</description>
	<lastBuildDate>Sun, 29 Jan 2012 17:00:46 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>ActionScript 3.0 Saturated Bridge Design Pattern 2: Bridge Clock Implementation</title>
		<link>http://www.as3dp.com/2011/03/actionscript-3-0-saturated-bridge-design-pattern-2-bridge-clock-implementation/</link>
		<comments>http://www.as3dp.com/2011/03/actionscript-3-0-saturated-bridge-design-pattern-2-bridge-clock-implementation/#comments</comments>
		<pubDate>Mon, 14 Mar 2011 00:32:50 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Abstract Classes]]></category>
		<category><![CDATA[Aggregation]]></category>
		<category><![CDATA[Bridge]]></category>
		<category><![CDATA[Saturated Bridge]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=4947</guid>
		<description><![CDATA[Aggregation Magic In discussing aggregation, the Gang of Four left a lot of loose ends, and the relationship can be difficult to grasp. It&#8217;s something like an acquaintance but is stronger. Nevertheless, acquaintances can be just as strong but not be aggregations. So is it really that important to distinguish between aggregation and acquaintances? In [...]]]></description>
			<content:encoded><![CDATA[<p><div id="attachment_4858" class="wp-caption alignleft" style="width: 260px"><img src="http://www.as3dp.com/wp-content/uploads/2011/03/MoonBridge.png" alt="Independent Variationby Decoupling Abstractions and Implementations" title="MoonBridge" width="250" height="213" class="size-full wp-image-4858" /><p class="wp-caption-text">Make an Orthogonally Designed Alarm Clock</p></div><strong>Aggregation Magic</strong></p>
<p>In discussing <strong>aggregation</strong>, the Gang of Four left a lot of loose ends, and the relationship can be difficult to grasp. It&#8217;s something like an <strong>acquaintance</strong> but is stronger. Nevertheless, acquaintances can be just as strong but not be aggregations. So is it really that important to distinguish between aggregation and acquaintances? In most cases the distinction is important  because while many similarities exist between them (just as with men and women), the differences change the character of the relationship.  Gamma <em>et al</em> point out,</p>
<blockquote><p>Aggregation implies that an aggregate object and its owner have identical lifetimes, (p. 22)</p></blockquote>
<p>but that description brings up other questions. We can assume that an aggregate object is the combination of two objects bound through aggregation. However, what is its <em>owner</em>? In <a href="http://www.as3dp.com/2011/03/06/actionscript-3-0-saturated-abstract-bridge-intention/">Part I</a> of this series, you saw that the Bridge pattern is made up in part of an orthogonal component bound by aggregation. That&#8217;s pretty clear, but how is that component <em>owned</em>? Does that mean the parts that make up the component are the owners? If one or the other of the aggregated objects (classes) ceases to be; so will the other one. Thus, the parts are the owners. However, another way of looking at ownership in an aggregate relationship is by examining it parts.</p>
<p>The aggregation relationship is characterized by the Aggregator and Aggregatee as shown in Figure 1.<br />
<div id="attachment_2486" class="wp-caption alignnone" style="width: 449px"><img src="http://www.as3dp.com/wp-content/uploads/2010/01/aggregation.png" alt="&lt;em&gt;&lt;strong&gt;Figure 1: &lt;/strong&gt;Aggregator and Aggregatee&lt;/em&gt;" title="aggregation" width="439" height="61" class="size-full wp-image-2486" /><p class="wp-caption-text"><em><strong>Figure 1: </strong>Does the Aggregator own Aggregatee?</em></p></div></p>
<p>In this model, it would appear that the aggregator is the &#8220;owner.&#8221; It defines the relationship by holding a reference to the aggregatee.</p>
<p>The Orthogonal Bridge</p>
<p>The &#8220;aggregateinstance&#8221; in Figure 1 is the &#8220;bridge&#8221; in the Bridge pattern, and it is the orthogonal component discussed in detail in Part I of this series. The next step in understanding the Bridge design pattern is to implement it. The alarm clock provides a clear way to see the relationship between objects linked by an aggregation that makes up an orthogonal component. Figure 2 show the files for the implementation arranged in a File Diagram:<br />
<div id="attachment_4949" class="wp-caption alignnone" style="width: 494px"><img src="http://www.as3dp.com/wp-content/uploads/2011/03/BridgeFileDiagram.png" alt="&lt;em&gt;&lt;strong&gt;Figure 2: &lt;/strong&gt;Bridge File Class Diagram&lt;/em&gt;" title="BridgeFileDiagram" width="484" height="221" class="size-full wp-image-4949" /><p class="wp-caption-text"><em><strong>Figure 2: </strong>Bridge File Class Diagram</em></p></div><br />
This Bridge example is quite simple and easy to understand as a Bridge pattern. The two interfaces are made up of an abstract class (IAlarmClock) and an interface (IAlarm.) You can think of the physical alarm clock as an instrument that keeps time and the alarm as a sound it makes to generate an alert. The clock and its alarm can vary independently but work in conjunction. The clock has a time-keeping function that can be used to call the alarm when needed. In the example, the clock implementation is that of an analog clock that rings a bell and a clock radio that plays Ride of the Valkyrires (Wagner&#8217;s Walkürenritt). It&#8217;s easy to add a different clock implementation (a Cuckoo clock, for example) or a different alarm—a rocket ship blasting off if you wish. The following two buttons will download and Play the example for you:<br />
<a href="http://www.sandlight.com/bridge/" target="_blank"><img src="http://www.as3dp.com/wp-content/uploads/2009/07/play.png" alt="play" title="play" width="99" height="47" class="alignleft size-full wp-image-1257" /></a><a href="http://poobah.mwd.hartford.edu/wsanders/bridge/BridgeClock.zip"><img src="http://www.as3dp.com/wp-content/uploads/2009/11/kilroy.png" alt="kilroy" title="kilroy" width="112" height="56" class="alignnone size-full wp-image-2020" /></a></p>
<p>The clocks do not update, but they should display your accurate local time. You can easily put a Timer object in the program to make the clocks work like running clocks.  Likewise, while I did not place an alarm setting function in the clocks, I placed an alarm testing button.<em> That&#8217;s so you wouldn&#8217;t have to sit around waiting for the alarm to ring.</em> However, it wouldn&#8217;t be difficult to do so. In fact if any of you want to place a running clock in the pattern by extending another implementation from the <strong>IAlarmClock</strong> abstract class, I&#8217;d very much like to see it, and I&#8217;ll display it on the next blog entry in this series—same with implementations to the <strong>IAlarm</strong> interface. Okay so where do we start with implementing this pattern? Read on.<br />
<span id="more-4947"></span></p>
<p><strong>The Reversed Engineered Implementation of the Alarm</strong></p>
<p>We might as well start at the ending. In fact I knew where I was going (driving backwards) because I had a good sense of the Bridge pattern; so it wasn&#8217;t starting without a roadmap. I wanted to start with an <em>alarm</em> implementation. Getting the sounds was easy (check out <a href="http://www.gutenberg.org/ebooks/10177">Project Gutenberg</a> and the old standby, <a href="http://www.flashkit.com/">Flash Kit</a> for mp3 sounds). However, I always have to go back and re-learn the procedure for playing sounds since I don&#8217;t use sounds that much. The following implementation was used for both with the only difference being the MP3 selected:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p4947code7'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p49477"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
</pre></td><td class="code" id="p4947code7"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//Clock radio IAlarm implementation</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">net</span>.<span style="color: #006600;">URLRequest</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Loader</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">media</span>.<span style="color: #0066CC;">Sound</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">media</span>.<span style="color: #006600;">SoundChannel</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> RideAlarm <span style="color: #0066CC;">implements</span> IAlarm
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> aChannel:SoundChannel;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> aSound:<span style="color: #0066CC;">Sound</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> aRequest:URLRequest;
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> alarmPlay<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			aSound=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Sound</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			aChannel=<span style="color: #000000; font-weight: bold;">new</span> SoundChannel<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			aRequest=<span style="color: #000000; font-weight: bold;">new</span> URLRequest<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;alarms/rideOfValkyries.mp3&quot;</span><span style="color: #66cc66;">&#41;</span>;
			aSound.<span style="color: #0066CC;">load</span><span style="color: #66cc66;">&#40;</span>aRequest<span style="color: #66cc66;">&#41;</span>;
			aChannel=aSound.<span style="color: #0066CC;">play</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> alarmOff<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>aChannel<span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				aChannel.<span style="color: #0066CC;">stop</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>It&#8217;s pretty simple. All I really needed were methods to play the alarm and to shut it off. From here I backed into the IAlarm interface:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p4947code8'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p49478"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
</pre></td><td class="code" id="p4947code8"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//Alarm interface</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">public</span> <span style="color: #0066CC;">interface</span> IAlarm
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #000000; font-weight: bold;">function</span> alarmPlay<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #000000; font-weight: bold;">function</span> alarmOff<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>I don&#8217;t mean to sound like any idiot can get this stuff, but sometimes we make things harder for ourselves than we should—especially when it comes to design patterns. (Yes, I know this is a simple example. It&#8217;s supposed to be, but if you can grasp the pattern concept, then you&#8217;re good to go for more complex implementations of the same pattern.)</p>
<p><strong>Alarm Clocks</strong></p>
<p>Early on I decided that the alarm triggers in the clocks would be buttons rather than a timing trigger. The concepts of triggering the alarm are identical—an event does it. It really doesn&#8217;t matter whether the event is one caused by a Date method or MouseEvent; so I used a MouseEvent so that I could play with the clock and the alarm during development.</p>
<p>For the clocks, I definitely wanted to start with the abstract class from which the clock implementations would come from. First, I had to make sure that the abstract class held a reference to the IAlarm interface. Second, I had a good idea of what methods were needed even though their implementation would vary. The following listing shows the abstract class, IAlarmClock:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p4947code9'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p49479"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
</pre></td><td class="code" id="p4947code9"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//Abstract class for Alarm Clock</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Sprite</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">errors</span>.<span style="color: #006600;">IllegalOperationError</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> IAlarmClock <span style="color: #0066CC;">extends</span> Sprite
	<span style="color: #66cc66;">&#123;</span>
		protected <span style="color: #000000; font-weight: bold;">var</span> timeNow:<span style="color: #0066CC;">Date</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Date</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		protected <span style="color: #000000; font-weight: bold;">var</span> alarm:IAlarm;
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> curTime<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Sprite
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">throw</span> <span style="color: #000000; font-weight: bold;">new</span> IllegalOperationError<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;Must override&quot;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> doAlarm<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">throw</span> <span style="color: #000000; font-weight: bold;">new</span> IllegalOperationError<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;Must override&quot;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> offAlarm<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">throw</span> <span style="color: #000000; font-weight: bold;">new</span> IllegalOperationError<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;Must override&quot;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>I knew that the <strong>Date</strong> object would be needed for the clocks because the class has properties for the hours and minutes needed for the clock hands and &#8220;digital&#8221; display. The <strong>IAlarm</strong> instance, <strong>alarm</strong>, established an aggregate relationship between the abstract class and alarm interface.</p>
<p>The implementations of the <strong>curTime()</strong> method were very close to being constructor functions. The idea of the method originally had been to update the time in hours and minutes from the parent class <strong>timeNow</strong> property. However, I ended up using it for building the clock and setting the hands or &#8220;digital&#8221; values on the clocks as well as getting the time and instantiating the alarm implementations.</p>
<p>Unlike the alarm implementations, the clock implementations were very different. One was used to set up an analog clock and the other a &#8220;clock radio.&#8221; I had drawn the face and the clock hands and saved them as Sprite classes, <strong>ClockFace</strong>,<strong> Hour</strong> and <strong>Minute</strong>. The following two listings show these implementations:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p4947code10'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p494710"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
</pre></td><td class="code" id="p4947code10"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//Analog clock: IAlarmClock implementation</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Sprite</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> BellClock <span style="color: #0066CC;">extends</span> IAlarmClock
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> minHand:Minute=<span style="color: #000000; font-weight: bold;">new</span> Minute<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> hrHand:Hour=<span style="color: #000000; font-weight: bold;">new</span> Hour<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> cFace:ClockFace=<span style="color: #000000; font-weight: bold;">new</span> ClockFace<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> clockUp:Sprite=<span style="color: #000000; font-weight: bold;">new</span> Sprite<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> adjust:uint;
&nbsp;
		<span style="color: #0066CC;">public</span> override <span style="color: #000000; font-weight: bold;">function</span> curTime<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Sprite
		<span style="color: #66cc66;">&#123;</span>
			alarm=<span style="color: #000000; font-weight: bold;">new</span> DingAlarm<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			cFace.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">100</span>;
			hrHand.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">200</span>,hrHand.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">100</span>;
			hrHand.<span style="color: #006600;">rotation</span>=<span style="color: #66cc66;">&#40;</span>timeNow.<span style="color: #006600;">hours</span>+<span style="color: #66cc66;">&#40;</span>timeNow.<span style="color: #006600;">minutes</span><span style="color: #66cc66;">/</span><span style="color: #cc66cc;">60</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">*</span><span style="color: #cc66cc;">30</span>
			minHand.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">200</span>,minHand.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">100</span>;
			minHand.<span style="color: #006600;">rotation</span>=timeNow.<span style="color: #006600;">minutes</span><span style="color: #66cc66;">*</span><span style="color: #cc66cc;">6</span>;
			clockUp.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>cFace<span style="color: #66cc66;">&#41;</span>;
			clockUp.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>hrHand<span style="color: #66cc66;">&#41;</span>;
			clockUp.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>minHand<span style="color: #66cc66;">&#41;</span>;
			<span style="color: #b1b100;">return</span> clockUp;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">public</span> override <span style="color: #000000; font-weight: bold;">function</span> doAlarm<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			alarm.<span style="color: #006600;">alarmPlay</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">public</span> override <span style="color: #000000; font-weight: bold;">function</span> offAlarm<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			alarm.<span style="color: #006600;">alarmOff</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>The clock radio implementation uses a Sprite backdrop from the Library. The &#8220;digital&#8221; output is a text field with the current time (in hours and minutes). It is set up in a 12-hour loop even though no &#8220;AM&#8221; and &#8220;PM&#8221; indicators are used. (Think of it as another opportunity for improvement.) The important feature is that it uses the same interface (abstract class parent) and instantiates the concrete alarm just like the analog clock.</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p4947code11'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p494711"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
</pre></td><td class="code" id="p4947code11"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//Clock radio implementation of IAlarmClock</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #0066CC;">text</span>.<span style="color: #0066CC;">TextField</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #0066CC;">text</span>.<span style="color: #006600;">TextFieldAutoSize</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #0066CC;">text</span>.<span style="color: #0066CC;">TextFormat</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Sprite</span>;
	<span style="color: #0066CC;">import</span> fl.<span style="color: #006600;">motion</span>.<span style="color: #006600;">AdjustColor</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> RadioClock <span style="color: #0066CC;">extends</span> IAlarmClock
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> clockUp:Sprite=<span style="color: #000000; font-weight: bold;">new</span> Sprite<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> clockRadio:RadioFace=<span style="color: #000000; font-weight: bold;">new</span> RadioFace<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> timeField:<span style="color: #0066CC;">TextField</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">TextField</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> timeFormat:<span style="color: #0066CC;">TextFormat</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">TextFormat</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> hr:<span style="color: #0066CC;">String</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> mn:<span style="color: #0066CC;">String</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> fullTime:<span style="color: #0066CC;">String</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> adjust:uint;
&nbsp;
		<span style="color: #0066CC;">public</span> override <span style="color: #000000; font-weight: bold;">function</span> curTime<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Sprite
		<span style="color: #66cc66;">&#123;</span>
			alarm=<span style="color: #000000; font-weight: bold;">new</span> RideAlarm<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			timeNow.<span style="color: #006600;">hours</span><span style="color: #66cc66;">&gt;</span><span style="color: #cc66cc;">12</span> ? adjust=timeNow.<span style="color: #006600;">hours</span>-<span style="color: #cc66cc;">12</span>:adjust=timeNow.<span style="color: #006600;">hours</span>;
			hr=<span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#40;</span>adjust<span style="color: #66cc66;">&#41;</span>;
			mn=<span style="color: #0066CC;">String</span><span style="color: #66cc66;">&#40;</span>timeNow.<span style="color: #006600;">minutes</span><span style="color: #66cc66;">&#41;</span>;
			mn.<span style="color: #0066CC;">length</span>==<span style="color: #cc66cc;">1</span> ? mn=<span style="color: #ff0000;">&quot;0&quot;</span>+ mn : mn=mn;
			fullTime=hr+<span style="color: #ff0000;">&quot;:&quot;</span>+mn;
			timeField.<span style="color: #0066CC;">autoSize</span>=TextFieldAutoSize.<span style="color: #0066CC;">RIGHT</span>;
			timeFormat.<span style="color: #0066CC;">font</span>=<span style="color: #ff0000;">&quot;OCR A Std&quot;</span>;
			timeFormat.<span style="color: #0066CC;">color</span>=0x00ff00;
			timeFormat.<span style="color: #0066CC;">size</span>=<span style="color: #cc66cc;">72</span>;
			timeField.<span style="color: #006600;">defaultTextFormat</span>=timeFormat;
			timeField.<span style="color: #0066CC;">text</span>=fullTime;
			timeField.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">95</span>,timeField.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">75</span>;
			clockUp.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>clockRadio<span style="color: #66cc66;">&#41;</span>;
			clockUp.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>timeField<span style="color: #66cc66;">&#41;</span>;
			<span style="color: #b1b100;">return</span> clockUp;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">public</span> override <span style="color: #000000; font-weight: bold;">function</span> doAlarm<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			alarm.<span style="color: #006600;">alarmPlay</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">public</span> override <span style="color: #000000; font-weight: bold;">function</span> offAlarm<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			alarm.<span style="color: #006600;">alarmOff</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>As you can see from the code, it&#8217;s very flexible but forms a strong orthogonal component. Changing an alarm requires only that the name of the MP3 file is changed. A quick cut-and-paste and you have another alarm sound or tune. Changing clocks requires a new clock face, but adding another can easily fit in with the other interacting participants in the pattern, and <em>that&#8217;s what is important</em>.</p>
<p><strong>Making Requests through the Client</strong></p>
<p>The Bridge includes the Client as an <em>implicit</em> class participant in the pattern. In this example, the Client is more like a sales associate who&#8217;s job it is to display the wares—the clocks and their alarms. Most of the code in the Client is creating the buttons and event handler methods. The methods include a good number conditional statements that check to see if the an extant instance of the clock. In testing, I found that the program would crash faster than a drunk driver if the current usage of an object were not first checked. In a non-demonstrative application, all the client would do would be to instantiated the selected clock and let it take care of the alarm event.</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p4947code12'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p494712"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
</pre></td><td class="code" id="p4947code12"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//Client</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Sprite</span>;
	<span style="color: #0066CC;">import</span> fl.<span style="color: #006600;">controls</span>.<span style="color: #0066CC;">Button</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">events</span>.<span style="color: #006600;">MouseEvent</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Client <span style="color: #0066CC;">extends</span> Sprite
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> aClock:IAlarmClock;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> selectBell:<span style="color: #0066CC;">Button</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Button</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> selectRadio:<span style="color: #0066CC;">Button</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Button</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> testAlarm:<span style="color: #0066CC;">Button</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Button</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> shutOff:<span style="color: #0066CC;">Button</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Button</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> clockNow:Sprite=<span style="color: #000000; font-weight: bold;">new</span> Sprite<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> btnWidth:uint=shutOff.<span style="color: #0066CC;">width</span>+<span style="color: #cc66cc;">10</span>;
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> Client<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			addChild<span style="color: #66cc66;">&#40;</span>clockNow<span style="color: #66cc66;">&#41;</span>;
			selectBell.<span style="color: #006600;">label</span>=<span style="color: #ff0000;">&quot;Analog Clock&quot;</span>;
			selectBell.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">250</span>,selectBell.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">10</span>;
			selectBell.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>MouseEvent.<span style="color: #006600;">CLICK</span>,getBell<span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span>selectBell<span style="color: #66cc66;">&#41;</span>;
&nbsp;
			selectRadio.<span style="color: #006600;">label</span>=<span style="color: #ff0000;">&quot;Radio Clock&quot;</span>;
			selectRadio.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">250</span>,selectRadio.<span style="color: #006600;">x</span>=btnWidth+<span style="color: #cc66cc;">10</span>;
			selectRadio.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>MouseEvent.<span style="color: #006600;">CLICK</span>,getRadio<span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span>selectRadio<span style="color: #66cc66;">&#41;</span>;
&nbsp;
			testAlarm.<span style="color: #006600;">label</span>=<span style="color: #ff0000;">&quot;Test Alarm&quot;</span>;
			testAlarm.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">250</span>,testAlarm.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">2</span><span style="color: #66cc66;">*</span>btnWidth+<span style="color: #cc66cc;">10</span>;
			testAlarm.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>MouseEvent.<span style="color: #006600;">CLICK</span>,alarmTest<span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span>testAlarm<span style="color: #66cc66;">&#41;</span>;
&nbsp;
			shutOff.<span style="color: #006600;">label</span>=<span style="color: #ff0000;">&quot;Turn Off Alarm!&quot;</span>;
			shutOff.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">250</span>,shutOff.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">3</span><span style="color: #66cc66;">*</span>btnWidth+<span style="color: #cc66cc;">10</span>;
			shutOff.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>MouseEvent.<span style="color: #006600;">CLICK</span>,offNow<span style="color: #66cc66;">&#41;</span>;
			addChild<span style="color: #66cc66;">&#40;</span>shutOff<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> getClock<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			removeChild<span style="color: #66cc66;">&#40;</span>clockNow<span style="color: #66cc66;">&#41;</span>;
			clockNow=aClock.<span style="color: #006600;">curTime</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			clockNow.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">20</span>,clockNow.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">10</span>;
			addChild<span style="color: #66cc66;">&#40;</span>clockNow<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> getRadio<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:MouseEvent<span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>aClock<span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				aClock.<span style="color: #006600;">offAlarm</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
			aClock=<span style="color: #000000; font-weight: bold;">new</span> RadioClock<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			getClock<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> getBell<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:MouseEvent<span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>aClock<span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				aClock.<span style="color: #006600;">offAlarm</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
			aClock=<span style="color: #000000; font-weight: bold;">new</span> BellClock<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			getClock<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> alarmTest<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:MouseEvent<span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>aClock<span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				aClock.<span style="color: #006600;">doAlarm</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> offNow<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:MouseEvent<span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>aClock<span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				aClock.<span style="color: #006600;">offAlarm</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>As noted, the clocks and their alarms are set up in what might be called &#8220;frozen&#8221; demo mode. In fact, the Client just uses an IAlarmClock implementation and its methods to select a clock and turn the alarm on and off.</p>
<p>We always welcome your comments, and we hope to hear from you about this pattern. Also, we&#8217;re really hoping that you send in some components that you have created that we can put into this app. In the next post, you&#8217;ll be treated to a discussion (rant?) about using parameters in applications like this one. (Duck!)</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2011%2F03%2Factionscript-3-0-saturated-bridge-design-pattern-2-bridge-clock-implementation%2F&amp;title=ActionScript%203.0%20Saturated%20Bridge%20Design%20Pattern%202%3A%20Bridge%20Clock%20Implementation" id="wpa2a_2"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2011/03/actionscript-3-0-saturated-bridge-design-pattern-2-bridge-clock-implementation/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ActionScript OOP and Design Patterns: Why Bother?</title>
		<link>http://www.as3dp.com/2011/01/actionscript-oop-and-design-patterns-why-bother/</link>
		<comments>http://www.as3dp.com/2011/01/actionscript-oop-and-design-patterns-why-bother/#comments</comments>
		<pubDate>Sun, 30 Jan 2011 15:54:25 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Class Relations]]></category>
		<category><![CDATA[Design Patterns]]></category>
		<category><![CDATA[frameworks]]></category>
		<category><![CDATA[Principles]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=4393</guid>
		<description><![CDATA[At a workshop not long ago I found myself saying, I&#8217;ve got nothing against 4th Graders. It was in relation to the MVC, which is the precursor to the Gang of Four&#8217;s catalog of patterns, but it&#8217;s appropriate in this discussion as well. Originally, I was asked what I had against MVC, and I said, [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.as3dp.com/wp-content/uploads/2011/01/evolution.png" alt="evolution" title="evolution" width="500" height="313" class="alignnone size-full wp-image-4396" /><br />
At a workshop not long ago I found myself saying,</p>
<blockquote><p>I&#8217;ve got nothing against 4th Graders.</p></blockquote>
<p>It was in relation to the MVC, which is the precursor to the Gang of Four&#8217;s catalog of patterns, but it&#8217;s appropriate in this discussion as well. Originally, I was asked what I had against MVC, and I said, <em>Nothing, and I&#8217;ve got nothing against 4th graders either</em>. The reference was to getting stuck in the MVC in a continuous loop—just like getting stuck in the 4th grade. The MVC is brilliant because it helped free programmers from monolithic conceptualizations in programming. However, it&#8217;s a starting point; not an ending point. The Pure MVC advocates certainly agree with that idea, and that&#8217;s fine, but pure or (impure?) MVC, it&#8217;s still an MVC. The GoF make the point that different patterns can be developed around what varies in an application, and the MVC is a way to deal with UIs and has much in common with the Observer pattern; which leaves some 20 other patterns that focus on different variations. (Later developments of the MVC have elevated it to an architecture.)</p>
<p>In my own case, I got stuck on the State pattern for about a year and decided that it was time to move on after realizing that other patterns would serve me better when something other than state varies. Redoing my Web site now, I wish I had used design patterns in more than the video player I made with a State pattern.</p>
<p><strong>Why OOP? What&#8217;s Wrong with Sequential Programming?</strong></p>
<p>First off, let&#8217;s get straight what we mean by sequential programming. In one context, it means <em>Not Parallel Programming or Not Concurrent Programming</em>. Just ask anyone at <strong>Intel</strong>. They think that everyone should learn concurrent programming based on the fact that their processors are all multi-core, and single core processors have gone the way of the Dodo bird. They&#8217;ve got a point. In looking at my collection of computers my old Win XT may be single core, but I&#8217;m not even sure that&#8217;s it&#8217;s not a dual core. My Macs and Win 7 (64-bit) systems are all dual or quad core. (See Joe Duffy&#8217;s book, <a href="http://xtragfx.com/ebooks/70606-concurrent-programming-on-windows.html">Concurrent Programming on Windows</a> for about 1,000 pages of info on this kind of programming.) Just to be straight about the point, that&#8217;s not the kind of sequential programming I&#8217;m talking about.</p>
<p>In this post, I&#8217;m referring to non-structured programming where you just write one line after another. When I used to write assembly language programs (especially using the assembler I wrote myself) everything was non-structured. Likewise, a lot of the Basic programming I wrote was sequential along with Fortran and non-Pascal stuff. If I had to put a date on it, I&#8217;d guess such programming is about 60-70 years old. It&#8217;s not old school; it&#8217;s just old.</p>
<p>What&#8217;s wrong with sequential programming? Is it slower? Does it not execute correctly? Are there algorithms I cannot write with it?</p>
<blockquote><p>No to all of the above.</p></blockquote>
<p> It&#8217;s main shortcomings center around the <em>spaghetti factor</em>. After not too many lines of code, it&#8217;s easy to get tangled up. If your programs are short, you&#8217;ve got little to worry about with good ole&#8217; sequential programming. Otherwise, sequential programming is difficult (near impossible) to maintain, change and keep straight.</p>
<p>However, you&#8217;d be amazed by the number of programming books that still present coding in nothing but sequential structure—which is non-structured. (In the past I&#8217;ve been guilty of the same thing; so I&#8217;ll be throwing no stones.) Some authors who have attempted to do otherwise have been snarled at&#8230;<em>What about the beginners? What about the non-developers?!</em> Grrrr! So it&#8217;s not just complacent code-writers who create programs in nothing but sequential structures; some authors do the same.</p>
<p>To be fair, a lot of the code in computer books is presented in <em>snippets</em>—little bits of sequential code to explain the syntax or to provide a working example. That&#8217;s fine and not what I&#8217;m talking about. In good books all of the bigger examples are in OOP or at least procedural programming. What I&#8217;m talking about are books where everything in the book is presented as sequential programming. One I have in mind showed a three-tiered <strong>if</strong> statement that was part of a bigger sequential monstrosity. How that mess helps beginners is beyond me. (By the way, the particular book I have in mind was published in 2009 by one of the most reputable computer book publishers in one of the most respected series.)</p>
<p>Oddly I found that by working with design patterns I end up doing simple sequential snippets—none of the messy spaghetti stuff. Read on to see why.</p>
<p><span id="more-4393"></span></p>
<p><strong>Procedural Programming to the Rescue!</strong></p>
<p>If I had to summarize procedural programming in one word, it would be <em><strong>functions</strong></em>. If I see the keyword &#8220;function&#8221; in a program, I can assume that the programmer is at least using procedural programming. The great thing about procedural programming is that you can re-use the same function all you want and it&#8217;s a whole lot easier to organize a task.</p>
<p>The problem that comes up in procedural programming centers around <em>scope</em>. Global variables can be used with many different procedures (functions), but they are more likely to creep in where they&#8217;re unwanted and screw up a program. Local variables are tethered to functions, and you may have occasion to use one of their values, but since they&#8217;re scoped to the function, they have a whole other set of issues. So while a huge improvement over sequential programming, programmers still had many challenges to face with procedural programming.</p>
<p><strong>OOP Emerges: Encapsulation</strong></p>
<p>Like Procedural Programming that can be summarized by the use of <strong>functions</strong>, Object Oriented Programming (OOP) can be summarized by <strong><em>encapsulation</em></strong>. To prevent the scoping problems and aid in debugging, the concept of the <em>object</em> emerged as a fully contained set of properties (something like variables) and methods (encapsulated functions). The objects were built in classes and a set of rules regulated communication between objects using accessors—private, protected and public. Classes represent abstractions of different entities that can be used to get something done in a program. The key to getting something done is through communication between the objects and implementing concrete instances of abstract classes. That&#8217;s an oversimplification, but clearly the focus shifts from sequences to communication.</p>
<p><strong>Design Patterns: Organized but Loose</strong></p>
<p>While OOP went a long way to create a programming model that could handle larger programs, some of the communication between objects resulted in a kind of binding that made re-use and change very difficult. In fact, some large and complex programs requiring even a little change had to be re-built from the ground up.</p>
<p>In 1979 the Model View Controller (MVC) offered a way to build interfaces for SmallTalk using the MVC triad of classes. It was key in de-coupling classes that had previously been grouped together.</p>
<p>In 1995,  Gamma, Helm, Johnson and Vlissides came out with a catalog of 23 design patterns organized around the purpose of the pattern (Creational, Structural and Behavioral) and the pattern scope (Class or Object). They offered six different criterion for selecting a pattern, key among them examining what you want to vary to avoid redesign and encapsulate what varies.</p>
<p>Professional programmers, in both industrial and higher educational settings, adopted or professed the use of design patterns. The purpose then as now is to aid in the development of software that is characterized by change and revision. In some respects they are OOP solutions to common programming structures. They are not templates as design templates in graphic design are. Rather they are broad yet precise ways to organize classes around  frameworks with a general and common programming goal.</p>
<p><strong>Do Design Patterns Add to or Reduce Complexity?</strong></p>
<p>For some, all that design patterns accomplish is to create a more complex system for both thinking about programming and creating a program. True, they do take some time to fully grasp, but so does programming. However, design patterns provide a fairly complete set of structures for dealing with programming problems. Further, once adopted, they save a great deal of time in re-structuring and making program changes.</p>
<p>Oddly, using design patterns, I find myself back writing simple sequential code. Consider the fact that classes should only take on a single responsibility and are organized around an abstract interface. I know the required signatures for the method, and I know the classes and their relationship to other classes. So what&#8217;s left for me to do? I just write snippets for the methods—little sequences of code that are fired when the method is called. Because objects are organized around a known communication system (a framework), I don&#8217;t have to worry about how they get along with the other objects. All of my requests are from a Client class, and the requests are nothing more than little sequences that instantiate a class and use the object&#8217;s methods and properties.</p>
<p>Now, I go back and look at the &#8220;easy&#8221; and &#8220;fun&#8221; book that has nothing but sequential programming (the word &#8220;function&#8221; is not even in the Index). I see a river of nested conditional statements in loops. That&#8217;s easy? Revision? Forget about it! I&#8217;m happy writing my little snippets inside well organized methods inside classes that I can easily re-use and revise.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2011%2F01%2Factionscript-oop-and-design-patterns-why-bother%2F&amp;title=ActionScript%20OOP%20and%20Design%20Patterns%3A%20Why%20Bother%3F" id="wpa2a_4"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2011/01/actionscript-oop-and-design-patterns-why-bother/feed/</wfw:commentRss>
		<slash:comments>21</slash:comments>
		</item>
		<item>
		<title>ActionScript 3.0 Interface: What are they good for?</title>
		<link>http://www.as3dp.com/2010/12/actionscript-3-0-interface-what-are-they-good-for/</link>
		<comments>http://www.as3dp.com/2010/12/actionscript-3-0-interface-what-are-they-good-for/#comments</comments>
		<pubDate>Sun, 05 Dec 2010 15:47:59 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Abstract Classes]]></category>
		<category><![CDATA[Class Relations]]></category>
		<category><![CDATA[Learning Design Patterns]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=4101</guid>
		<description><![CDATA[Let&#8217;s Be Humble Design Patterns were founded in the context of OOPSLA (Object-Oriented Programming, Systems, Languages &#038; Applications) gatherings sponsored by the ACM (Association for Computing Machinery) and attended by both academic and industry programmers. These are smart folks in the world of computing, but as I&#8217;ve mentioned on other occasions, they are far less [...]]]></description>
			<content:encoded><![CDATA[<p><div id="attachment_4086" class="wp-caption alignleft" style="width: 258px"><img src="http://www.as3dp.com/wp-content/uploads/2010/12/interface.png" alt="What good are interfaces?" title="interface" width="248" height="224" class="size-full wp-image-4086" /><p class="wp-caption-text">What good are interfaces?</p></div> <strong>Let&#8217;s Be Humble</strong></p>
<p>Design Patterns were founded in the context of OOPSLA (Object-Oriented Programming, Systems, Languages &#038; Applications) gatherings sponsored by the ACM (Association for Computing Machinery) and attended by both academic and industry programmers. These are smart folks in the world of computing, but as I&#8217;ve mentioned on other occasions, they are far less arrogant and more willing to listen to others—especially if those others listen to them in turn. Everyone assumes that everyone else is knowledgable and if they have a question, they get a straight answer&#8211;not a <em>I&#8217;m smarter than you</em> answer, but an-answer-to-the-question-asked kind of answer. I appreciate that because I&#8217;ve got a lot of questions.</p>
<p>At the last OOPSLA meeting (now called SPLASH), I got into an argument with a programmer and we both got our backs up. However, we both realized that the other was sincere, and we both shared the common goal of learning more about the topic; and the result was that she and I learned from one another. Mostly, I just ask straight questions and get straight answers—or give them. Sometimes mine or others answers may clash, but that&#8217;s what happens when you share ideas.</p>
<p>Now to the point. The other day I was snooping around the internet for a good distinction between abstract classes and interfaces and I came across a link to a blog that promised such a distinction. In discussing the distinction, the blog&#8217;s host first went on a long-winded detour to tell us how smart he was and how he used a &#8220;test question&#8221; to queries about programming. The &#8220;test question&#8221; was to distinguish between abstract classes and interfaces. His &#8220;answer&#8221; was hopelessly vague and muddled. What a jerk!</p>
<p>So, I am going to try and come up with a clear idea of what a class interface is and why we should care about it. I&#8217;ve included an interface example further on in the post, but you can download the files here:<br />
<a href="http://www.sandlight.com/interface/interface.zip" target="_blank" ><img src="http://www.as3dp.com/wp-content/uploads/2009/11/kilroy.png" alt="kilroy" title="kilroy" width="112" height="56" class="alignnone size-full wp-image-2020" /></a></p>
<p><strong>Straight Answer to &#8220;What is an Interface?&#8221;</strong></p>
<p>In our book on page 19, the section, <em>The many meanings of interface</em>, differentiates between user interfaces and object interfaces and notes that the ActionScript 3.0 keyword <strong>interface</strong> that is used to declare an interface structure is yet still another type of interface. Essentially, an interface is an abstract structure with a list of unimplemented methods whose signatures must be used in any implementation of the interface. <em>That&#8217;s about as clear as mud in terms of what an interface is used for</em>. It&#8217;s a straight enough answer, but clarifies nothing, nada, nichts, rien, niente.</p>
<p>In attempting to arrive at a good answer I looked at the Adobe documentation, and while I found nothing inaccurate and lots of examples I found nothing clarifying. So, I decided to back up and look at the <em>more general concept of interface</em>. One that we all seem to know and understand is that of a <em>user interface</em>. An interface that allows users to communicate with a computer program is a user interface. A simple example is a button. If I click a button, I can interact with the program—it is the interface. Click the button below to see what I mean:<br />
<a href="http://www.sandlight.com/interface/" ><img src="http://www.as3dp.com/wp-content/uploads/2010/12/interfaceBtn1.png" alt="interfaceBtn" title="interfaceBtn" width="200" height="58" class="alignnone size-full wp-image-4098" /></a></p>
<p>Essentially, you were able to &#8220;touch&#8221; the program to make it do something. Okay, so we know a user interface is between the user and the computer&#8217;s program. Likewise, a TV set is an interface between a user and television programming across the airwaves, via satellite or from cable.<br />
<span id="more-4101"></span><br />
With that in mind, an ActionScript 3.0 interface must be between <em>something</em> and <em>something</em>. Further, there must be a good reason for having such a relationship. So, with this in mind, I went back to the hunt. What I found was surprisingly simple and yet very clear.</p>
<p><strong>An Abstraction of Service</strong></p>
<p>About five years ago, O&#8217;Reilly published a book  entitled <em>Programming .NET Components</em> by Juval Lowy.  In it Lowy discusses, among other things, the purpose of using interfaces. He uses a model of what he calls <em>component-oriented programming</em> (COP), and while there may be some differences between OOP and COP, they share certain basic assumptions about loose coupling. He calls interfaces, an <em>abstraction of service</em>, in the sense that a service is part of your program that does something—usually found in the class methods. In a nicely worded summary, he notes,</p>
<blockquote><p>When you separate the interface from the implementation in your programming, your client is compatible with far more services.</p></blockquote>
<p>While not putting it in those words, Chandima and I have been making the same point both on this blog and in our book. Again and again we&#8217;ve discussed how a Client class is the one that makes requests. However, what does the Client make the request for? Why services, of course. Because the interface can only state the methods&#8217; signature (see page 19 of our book for a good diagram and explanation of a signature), it can be implemented in many different ways. Thus, a client can create an instance that will make requests through the interface that provides both variety and the ability for the programmer to make later changes without changing the Client.</p>
<p><strong>It&#8217;s All About Communication</strong></p>
<p>OOP is all about communication between objects. Just like the button is a human interface for communication between the user and the service (in the program), an interface is for communication between Client and Implementation or between Class and Class or Object and Object. The following example uses an interface through which the client requests services—one to make an ellipse and the other to make a triangle.(You can download them using the download button at the top of the post.) Click the (patent pending) Acme Interface Button again:<br />
<a href="http://www.sandlight.com/interface/InterfaceWork.html" target="_blank"><img src="http://www.as3dp.com/wp-content/uploads/2010/12/interfaceBtn1.png" alt="interfaceBtn" title="interfaceBtn" width="200" height="58" class="alignnone size-full wp-image-4098" /></a><br />
 To get started the Client class is the first in the listings here because it best illustrates how the Client requests the services through the interface, (<strong>IGraphic</strong>).</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p4101code15'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p410115"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
</pre></td><td class="code" id="p4101code15"><pre class="actionscript" style="font-family:monospace;">package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Sprite</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Shape</span>;
	<span style="color: #0066CC;">import</span> fl.<span style="color: #006600;">controls</span>.<span style="color: #0066CC;">Button</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">events</span>.<span style="color: #006600;">MouseEvent</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> GraphicClient <span style="color: #0066CC;">extends</span> Sprite
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> requesterE:IGraphic=<span style="color: #000000; font-weight: bold;">new</span> EllipseGraphic<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> requesterT:IGraphic=<span style="color: #000000; font-weight: bold;">new</span> TriangleGraphic<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> triBtn:<span style="color: #0066CC;">Button</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Button</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> ellipseBtn:<span style="color: #0066CC;">Button</span>=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Button</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> holder:Sprite=<span style="color: #000000; font-weight: bold;">new</span> Sprite<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> flexShape:Shape=<span style="color: #000000; font-weight: bold;">new</span> Shape<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> GraphicClient<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			setButtons<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			holder.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">0</span>,holder.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">55</span>;
			addChild<span style="color: #66cc66;">&#40;</span>holder<span style="color: #66cc66;">&#41;</span>;
			holder.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>flexShape<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> triService<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:MouseEvent<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			holder.<span style="color: #006600;">removeChild</span><span style="color: #66cc66;">&#40;</span>flexShape<span style="color: #66cc66;">&#41;</span>;
			flexShape=requesterT.<span style="color: #006600;">doDraw</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			holder.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>flexShape<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> ellipseService<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:MouseEvent<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			holder.<span style="color: #006600;">removeChild</span><span style="color: #66cc66;">&#40;</span>flexShape<span style="color: #66cc66;">&#41;</span>;
			flexShape=requesterE.<span style="color: #006600;">doDraw</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			holder.<span style="color: #006600;">addChild</span><span style="color: #66cc66;">&#40;</span>flexShape<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> setButtons<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			triBtn.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">100</span>,triBtn.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">100</span>;
			triBtn.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>MouseEvent.<span style="color: #006600;">CLICK</span>, triService<span style="color: #66cc66;">&#41;</span>;
			triBtn.<span style="color: #006600;">label</span>=<span style="color: #ff0000;">&quot;Request Triangle&quot;</span>;
			addChild<span style="color: #66cc66;">&#40;</span>triBtn<span style="color: #66cc66;">&#41;</span>;
&nbsp;
			ellipseBtn.<span style="color: #006600;">x</span>=<span style="color: #cc66cc;">100</span>,ellipseBtn.<span style="color: #006600;">y</span>=<span style="color: #cc66cc;">130</span>;
			ellipseBtn.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>MouseEvent.<span style="color: #006600;">CLICK</span>, ellipseService<span style="color: #66cc66;">&#41;</span>;
			ellipseBtn.<span style="color: #006600;">label</span>=<span style="color: #ff0000;">&quot;Request Ellipse&quot;</span>;
			addChild<span style="color: #66cc66;">&#40;</span>ellipseBtn<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>Originally, I used a single request instance typed to the IGraphic interface, but  each time it was called I had to instantiate a new concrete triangle or ellipse class. That was done to illustrate the flexibility of programming to the interface. However, even an illustration isn&#8217;t worth the bad practice of continually using the <strong>new</strong> statement each time one of the button clicks requests a triangle or ellipse. So, I created two IGraphic types, one for a triangle request and the other for an ellipse request. In this way only a single new statement was used for each object and the new statement is required only once for each object no matter how many times it is used.</p>
<p>The rest of the program is pretty simple. Two classes implement the IGraphic interface and provide public access to call the <strong>doDraw()</strong> method.</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p4101code16'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p410116"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
</pre></td><td class="code" id="p4101code16"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//Interface</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Shape</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #0066CC;">interface</span> IGraphic
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #000000; font-weight: bold;">function</span> doDraw<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Shape;
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">//Triangle</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Shape</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> TriangleGraphic <span style="color: #0066CC;">implements</span> IGraphic
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> standardTriangle=<span style="color: #000000; font-weight: bold;">new</span> Shape<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> doDraw<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Shape
		<span style="color: #66cc66;">&#123;</span>
			standardTriangle.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">beginFill</span><span style="color: #66cc66;">&#40;</span>0xcc0000<span style="color: #66cc66;">&#41;</span>;
			standardTriangle.<span style="color: #006600;">graphics</span>.<span style="color: #006600;">drawTriangles</span><span style="color: #66cc66;">&#40;</span>Vector.<span style="color: #66cc66;">&lt;</span>number<span style="color: #66cc66;">&gt;</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#91;</span> <span style="color: #cc66cc;">100</span>,<span style="color: #cc66cc;">100</span>,  <span style="color: #cc66cc;">200</span>,<span style="color: #cc66cc;">200</span>,  <span style="color: #cc66cc;">100</span>,<span style="color: #cc66cc;">200</span><span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span>;
			standardTriangle.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">endFill</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #b1b100;">return</span> standardTriangle;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">//Ellipse</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Shape</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> EllipseGraphic <span style="color: #0066CC;">implements</span> IGraphic
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> standardEllipse=<span style="color: #000000; font-weight: bold;">new</span> Shape<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> doDraw<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Shape
		<span style="color: #66cc66;">&#123;</span>
			standardEllipse.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">beginFill</span><span style="color: #66cc66;">&#40;</span>0x00cc00<span style="color: #66cc66;">&#41;</span>;
			standardEllipse.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">lineStyle</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">3</span>,0x0000cc<span style="color: #66cc66;">&#41;</span>;
			standardEllipse.<span style="color: #006600;">graphics</span>.<span style="color: #006600;">drawEllipse</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">100</span>, <span style="color: #cc66cc;">100</span>, <span style="color: #cc66cc;">100</span>, <span style="color: #cc66cc;">100</span><span style="color: #66cc66;">&#41;</span>;
			standardEllipse.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">endFill</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #b1b100;">return</span> standardEllipse;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>The purpose of this example is to show how the interface provides a simple and clear gateway for the client to access services. As the program grows and changes, it is also quite simple to update other services through the same interface.</p>
<p><strong>OOP Interfaces</strong></p>
<p>One of the ironies I discovered in creating this example was found in the Gang of Four&#8217;s discussion of an Object interface (not a framework or program interface). An object&#8217;s interface is the <em>set of all signatures defined by an object&#8217;s operations</em>. They note,</p>
<blockquote><p>An object&#8217;s interface characterizes the complete set of requests that can be sent to the object. Any request that matches a signature in the object&#8217;s interface may be sent to the object. pg. 13</p></blockquote>
<p>Where a program&#8217;s interface (such as the IGraphic one used in the example) is interacting and communicating with objects whose own interfaces are synched, you can imagine both a well-oiled machine through which the different parts communicate as well as one where change and additions can be added seamlessly. So the question may not be, <em>What are interfaces good for?</em>, but instead, <em>How&#8217;d I get along with out them for so long?</em></p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2010%2F12%2Factionscript-3-0-interface-what-are-they-good-for%2F&amp;title=ActionScript%203.0%20Interface%3A%20What%20are%20they%20good%20for%3F" id="wpa2a_6"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2010/12/actionscript-3-0-interface-what-are-they-good-for/feed/</wfw:commentRss>
		<slash:comments>18</slash:comments>
		</item>
		<item>
		<title>Constructor Functions as Cluster Bombs</title>
		<link>http://www.as3dp.com/2010/09/constructor-functions-as-cluster-bombs/</link>
		<comments>http://www.as3dp.com/2010/09/constructor-functions-as-cluster-bombs/#comments</comments>
		<pubDate>Tue, 21 Sep 2010 15:28:36 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Class Relations]]></category>
		<category><![CDATA[Re-Thinking Conventions]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=3581</guid>
		<description><![CDATA[Every now and again I re-visit issues in the same way one might refresh a Web page. At the beginning of the year I had a post on Constructor Functions based on Miško Hevery&#8217;s article that explained why constructor functions should do no real work. Since that time, I&#8217;ve been consciously working to keep constructor [...]]]></description>
			<content:encoded><![CDATA[<p><div id="attachment_3580" class="wp-caption alignleft" style="width: 260px"><img src="http://www.as3dp.com/wp-content/uploads/2010/09/clusterBomb.png" alt="Constructor Function Attacks Design Pattern" title="clusterBomb" width="250" height="158" class="size-full wp-image-3580" /><p class="wp-caption-text">Constructor Function Attacks Design Pattern</p></div> Every now and again I re-visit issues in the same way one might refresh a Web page. At the beginning of the year I had a post on <a href="http://www.as3dp.com/2010/01/06/class-constructor-function-should-do-no-real-work-getting-agile-part-i/">Constructor Functions</a> based on Miško Hevery&#8217;s article that explained why constructor functions should do no real work. Since that time, I&#8217;ve been consciously working to keep constructor functions out of every class in a design pattern except the Client. However, in some PHP design patterns, I started removing them from the client as well. In Flash, you need some kind of self-starting class in the FLA to fire up the pattern in use, but in PHP, I found that I could instantiate the client using a little chunk of code and then use the methods I wanted to request just what I wanted. However, I&#8217;ll probably keep the constructor function in my Client class because if nothing else it can set up the UI. Then the methods (not in the constructor function) can be called as needed from the UI.<br />
<span id="more-3581"></span><br />
<strong>Why a Cluster Bomb?</strong></p>
<p>Obviously you don&#8217;t ever remove a constructor function from a class—one will be generated automatically if none is there. Instead, if you do not include one, you&#8217;re not tempted to add properties and methods in the constructor that might generate dependencies that you don&#8217;t want. Your client isn&#8217;t a problem because it&#8217;s just making requests and none of the other classes instantiate your client. However, every participant in a design pattern that has a constructor function is liable to generate unwanted dependencies because it automatically passes everything in the constructor function to the instance. That&#8217;s why it&#8217;s like a cluster bomb—everything is liable to be a target not distinguishing friend from foe—the foe being unwanted dependencies that jam up your program when you make revisions. This includes &#8220;parameterized&#8221; classes. Instead of passing a parameter to the class, it&#8217;s less binding to pass it just to the method that uses it. If everything in a class is needed immediately by the constructed instance, it&#8217;s not exactly difficult to first instantiate an instance and then call a method through the instance that fires off the whole crew.</p>
<p>As far as rants go, this one is pretty mild. So try programming your classes without a class constructor and see if it isn&#8217;t easier to both debug and update. I&#8217;ll be sure to do the same in future design patterns I post here.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2010%2F09%2Fconstructor-functions-as-cluster-bombs%2F&amp;title=Constructor%20Functions%20as%20Cluster%20Bombs" id="wpa2a_8"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2010/09/constructor-functions-as-cluster-bombs/feed/</wfw:commentRss>
		<slash:comments>19</slash:comments>
		</item>
		<item>
		<title>ActionsScript 3.0 Design Pattern Relations Part IV: Creation</title>
		<link>http://www.as3dp.com/2010/02/actionsscript-3-0-design-pattern-relations-part-iv-creation/</link>
		<comments>http://www.as3dp.com/2010/02/actionsscript-3-0-design-pattern-relations-part-iv-creation/#comments</comments>
		<pubDate>Fri, 19 Feb 2010 02:26:33 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Class Relations]]></category>
		<category><![CDATA[Creates]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=2685</guid>
		<description><![CDATA[One of the least discussed relations in Design Patterns is where one participant creates an instance of another. Basically, the pattern calls for one class to instantiate another class. This relationship is indicated by a broken line with an arrowhead pointing to the class that has been instantiated. (The Participant Relations diagram above shows Class [...]]]></description>
			<content:encoded><![CDATA[<p><div id="attachment_2788" class="wp-caption alignnone" style="width: 411px"><img src="http://www.as3dp.com/wp-content/uploads/2010/02/dpUMLcreatesRev.png" alt="Creates Relationship" title="dpUMLcreatesRev" width="401" height="398" class="size-full wp-image-2788" /><p class="wp-caption-text">Creates Relationship</p></div>One of the least discussed  relations in Design Patterns is where one participant <strong>creates</strong> an instance of another. Basically, the pattern calls for one class to instantiate another class. This relationship is indicated by a <strong>broken line with an arrowhead</strong> pointing to the class that has been instantiated. (The Participant Relations diagram above shows <strong>Class C </strong>instantiating (creates) <strong>Class F</strong> with the red broken line and arrow.) The <em>creates relationship</em> is found in only five design patterns:</p>
<ul>
<li><a href="http://www.as3dp.com/category/design-patterns/abstract-factory-pattern/">Abstract Factory</a></li>
<li><a href="http://www.as3dp.com/category/design-patterns/builder/">Builder</a></li>
<li><a href="http://www.as3dp.com/category/design-patterns/factory-method/">Factory Method</a></li>
<li><a href="http://cdn.oreilly.com/digitalmedia/9780596528461/ActionScript3DesignPattern_ch07.pdf">Command</a></li>
<li><a href="http://www.as3dp.com/category/design-patterns/factory-method/">Memento</a></li>
</ul>
<p>This post examines how design patterns incorporating a <em>creates relationship</em> uses that relationship to make a loosely structured design to complete one or more kinds of tasks.<br />
<span id="more-2685"></span><br />
<strong>Uses of Creates</strong></p>
<p>In virtually any OOP programming, some sort of <em>creates relationship</em> exists; sometimes no more than a Client instantiating an instance of a class. However, when dealing with design patterns, we are looking for a specific purpose in terms of the overall design for the use of a creates relationship. For example, in the Memento pattern, the Originator instantiates a Memento object with the following code:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p2685code18'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p268518"><td class="line_numbers"><pre>1
2
3
4
5
</pre></td><td class="code" id="p2685code18"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> createMemento <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:Memento
<span style="color: #66cc66;">&#123;</span>
       <span style="color: #0066CC;">trace</span> <span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;Creating memento with current state&quot;</span><span style="color: #66cc66;">&#41;</span>;
       <span style="color: #b1b100;">return</span> <span style="color: #000000; font-weight: bold;">new</span> Memento<span style="color: #66cc66;">&#40;</span>mstate<span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>In the Memento pattern, the Memento class has an aggregate relationship with the Caretaker participant which stores the current state in an array (in our example.) In looking closely at the relationship between the Originator and the Memento, when the Originator instantiates an instance of the Memento, it is really acting as a setter—it sets a specified state as the memento, which in turn is stored by the Caretaker when called upon. Effectively, the process decouples the Originator from the Caretaker.</p>
<p><strong>Factory Work</strong></p>
<p>In thinking of the <em>create relationship</em>, one of the Factory designs most likely comes to mind. Not surprisingly, both the Abstract Factory and Factory Method include a create relationship. The Concrete Creator class has a create relationship with the Product class. The whole concept of a <em><strong>factory</strong></em> is one where something is created, and that&#8217;s exactly where we&#8217;d expect to find a create relationship.</p>
<p>One apparent exception is the Flyweight Design Pattern. No create relationship is seen in the Class Diagram, but in looking at the Factory participant in the design, you will find that elements in an associative array are made up of instantiated ConcreteFlyweight instances. (Associative arrays in ActionScript 3.0 are created as Objects and the elements are the Object properties.) The more complex multiple aggregation masks the create relationship.</p>
<p><strong>The Uses-A Relationship</strong></p>
<p>Of all of the ways to describe what happens with the dashed line and arrow, I prefer the <strong>uses-a</strong> description. This is consistent with <strong>has-a</strong> (composition) and <strong>is-a</strong> (inheritance) relationships. It&#8217;s easy to say that <em>Participant A <strong>uses a</strong> Participant B object through instantiation</em>. GoF simply call it the <em>creates relationship</em> (p. 364), and let it go at that. Scott Myers in his book <em>Effective C++</em> uses the term <strong>is-implemented-in-terms-of</strong> to reference such a relationship. Myers points out, <em>IS-IMPLEMENTED-IN-TERMS-OF is a relationship between classes that exists in the implementation domain</em>. The <strong>implementation domain</strong> is contrasted with the<strong> application domain</strong> where you have has-a relationships (composition.)</p>
<p>In any event, this concludes our series on relationships between design pattern participants. We hope it helps you better understand what all of the symbols mean, and while the lines of demarcation between types of relationships may become blurred, at least you have the basics so that you can better understand a design pattern&#8217;s class diagram and what&#8217;s going on in a pattern. Start looking at your own code in terms of these relationships, and <em>Who knows?</em>, maybe you&#8217;ll discover you&#8217;ve been using one that you didn&#8217;t realize before.</p>
<p>Your valuable comments are welcomed as always, along with questions, insights and examples.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2010%2F02%2Factionsscript-3-0-design-pattern-relations-part-iv-creation%2F&amp;title=ActionsScript%203.0%20Design%20Pattern%20Relations%20Part%20IV%3A%20Creation" id="wpa2a_10"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2010/02/actionsscript-3-0-design-pattern-relations-part-iv-creation/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>ActionsScript 3.0 Design Pattern Relations Part III: Inheritance</title>
		<link>http://www.as3dp.com/2010/02/actionsscript-3-0-design-pattern-relations-part-iii-inheritance/</link>
		<comments>http://www.as3dp.com/2010/02/actionsscript-3-0-design-pattern-relations-part-iii-inheritance/#comments</comments>
		<pubDate>Tue, 09 Feb 2010 14:33:57 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Inheritance]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=2582</guid>
		<description><![CDATA[An open triangle on a line from a child class to the parent class indicates the inheritance symbol in Design Pattern class diagrams. In the Participant Relations diagram above, you can see symbols for both single and multiple inheritance in red. Inheritance in design patterns is so common, pointing out which designs do not use [...]]]></description>
			<content:encoded><![CDATA[<p><div id="attachment_2586" class="wp-caption alignnone" style="width: 411px"><img src="http://www.as3dp.com/wp-content/uploads/2010/02/dpUMLinher.png" alt="Inheritance Relations" title="dpUMLinher" width="401" height="398" class="size-full wp-image-2586" /><p class="wp-caption-text">Inheritance Relations</p></div>An open triangle on a line from a child class to the parent class indicates the <strong>inheritance</strong> symbol in Design Pattern class diagrams. In the Participant Relations diagram above, you can see symbols for both single and multiple inheritance in red. Inheritance in design patterns is so common, pointing out which designs <em>do not</em> use inheritance is easier than listing all of the ones that do. Those pattens that have <em>no inheritance</em> in their design include:</p>
<ul>
<li><a href="http://www.as3dp.com/category/design-patterns/singleton/">Singleton</a></li>
<li><a href="http://www.as3dp.com/2008/09/20/actionscript-facade-design-pattern-the-cat-herder/">Facade</a></li>
<li><a href="http://www.as3dp.com/2008/01/24/actionscript-30-memento-design-pattern-encapsulating-saved-states/">Memento</a></li>
</ul>
<p>So when thinking about inheritance, you can begin by thinking <em>design patterns</em> because most include some kind of inheritance in the relations between pattern participants.</p>
<p><strong>But I thought they said&#8230;</strong></p>
<p>You&#8217;re probably thinking that a key principle for design patterns is to <a href="http://www.as3dp.com/2009/02/21/design-pattern-principles-for-actionscript-30-favor-object-composition-over-class-inheritance/">favor object composition over  class inheritance</a>, and here we find that the Gang of Four is using inheritance in all but three of their design patterns. <em>What&#8217;s up with that?</em></p>
<p><span id="more-2582"></span></p>
<p>With a single exception, all of the inheritance in the design patterns is from an abstract class or interface. The exception can be found in the Adapter pattern, where the Adapter participant inherits from both an abstract participant (<strong><em>Target</em></strong>)  and a concrete one (<strong>Adaptee</strong>). What an inheriting class is getting, then, is an <em>interface</em>, whether in the form of an implemented interface participant or extended from an abstract class participant.</p>
<p>The <em>first</em> principle of Design Patterns is</p>
<blockquote><p>Program to an interface, not an implementation.</p></blockquote>
<p>Following that first dictum is the one to <em>favor object composition over class inheritance</em>. However, to program to an interface, you need an interface or abstract class. Therefore, even though composition is favored over class inheritance, the patterns are set up with composition through an interface—which is perfectly clear in the vast majority of the design patterns. The following statement by Gamma, Helm, Johnson, and Vlissdes now makes perfect sense:</p>
<blockquote><p>Reuse by inheritance makes it easier to make new components that can be composed with old ones. Inheritance and object composition thus work together.</p></blockquote>
<p>The concrete classes that can be composed are done so through their interface. That&#8217;s why the diagrams show the composition arrows aiming at the interfaces and not the concrete classes. However, though those interfaces the requests can be handled by the concrete classes, but addressing them through the interfaces keeps the relations looser. Then, when change occurs, the change does not lock up and crash the program because the program is tied into concrete implementations.</p>
<p><strong>All those Concrete Classes can be Composed</strong></p>
<p>If we think of the concrete classes (child classes) that implement an interface or abstract class as<em> to be composed</em> we can better see the relationship between inheritance and composition. Because several concrete classes may share the same or similar interface it makes far more sense to create them through an interface than using identical interfaces with several separate classes. In this way,<em> you can begin to understand the child classes as building blocks for composition</em> and not some unrelated classes that happen to be handy for composition. Were the latter the case, it would not be important to program to an interface rather than an implementation.</p>
<p><strong>Inheritance and Composition Getting Along Fine</strong></p>
<p>To see a simple yet effective example of both inheritance and composition working together, take a look at the <a href="http://www.as3dp.com/2009/03/08/actionscript-30-easy-and-practical-strategy-design-pattern/">Strategy pattern</a>. In that pattern, the Context class forwards requests from the Client to the Strategy interface. The Context class does not request anything concrete. Rather, it simply requests something from the Strategy participant, the specifics of which are provided by the Client&#8217;s request in the form of a parameter. In this particular example, it wants something to load graphics. Suppose, you change it so that you want it to load text as well. No need to change the Context because it is making  request through the Strategy interface (an abstract class). By subclassing the abstract Strategy class (<strong>ILoadMaster</strong> in the example), you can add a different implementation to load text. Then, compose a different request in the Client, and <em>viola!</em>, you can now load text without the whole thing crashing around your shoulders or having to do a lot more work.</p>
<p><strong>Overuse of Inheritance is the Problem</strong></p>
<p>The only real problem that the Gang of Four have with inheritance is its overuse. As you can see composition works in conjunction with inheritance in all but three design patterns. So don&#8217;t get the wrong idea about design patterns and inheritance—<em>there&#8217;s nothing anti-inheritance about them</em>. The problem lies where inheritance is used to the point where a program is locked into concrete implementations without programming through the interface. In fact, <em>an interface implies some kind of inheritance</em>. By working with composition and inheritance together, you can have the advantages of reuse through inheritance and new objects composed of concrete objects. Truly this is the best of both worlds.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2010%2F02%2Factionsscript-3-0-design-pattern-relations-part-iii-inheritance%2F&amp;title=ActionsScript%203.0%20Design%20Pattern%20Relations%20Part%20III%3A%20Inheritance" id="wpa2a_12"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2010/02/actionsscript-3-0-design-pattern-relations-part-iii-inheritance/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ActionsScript 3.0 Design Pattern Relations Part II: Aggregation</title>
		<link>http://www.as3dp.com/2010/01/actionsscript-3-0-design-pattern-relations-part-ii-aggregation/</link>
		<comments>http://www.as3dp.com/2010/01/actionsscript-3-0-design-pattern-relations-part-ii-aggregation/#comments</comments>
		<pubDate>Tue, 26 Jan 2010 20:58:39 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Aggregation]]></category>
		<category><![CDATA[Class Relations]]></category>
		<category><![CDATA[Delegation]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=2476</guid>
		<description><![CDATA[I&#8217;m tempted to say that aggregation is a stronger form of acquaintance, and that wouldn&#8217;t be far from wrong. In fact, in certain contexts it may be perfectly correct. Gamma, et al point out that the differences between the two is a matter of intent rather than explicit language mechanisms. That makes it a little [...]]]></description>
			<content:encoded><![CDATA[<p><div id="attachment_2683" class="wp-caption alignnone" style="width: 411px"><img src="http://www.as3dp.com/wp-content/uploads/2010/01/dpUMLagg2.png" alt="Aggregate Relations" title="dpUMLagg2" width="401" height="398" class="size-full wp-image-2683" /><p class="wp-caption-text">Aggregate Relations</p></div><br />
I&#8217;m tempted to say that <strong>aggregation</strong> is a stronger form of <strong>acquaintance</strong>, and that wouldn&#8217;t be far from wrong. In fact, in certain contexts it may be perfectly correct. Gamma, <em>et al </em>point out that the differences between the two  <em>is a matter of intent rather than explicit language mechanisms</em>. That makes it a little tricky simply to show some code and pronounce,<em> &#8220;See that&#8217;s what an aggregate looks like.&#8221;</em> So bear with me as we look at aggregate relations.</p>
<p><strong>Conjoined Participants</strong></p>
<p>As can be seen in the red arrow symbols in the Participant Relations diagram at the top of this post, an aggregate relation is indicated by an arrow with a diamond at its base. The GoF illustrate the relationship as shown in Figure 1:<br />
<div id="attachment_2486" class="wp-caption alignnone" style="width: 449px"><img src="http://www.as3dp.com/wp-content/uploads/2010/01/aggregation.png" alt="&lt;em&gt;&lt;strong&gt;Figure 1: &lt;/strong&gt;Aggregator and Aggregatee&lt;/em&gt;" title="aggregation" width="439" height="61" class="size-full wp-image-2486" /><p class="wp-caption-text"><em><strong>Figure 1: </strong>Aggregator and Aggregatee</em></p></div></p>
<p>The Aggregator creates an aggregate instance of the Aggregatee. As noted, GoF point out that no single code set can demonstrate what an aggregate relationship looks like, but I think that we can get a start by looking at a fairly simple relationship in the <a href="http://www.as3dp.com/2010/01/18/actionscript-3-0-state-design-pattern-an-aid-game/">State design</a> I created so that we could discuss both aggregate relations and delegation. (The <a href="http://www.as3dp.com/2009/03/08/actionscript-30-easy-and-practical-strategy-design-pattern/">Strategy design</a> also provides a good example of aggregation with delegation.)<br />
<span id="more-2476"></span><br />
In looking at the aggregate relations between the Context class and State interface in the  <a href="http://www.as3dp.com/2010/01/18/actionscript-3-0-state-design-pattern-an-aid-game/">State example<a/>,  we see the following aggregation:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p2476code20'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p247620"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
</pre></td><td class="code" id="p2476code20"><pre class="actionscript" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">class</span> Context
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> stoph:State;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> moveup:State;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> movedown:State;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> moveleft:State;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> moveright:State;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> stateNow:State;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">var</span> chopper:Sprite;
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> Context<span style="color: #66cc66;">&#40;</span> chopper:Sprite <span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">this</span>.<span style="color: #006600;">chopper</span>=chopper;
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;State is here&quot;</span><span style="color: #66cc66;">&#41;</span>;
			moveup=<span style="color: #000000; font-weight: bold;">new</span> MoveUp<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#41;</span>;
			stoph=<span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Stop</span><span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#41;</span>;
			movedown=<span style="color: #000000; font-weight: bold;">new</span> MoveDown<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#41;</span>;
			moveleft=<span style="color: #000000; font-weight: bold;">new</span> MoveLeft<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#41;</span>;
			moveright=<span style="color: #000000; font-weight: bold;">new</span> MoveRight<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#41;</span>;
			stateNow=stoph;
		<span style="color: #66cc66;">&#125;</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> upMove<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			stateNow.<span style="color: #006600;">doMoveUp</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
...<span style="color: #0066CC;">end</span> snippet</pre></td></tr></table></div>

<p>So what&#8217;s getting aggregated? In this instance the entire State interface and all of its implementations (classes) and methods are aggregated in the Context class. All of the requests coming from the Client are delegated to the State through such aggregation.</p>
<p>At this point you may better understand GoF&#8217;s statement,</p>
<blockquote><p>Aggregation implies that an aggregate object and its owner have identical lifetimes.</p></blockquote>
<p>The aggregate object is that created in the Context and the owner is the State interface and implementations. The Context creates the aggregate object by gathering up all of the concrete states. When the Client makes a request, it uses an instance of the Context:</p>
<p> <strong><code>private var contextNow:Context=new Context(chopper);</code></strong></p>
<p>The instance, <strong><code>contextNow</code></strong>, essentially is the aggregate object. If you change the State implementations, it doesn&#8217;t matter because the Client makes the requests through the Context that creates an aggregate instance. That means if you change the implementations of the concrete States, everything still works because the requests are all through the Context class. As long as an aggregate relationship exists between participants in a design pattern, the aggregator creates an aggregate instance. With requests made through the aggregator, you decouple the request and the objects that carry out the requests. Further, through aggregation you can reuse objects all you want arranged in the way you want to employ them.</p>
<p><strong>Closely Related Participants</strong></p>
<p>You will find aggregate relationships in several design patterns, and the actual ActionScript 3.0 encoded aggregation has many faces. In coming to understand aggregation, take a look at several of the following classes that contain aggregation relationships.</p>
<ul>
<li><a href="http://www.as3dp.com/2009/03/17/actionscript-30-builder-design-pattern-part-i-controlling-creation/">Builder</a></li>
<li><a href="http://www.as3dp.com/2008/08/22/an-actionscript-bridge-design-pattern-flexibility-making-backdrops/">Bridge</a></li>
<li><a href="http://www.as3dp.com/2007/05/26/composite-pattern-book-part-1/">Composite</a></li>
<li><a href="http://www.as3dp.com/2009/04/26/actionscript-30-easy-and-practical-decorator-design-pattern/">Decorator</a></li>
<li><a href="http://www.as3dp.com/2007/09/18/the-actionscript-30-flyweight-saga-part-iii-aggregation-aggravation-stuff-on-the-stage-and-the-intrinsic-state/">Flyweight</a></li>
<li><a href="http://cdn.oreilly.com/digitalmedia/9780596528461/ActionScript3DesignPattern_ch07.pdf">Command</a></li>
<li><a href="http://www.as3dp.com/2008/12/14/actionscript-30-interpreter-design-pattern-a-postscript-tutor/">Interpreter</a></li>
<li><a href="http://www.as3dp.com/2008/01/27/actionscript-30-memento-design-pattern-flash-media-server-3-application/">Memento</a></li>
<li><a href="http://www.as3dp.com/2010/01/18/actionscript-3-0-state-design-pattern-an-aid-game/">State</a></li>
<li><a href="http://www.as3dp.com/2009/08/19/wrong-way-warrior-getting-flexibility-with-design-patterns—part-ii/">Strategy</a></li>
</ul>
<p>One of the more interesting uses of aggregation is where the child classes aggregate the parent class or interface. You can see this in the Composite and Decorator patterns. Likewise, you will see many different ways that the aggregation process is designed to structure the relationships between design pattern participants. By looking at the code in different examples aggregation you will begin to see what aggregation means.</p>
<p><strong>Aggregation for Change</strong></p>
<p>After posting the State example with the <strong>Helicopter</strong> (extension of Sprite class) jumping around the screen, we received several comments on improving the design. By having a State design pattern in place, that should not be too difficult to change the states for the Helicopter. The structure can remain the same, but not only could we substitute just about any sprite for the Helicopter, we could change the algorithms using the current interfaces without touching the fundamental design pattern. So in the next post, we&#8217;ll look at the Helicopter movement with an eye to making it more state-like while maintaining the current structure, even adding helper classes if we want. As always, we value your comments.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2010%2F01%2Factionsscript-3-0-design-pattern-relations-part-ii-aggregation%2F&amp;title=ActionsScript%203.0%20Design%20Pattern%20Relations%20Part%20II%3A%20Aggregation" id="wpa2a_14"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2010/01/actionsscript-3-0-design-pattern-relations-part-ii-aggregation/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>ActionsScript 3.0 Design Pattern Relations Part I: Acquaintances</title>
		<link>http://www.as3dp.com/2010/01/actionsscript-3-0-design-pattern-relations-part-i-acquaintances/</link>
		<comments>http://www.as3dp.com/2010/01/actionsscript-3-0-design-pattern-relations-part-i-acquaintances/#comments</comments>
		<pubDate>Sat, 16 Jan 2010 15:58:45 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Acquaintance]]></category>
		<category><![CDATA[Association]]></category>
		<category><![CDATA[Class Relations]]></category>
		<category><![CDATA[Delegation]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=2374</guid>
		<description><![CDATA[This post is the first in a series where I hope to discuss all of the key relationships between classes in Design Patterns. To help identify posts in this series I&#8217;ve created a general diagram with all of the different kinds of relationships between classes. I did not include the boxes for pseudo-code or divide [...]]]></description>
			<content:encoded><![CDATA[<p><div id="attachment_2377" class="wp-caption none" style="width: 411px"><img src="http://www.as3dp.com/wp-content/uploads/2010/01/dpUML.png" alt="Class Relations" title="dpUML" width="401" height="398" class="size-full wp-image-2377" /><p class="wp-caption-text">Class Relations</p></div>This post is the first in a series where I hope to discuss all of the key relationships between classes in Design Patterns. To help identify posts in this series I&#8217;ve created a general diagram with all of the different kinds of relationships between classes. I did not include the boxes for pseudo-code or divide the classes into areas for operations and properties. The purpose is to focus on the relationships in this series. You may have noticed that the chart is titled, <strong>Participant Relations</strong>, and by <em>Participant</em>, I&#8217;m referring to any class or interface in a design pattern using the Gang of Four&#8217;s terminology. In order to help you quickly see the current relationship topic, the Participant Relations diagram shows the currently discussed relations in red.</p>
<p><strong>UML Controversy: Tempest in a Teapot</strong></p>
<p>In this and subsequent posts, I&#8217;m sticking with the notations used by GoF. If you&#8217;re into UMLs, you&#8217;ll know that GoF actually use a few non-standard notations, but I think that by using the ones GoF use our discussion will be less confusing. If you&#8217;re interested in a more standardized UML notation take a look at Judith Bishop&#8217;s book,<em> C# 3.0 Design Patterns</em> (O&#8217;Reilly) on pp.4-5.</p>
<p>GoF discuss abstract classes and interfaces as <strong><em>interfaces</em></strong>. So, in an example where an abstract class is used, you&#8217;ll see an italicized class name. If an interface is used, you&#8217;ll see the same thing. In some respects this can be quite helpful in that when you see any italicized text in a class diagram you&#8217;ll think <em>interface</em> and know that you can develop your own design pattern using either an abstract class or interface.</p>
<p>The inheritance symbol, that we&#8217;ll be covering in detail in a later post, is used to denote both <em>inheritance</em> (extends) and <em>implementation</em> (implements). This is consistent with GoF&#8217;s interchangable use of abstract classes and interfaces and their notations. So bear with me on these idiosyncrasies and help focus on the relationships between participants.<br />
<span id="more-2374"></span><br />
<strong>Let&#8217;s Get Acquainted</strong></p>
<p>When one class holds a reference to another class, we can represent that by a line with an arrow pointing to the class that it <em>has the </em>reference to as shown in the Participant Relations diagram between Class A and the Interface/Abstract Class. If one class holds a reference to many objects in another class, a solid circle is placed at the tip of the arrow as shown between Class D and Class E.</p>
<p>That&#8217;s easy enough to see, but the real question is <em>What&#8217;s going on</em>? In other words, why would one class hold a reference to another? The answer lies at the core of Design Patterns: <em>reuse</em>. Class A is using the the Interface/Abstract class in some manner shape or form. Instead of creating its own interface, it&#8217;s reusing another one.</p>
<p>If you can remember that, you&#8217;re 90% of the way to understanding Design Patterns. You may recall the second principle of Design Patterns is<br />
<blockquote>Favor object composition over class inheritance.</p></blockquote>
<p> The relationship indicates that Class A <em>has an</em> interface. It doesn&#8217;t implement the interface, but through composition <em>has the</em> interface. Such a relationship is an <em>acquaintance</em> one. That means <em>it has reused an existing object through composition.</em></p>
<p>In code, an acquaintance relationship can be many things. For example, consider the <a href="http://www.as3dp.com/category/design-patterns/prototype/">Prototype</a> pattern covered in this blog. In this pattern the Client asks a prototype to clone itself. The pertinent code looks like this:</p>
<p><strong><code>private var tDog:Prototype;<br />
tDog = new Dog();<br />
cDog = tDog.clone(tDog);</code></strong></p>
<p>You may be thinking, <em>That code creates an instance of the Dog class. Shouldn&#8217;t that be a <strong>creates</strong> relationship?</em> If you look closely, you will see that it does not create an instance of Prototype but rather of Dog. The acquaintance arrow points to the Prototype interface; so, while it does instantiate a class, it is through the acquaintance with Prototype and not directly with Dog.</p>
<p>At this point, it&#8217;s very easy for the  satellite  to spin out of orbit when it comes to differentiating between an <em>object reference</em> and the <em>creation</em> of one class by another. However, as you look at more and more implementations of design patterns in code, you&#8217;ll see that where you have an <strong>acquaintance</strong> relationship, you&#8217;ll find that one class is using the other class through composition and not just creation. Using composition allows one class to incorporate the interface of another class and use its properties and methods. To use those properties and methods, the class that has another class through composition needs some kind of instantiation.</p>
<p><strong>Think Composition</strong></p>
<p>A lot of problems understanding participant <strong>relations</strong> in design patterns can be solved if you keep this in mind: <em>Both inheritance and composition reuse a class interface</em>. When you think <em>composition</em>, you almost force your code into good OOP. If you don&#8217;t use composition, what are your alternatives?</p>
<ol>
<li>A big sequential program where you put all of your operations into one huge file. (Bad) </li>
<li>A big procedural program where call procedures as needed in one huge file. (Not good) </li>
<li>A big mother of all classes that spawns subclasses like of black widow laying thousands of eggs. (Scary)</li>
</ol>
<p>Composition is favored because it is more flexible:<br />
<blockquote>Composition is where, <em>new functionality is obtained by assembling or <strong>composing</strong> objects to get more complex functionality</em>.</p></blockquote>
<p> I use the term <em>flexible</em> in this context to mean that composition is defined dynamically at run-time and helps keep each class encapsulated and to focus on its single task. Think of this—salt and pepper. Salt has one function and pepper has another. In composition you can select one or the other or both. With inheritance from class Spices, the salt and pepper may get mixed together, which may be fine and save time in some instances. However, sometimes you just want one or the other. You want each encapsulated and you want them when you need them; not cooked into the meal where you may get too much of one or the other or both.</p>
<p><strong>Delegation</strong></p>
<p>Delegation is a way to get the most out of composition. So, <em>What&#8217;s delegation?</em> According to Gamma, Helm, Johnson and Vissides, delegation requires two objects to handle a request.<em> A <strong>receiving object</strong> delegates operations to its <strong>delegate</strong></em>. For an example of where delegation is used extensively, take a look at the <a href="http://www.as3dp.com/category/design-patterns/visitor/">Visitor</a> design pattern. The operations performed on the concrete elements are always delegated to a Visitor object. When using delegation, a request to an object is forwarded to a delegate instead of by the object using an inherited operation. By using delegation, you can see that it makes it easy to compose behaviors at run-time and to change the way they&#8217;re composed. (When we discuss aggregate relations, you&#8217;ll hear more about delegation.)</p>
<p><strong>Many References</strong></p>
<p>In some patterns like the Observer (Chapter <img src='http://www.as3dp.com/wp-includes/images/smilies/icon_cool.gif' alt='8)' class='wp-smiley' /> and <a href="http://www.as3dp.com/category/design-patterns/visitor/">Visitor</a>, you will see the acquaintance arrow with the solid circle on the end. That means one object maintains many references another object. In looking at the discussion of the Visitor pattern, you can see the ObjectStructure class holds many references to the Element interface. Such multiple references are often handled by Array and Vector objects. For example, in the Visitor post, you will see:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p2374code22'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p237422"><td class="line_numbers"><pre>1
2
3
4
5
6
7
</pre></td><td class="code" id="p2374code22"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//From ObjectStructure class</span>
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> elements:<span style="color: #0066CC;">Array</span>=<span style="color: #66cc66;">&#91;</span><span style="color: #66cc66;">&#93;</span>;
 <span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> attach<span style="color: #66cc66;">&#40;</span>element:IElement <span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
 <span style="color: #66cc66;">&#123;</span>
          elements.<span style="color: #0066CC;">push</span><span style="color: #66cc66;">&#40;</span>element<span style="color: #66cc66;">&#41;</span>;
 <span style="color: #66cc66;">&#125;</span>
....</pre></td></tr></table></div>

<p>That sets up the acquaintance between the ObjectStructure and the Element interface. Because it is a reference to an Array object, it holds a reference to all of its elements as well.</p>
<p><strong>Where to Find Acquaintance Relations in Design Patterns</strong></p>
<p>Of the 23 patterns in the Design Pattern catalog, only 7 have acquaintance relations separate from Client requests. They are:</p>
<ol>
<li>Proxy</li>
<li>Adapter (Object version only)</li>
<li>Chain of Responsibility (Self-reference to Handler interface)</li>
<li>Command</li>
<li>Mediator</li>
<li>Observer</li>
<li>Visitor</li>
</ol>
<p>The great majority of acquaintance relations in class diagrams are between the Client class and one of the design pattern participants. Some, like the <a href="http://www.as3dp.com/category/design-patterns/abstract-factory-pattern/">Abstract Factory</a> and <a href="http://www.as3dp.com/category/design-patterns/flyweight/">Flyweight</a> , have multiple acquaintance relations between the Client and other participants. Also, if you look at Client relations, you will see that they are primarily through an interface and not through concrete classes. (The Flyweight is an exception and the Visitor and Interpreter are partial exceptions.)</p>
<p>In the next post covering Design Pattern relations, we&#8217;ll look at aggregate relations and see how they compare to the ubiquitous acquaintance relations. By comparing them, we can better understand them both and what role each plays in the different design patterns.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2010%2F01%2Factionsscript-3-0-design-pattern-relations-part-i-acquaintances%2F&amp;title=ActionsScript%203.0%20Design%20Pattern%20Relations%20Part%20I%3A%20Acquaintances" id="wpa2a_16"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2010/01/actionsscript-3-0-design-pattern-relations-part-i-acquaintances/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>No New is Good New: Using Inheritance, Composition, Delegation and anything else other than New in ActionScript 3.0 Design Patterns</title>
		<link>http://www.as3dp.com/2008/09/no-new-is-good-new-using-inheritance-composition-delegation-and-anything-else-other-than-new-in-actionscript-30-design-patterns/</link>
		<comments>http://www.as3dp.com/2008/09/no-new-is-good-new-using-inheritance-composition-delegation-and-anything-else-other-than-new-in-actionscript-30-design-patterns/#comments</comments>
		<pubDate>Fri, 19 Sep 2008 22:12:15 +0000</pubDate>
		<dc:creator>William B. Sanders</dc:creator>
				<category><![CDATA[Class Relations]]></category>
		<category><![CDATA[Principles]]></category>

		<guid isPermaLink="false">http://www.as3dp.com/?p=199</guid>
		<description><![CDATA[Before examining why instantiating instances using new is not a good thing, let me explain where I got the idea. It came from the GoF (indirectly) and the Freemans’ Head First Design Patterns (directly). This is not to say that both acquaintance and aggregation type relationships cannot hold a reference to another class by instantiating [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.as3dp.com/wp-content/uploads/2008/09/bucketrule.png" alt="bucketrule" title="bucketrule" width="150" height="133" class="alignleft size-full wp-image-766" />
<p>Before examining why instantiating instances using <strong>new</strong> is <em>not</em> a good thing, let me explain where I got the idea. It came from the GoF (indirectly) and the Freemans’ <em>Head First Design Patterns</em> (directly). This is not to say that both acquaintance and aggregation type relationships cannot hold a reference to another class by instantiating an instance of the other class. (The Proxy example on this blog does that.) Likewise, it may be impossible to do serious development without using at least <em>some <strong>new</strong> statements</em> and so the title indeed contains a bit of hyperbole.</p>
<p>The key idea behind design patterns is that you want your programs to be as flexible as possible.  The dictum, <em>program to an interface, not an implementation</em> is an invitation to more flexible designs. When you create an instance using <strong>new</strong> in effect you lock into using the specific implementation. The more <strong>new</strong> statements in a program, the more tied up it is in whatever implementation you’ve elected to instantiate.</p>
<p>At the same time, I wanted to go over the different class relationships to connect the conceptual with the actual. When I look at a class diagram and see different relationships between classes, often I feel queasy about the relationships independent of a specific example. This is especially true with non-ActionScript 3.0 examples where the application invokes some built-in feature of the alien language. Suddenly, the example is sucked into a black hole remaining a mystery for ActionScript developers. We’ll avoid that here.</p>
<p><strong>Inheritance Is-A First Step</strong></p>
<p>We are advised by the Gang of Four to <em>favor composition over inheritance</em>, but inheritance is a fundamental part of most design patterns, so it’s a good place to start. It’s also the easiest place to show where you can invoke a method without using <strong>new</strong>, We’ll begin with the symbol in the class diagram in Figure 1.</p>
<p><a href="http://www.as3dp.com/wp-content/uploads/2008/09/inheritance1.png"><img class="aligncenter size-full wp-image-210" title="inheritance1" src="http://www.as3dp.com/wp-content/uploads/2008/09/inheritance1.png" alt="" width="280" height="177" /></a></p>
<p><em><strong>Figure 1</strong>: Inheritance relationship</em></p>
<p><span id="more-199"></span>As you can see in Figure 1, the relationship between the Parent class and Child class is pretty simple and straightforward.  The Child inherits all of the Parent characteristics.  As a result, the Child has a strong and tight relationship with the Parent with little flexibility. Now let’s implement that without using the <strong>new</strong> statement in a program that invokes the Child.</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p199code27'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p19927"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
</pre></td><td class="code" id="p199code27"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//Parent Class</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Sprite</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Parent <span style="color: #0066CC;">extends</span> Sprite
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> Parent<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			 <span style="color: #808080; font-style: italic;">//constructor</span>
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> parentMethod<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;Is-a is using me, the Parent&quot;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">//Child Class</span>
package
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Child <span style="color: #0066CC;">extends</span> Parent
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> Child<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">this</span>.<span style="color: #006600;">parentMethod</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			childsPlay<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> childsPlay<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;This is a child original.&quot;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;Mouse location: &quot;</span>+ mouseX<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>When you test this application (calling the Child) in either Flash or Flex, you’ll get the following output:<br />
 <code><br />
 Is-a is using me, the Parent<br />
 This is a child original.<br />
 Mouse location: 147<br />
 </code></p>
<p>I might add that the Parent class inherits the built-in Sprite class, and so the Child class inherits all of the Sprite class properties as well. To illustrate this, the <strong>mouseX </strong> property is inherited from the Sprite class. In turn, Sprite inherits <strong>mouseX </strong> from the DisplayObject class. So the Child class method is able to use the <strong>mouseX </strong> just as it would with any other class that inherits from a class that extends the Sprite class.</p>
<p>You may be thinking that inheritance is used in virtually every design pattern in our book and on this blog (not to mention the GoF book), and so what’s wrong with inheritance? Besides, inheritance is an essential part of OOP. In looking at the design patterns, the little triangle indicating inheritance is typically done so with an abstract class or interface. Where you see the key words <em>extends</em> or <em> implements</em> in a program, you will see the inheritance triangle. However, what you may <em>not</em> see is the fact that the parent class is either an interface or abstract class.  Only the fact that the class name is <em> italicized</em> lets the developer know that the parent class is abstract, and a quick glance often misses that essential point. Inheritance from an abstract class or interface provides a looser coupling in that the subclass has a good deal of flexibility (think <em>polymorphism</em>) as to what the implementation will actually look like.</p>
<p>The further one moves down the structure from the origin class or classes to concrete subclasses, the more tightly bound subclasses become to the parent class. However, as you can see simply by looking at the ActionScript 3.0 reference documentation, which nicely maps the structure of the classes, a lot of inheritance is used to make up ActionScript 3.0. For example, the ActionScript 3.0 TextField class has a fairly long inheritance trail:</p>
<p><code>TextField  -> InteractiveObject -> DisplayObject -> EventDispatcher -> Object</code></p>
<p>Subclasses from the TextField class would further tighten up the connections and possible inherited baggage. So while inheritance is fundamental to good OOP, where possible, GoF recommends other class relationships.</p>
<p><strong>Acquaintance </strong></p>
<p>When two classes are connected through <strong>acquaintance</strong> one class has a relationship to another class in the form of a pointer, reference or, less commonly, an instance. A solid black line with an arrowhead and optional reference name in a class diagram indicate that the class on the back of the arrow, <em>uses</em> the class it points to. Figure 2 shows a <em>uses-a</em> relation diagram:</p>
<p><a href="http://www.as3dp.com/wp-content/uploads/2008/09/acquaintance.png"><img class="aligncenter size-full wp-image-211" title="acquaintance" src="http://www.as3dp.com/wp-content/uploads/2008/09/acquaintance.png" alt="" width="425" height="259" /></a></p>
<p><em><strong><strong>Figure 2</strong>: </strong>Acquaintance</em></p>
<p>A recent example in this blog of an acquaintance can be found in the Proxy design pattern. The Proxy class holds a reference to the Real Subject. In the example the ProxyLogin class holds a reference to a RealLogin class as seen in this following code snippet:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p199code28'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p19928"><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
</pre></td><td class="code" id="p199code28"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> login<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
     <span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>loggedIn==<span style="color: #000000; font-weight: bold;">null</span><span style="color: #66cc66;">&#41;</span>
     <span style="color: #66cc66;">&#123;</span>
          loggedIn=<span style="color: #000000; font-weight: bold;">new</span> RealLogin<span style="color: #66cc66;">&#40;</span>username<span style="color: #66cc66;">&#41;</span>;
     <span style="color: #66cc66;">&#125;</span>
     loggedIn.<span style="color: #006600;">login</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>That certainly keeps a reference to <strong>RealLogin()</strong>, but it’s not the best example of keeping a reference to another class. It instantiates an object of the class inside a conditional statement, and that’s a fairly weak kind of delegation. It instantiates an object when needed, and in that sense <em>uses the other class</em>.  However, both the RealLogin and ProxyLogin implement the<em>ISecurity</em> interface; so they already have a connection. Acquaintances are supposed to be loose, but they’re also supposed to associate one class with another—not just instantiate an instance of the class.  Let’s look at a better example of acquaintance in the Observer pattern.</p>
<p>The relationship between the Subject interface and the Observer interface is a very nice example of class acquaintance. (See Chapter 8 <em>ActionScript 3.0 Design Patterns</em> for the full discussion of the <strong>Observer pattern</strong>.) The Subject interface has an acquaintance with the Observer interface. It does so in the parameter of the Subject’s methods:</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p199code29'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p19929"><td class="line_numbers"><pre>1
2
3
4
5
6
</pre></td><td class="code" id="p199code29"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">public</span> <span style="color: #0066CC;">interface</span> Subject
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">function</span> subscribeObserver<span style="color: #66cc66;">&#40;</span>o:Observer<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>;
	<span style="color: #000000; font-weight: bold;">function</span> unsubscribeObserver<span style="color: #66cc66;">&#40;</span>o:Observer<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>;
	<span style="color: #000000; font-weight: bold;">function</span> notifyObserver<span style="color: #66cc66;">&#40;</span>o:Observer<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>;
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>That’s pretty simple, but it better shows a nice loose kind of relationship. On the Observer side, the interface is,</p>

<div class="wp_codebox_msgheader"><span class="right"><sup><a href="http://www.ericbess.com/ericblog/2008/03/03/wp-codebox/#examples" target="_blank" title="WP-CodeBox HowTo?"><span style="color: #99cc00">?</span></a></sup></span><span class="left"><a href="javascript:;" onclick="javascript:showCodeTxt('p199code30'); return false;">View Code</a> ACTIONSCRIPT</span><div class="codebox_clear"></div></div><div class="wp_codebox"><table><tr id="p19930"><td class="line_numbers"><pre>1
2
3
4
</pre></td><td class="code" id="p199code30"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">public</span> <span style="color: #0066CC;">interface</span> Observer
<span style="color: #66cc66;">&#123;</span>
      <span style="color: #000000; font-weight: bold;">function</span> update<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>That really doesn’t tell you a lot, but it provides an idea of what might be considered an acquaintance. Essentially, holding a reference of some sort sets up a loose coupling. However, we need to look at aggregation to better understand acquaintance.</p>
<p><strong>Delegation through Aggregation </strong></p>
<p>I’m attracted to aggregation like a fly to a spider web—often meeting a similar fate as the fly. I’m easily entangled. Let’s start with the formal outline of aggregation. Again, you will see an arrow pointing to the <em>aggregatee</em>, but on the aggregator’s end is a diamond.</p>
<p><a href="http://www.as3dp.com/wp-content/uploads/2008/09/aggregate.png"><img class="aligncenter size-full wp-image-212" title="aggregate" src="http://www.as3dp.com/wp-content/uploads/2008/09/aggregate.png" alt="" width="500" height="242" /></a></p>
<p><em><strong>Figure 3</strong>: Aggregation</em></p>
<p>If you look carefully at Figures 2 and 3, they’re difficult to tell apart. Both types of relationships hold references to other classes. Usually, the two are differentiated by pointing out that aggregation is a stronger relationship than acquaintance and that the lives of the classes are intertwined in aggregation more so than with acquaintance. That’s true, but Gamma, <em>et al</em> note that differentiating one from the other is more a matter of intent than design. Both acquaintances and aggregations are typically included as pointers and references but less commonly they can be included as instances (as we saw with the Proxy example.) However, both relations are types of composition that go into creating a design pattern, and they do so using composition rather than inheritance.</p>
<p>The aggregation relationship is where the aggregator (Class A in Figure 3) <em>has-a</em> aggregatee (Class B in Figure 3). By my count 10 of the 23 design patterns use <strong>aggregation</strong> and 12 use <strong>acquaintance</strong>. (3 use both). Almost <em>all</em> of the design patterns use inheritance, but most inheritance is from an interface or abstract class.</p>
<p><strong>Hang Loose</strong></p>
<p>So loose coupling between classes is the key to all relationships and instead of worrying about aggregation, acquaintance and inheritance (and splitting hairs over their differences), the focus should be on loose coupling. The <strong>Template Method</strong> is one of the few design patterns that has neither acquaintance nor aggregation. However, it is wonderfully loose because its key algorithm is abstract but ordered. The operations that make up the key algorithm can provide details or be wholly abstract, leaving the details up to the concrete subclasses.</p>
<p>All of this discussion is the result of favoring composition over inheritance and keeping the use of the <strong>new</strong> statement to a minimum. To repeat, this does not mean that <strong>new</strong> cannot be employed either in an implementation (such as the <strong>State</strong> design pattern) or as a reference, as we noted in the Proxy. However, it was impossible to pass up a title like, <em>No New is Good New</em> so, while some of this discussion did touch upon the point so forcefully made by the Freemans, the message is really,</p>
<blockquote>
<p>Hang loose, Dude</p>
</blockquote>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.as3dp.com%2F2008%2F09%2Fno-new-is-good-new-using-inheritance-composition-delegation-and-anything-else-other-than-new-in-actionscript-30-design-patterns%2F&amp;title=No%20New%20is%20Good%20New%3A%20Using%20Inheritance%2C%20Composition%2C%20Delegation%20and%20anything%20else%20other%20than%20New%20in%20ActionScript%203.0%20Design%20Patterns" id="wpa2a_18"><img src="http://www.as3dp.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://www.as3dp.com/2008/09/no-new-is-good-new-using-inheritance-composition-delegation-and-anything-else-other-than-new-in-actionscript-30-design-patterns/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
	</channel>
</rss>

