Yakov Fain - Design Patterns a Deep Dive
Upcoming SlideShare
Loading in...5
×
 

Yakov Fain - Design Patterns a Deep Dive

on

  • 1,757 views

Design patterns suggest approach to common problems that arise during software development regardless of what programming language. But implementation of these patterns is specific to the language. ...

Design patterns suggest approach to common problems that arise during software development regardless of what programming language. But implementation of these patterns is specific to the language. The main goal of this presentation is to highlight selected patterns as they may be implemented taking advantages of Flex framework.
You'll see a not so obvious implementation of a Singleton, how a Proxy can dramatically change the behavior of an object, why a Mediator is a must-have in each Flex application. Do you know how to write Data Transfer Objects that are so important in Flex remoting? If time permits, we'll review the Class Factory pattern too.

Statistics

Views

Total Views
1,757
Views on SlideShare
1,757
Embed Views
0

Actions

Likes
0
Downloads
30
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Yakov Fain - Design Patterns a Deep Dive Yakov Fain - Design Patterns a Deep Dive Presentation Transcript

    • Design
Pa*erns,
a
Deep
Dive
 By
Yakov
Fain
 Farata
Systems
 (c)
Farata
Systems

    • Farata Systems: What do we wo Consulting and training ($$$$$$$$$$$$$$$$$$) Software development (for free) (open source project Clear Toolkit on Sourceforge.net) Writing tech. books and articles on Java and Adobe Flex (making from $0 to $1 per hour) www.faratasystems.com 2

    • What
is
this
about?
 



Design
pa*erns
suggest
an
approach
to
 common
problems
that
arise
during
 soCware
development
regardless
of
 what
programming
language
you
use.
 


But
the
goal
of
this
presentaGon
is
to
 highlight
selected
pa*erns
as
you
may
 implement
them
taking
advantage
of
 the
Flex
framework.
 (c)
Farata
Systems

    • We’ll
talk
about
these
pa*erns
 •  Singleton
 •  Proxy
 •  Mediator
 •  Data
Transfer
Object
 •  Asynchronous
Token
 (c)
Farata
Systems

    • Singleton
 You
can
create
only
one
instance
of
such
a
class
 There’s
no
private
constructors
in
AcGonScript

 Consider
a
sample
file

MySingleton.as

 package
somePackage{


 

public
class
MySingleton
{


 



private
staGc
const
_instance:
MySingleton
=
new
MySingleton
(Lock
);


 



public
staGc
funcGon
get
instance():MySingleton
{


 








return
_instance;


 




}


 


public
funcGon
MySingleton(
lock:Class
)

{


 







if
(
lock
!=
Lock
)

{


 












throw
new
Error(
quot;Illegal
instanGaGon.quot;
);


 








}


 


}
 
}
 //

End
of
package
 

class
Lock

{


 

}

 (c)
Farata
Systems

    • Have
you
ever
seen
this?
 var
model:
AppModelLocator
=

 























AppModelLocator.getInstance();
 and
this?
 service
=

 


ServiceLocator.getInstance().getHTTPService(

 

































'loadEmployeesService');
 (c)
Farata
Systems

    • Enhancing
the
ApplicaGon
object
 public
dynamic
class
DynamicApplica5on
extends
Applica5on
 











































































implements


IApplicaGonFacade{
 







public
funcGon
DynamicApplicaGon(){
 
 
 
super();
 
} 
 

 







public
staGc
var
services:DicGonary
=
new
DicGonary();
 
 
public
funcGon
getService(name:String)
:
Object
{
 
 
return
services[name];
 
}
 
public
funcGon
addService(name:String,value:
Object):
void
{
 
 
services[name]
=
value;
 
}
 
public
funcGon
removeService(name:String)
:
void
{
 
 
 
delete
services[name];
 
}
 
public
funcGon
getServices()
:
DicGonary
{
 The
IApplicaGonFacade

just
declares
these
 
 
 
return
services;
 four
methods
to
enable
Flex
Builder’s
 
}
 intellisense
help
when
casGng.
 
}
 var myApp:IApplicationFacade = …


 (c)
Farata
Systems

    • Adding
any
properGes
to
myModel
 (c)
Farata
Systems

    • Sample
dynamic
applicaGon
(beginning)
 <?xml
version=quot;1.0quot;
encoding=quot;uc‐8quot;?>
 <fx:DynamicApplicaGon
xmlns:mx=quot;h*p://www.adobe.com/2006/mxmlquot;
layout=quot;absolutequot;
 xmlns:fx=quot;h*p://www.faratasystems.com/2009/componentsquot;

 

creaGonComplete=quot;addAllServices();quot;>
 <mx:Script>
 
<![CDATA[
 
import
com.farata.core.DynamicApplicaGon;
 
import
mx.core.ApplicaGon;
 
 
 

 //
Add
required
services
to
the
Applica3on
object,
i.e.
myModel
and

myServices

 private
func5on
addAllServices()
:void
{
 





DynamicApplicaGon.services[quot;myModelquot;]=
new
Object(); 

 





DynamicApplicaGon.services[quot;myServicesquot;]
=
new
Object(); 
 
 
 

 }
 
 
 

 private
func5on
getData(serviceName:String,
key:Object):Object{
 






return
DynamicApplicaGon.services[serviceName][key];
 }
 
 
 

 private
func5on
setData(serviceName:String,
key:Object,
value:String):void{
 
DynamicApplicaGon.services[serviceName][key]=
new
String(value);
 }
 
 

 ]]>
 </mx:Script>
 (c)
Farata
Systems

    • Sample
dynamic
applicaGon
(ending)
 <!‐‐Adding
values
to
myModel
‐‐>
 <mx:Bu*on
label=quot;Add
to
myModelquot;
x=quot;193quot;
y=quot;59”
 
























































click=quot;setData('myModel',key.text,
value.text)quot;/>
 <mx:Label
x=quot;14quot;
y=quot;42quot;
text=quot;Keyquot;
fontWeight=quot;boldquot;/>
 <mx:Label
x=quot;14quot;
y=quot;14quot;
fontWeight=quot;boldquot;
fontSize=quot;14quot;>
 <mx:text>Add
one
or
more
key/value
pairs
to
the
object
MyModel</mx:text>
 <mx:Label
x=quot;91quot;
y=quot;42quot;
text=quot;Valuequot;
fontWeight=quot;boldquot;/>
 <mx:TextInput
x=quot;8quot;
y=quot;59quot;
id=quot;keyquot;
width=quot;75quot;/>
 <mx:TextInput
x=quot;89quot;
y=quot;59quot;
id=quot;valuequot;
width=quot;96quot;/>
 <!‐‐Retrieving
the
value
from
a
Singleton.
‐‐>
 <mx:Bu*on
label=quot;Show
the
valuequot;
x=quot;8quot;
y=quot;122quot;

 





















click=quot;retrievedValue.text=getData('myModel',
key.text)
as
Stringquot;/>
 <mx:Label
x=quot;135quot;
y=quot;121quot;
width=quot;95quot;
id=quot;retrievedValuequot;
fontWeight=quot;boldquot;
fontSize=quot;15quot;/>
 <mx:Label
x=quot;10quot;
y=quot;94quot;
fontWeight=quot;boldquot;
fontSize=quot;14quot;>
 <mx:text>Retrieve
and
display
the
value
from
MyModel
bykey</mx:text>
 </fx:DynamicApplicaGon>
 (c)
Farata
Systems

    • Proxy
 A
proxy
is
an
object
that
represents
another
 object
and
controls
access
to
it.
 Think
of
a
secretary
that
receives
a
package
for
 her
boss.
 In
AcGonScript
you
can
wrap
the
class
XYZ
in
 mx.uGl.ObjectProxy,
which
will
be
a
proxy
that
 controls
access
to
the
XYZ’s
properGes.
 (c)
Farata
Systems

    • How
[Bindable]
works?
 [Bindable]
 var
lastName:String;
 Flex
compiler

generates
a
wrapper
class
with
a
se*er

 that
dispatches
propertyChange
event
on
each

 modificaGon
of
lastName
 You
can
do
it
on
your
own
by
using
the
class
 
mx.uGls.ObjectProxy
 (c)
Farata
Systems

    • Wrapping
Person
in
ObjectProxy
 package
com.farata{
 
public
dynamic
class
Person 
{
 




public
var
lastName:String=quot;Johnsonquot;;
 




public
var
salary:Number=50000;

 
}
 }
 (c)
Farata
Systems

    • Running
the
Person
proxy
 (c)
Farata
Systems

    • Extending
Object
Proxy
 Add
some
applicaGon
logic
to
it.
If
the
salary
of
a
person
increases
over
$55K,

 she
becomes
enGtled
for
the
pension
in
the
amount
of
2%
of
the
salary.

 You
want
to
add
this
funcGonality
without
touching
the
code
of
the
class
Person.

 In
a
subclass
of
ObjectProxy,
you
can
 
override
getProperty() and
setProperty() from
the
namespace
flash_proxy.


 If
you’ll
write

 MyPersonProxy.lastName=”McCartney”,
 this
object
will
call
its
own
method

 setProperty(“lastName”, “McCartney”). Intercept
this
call
and
add
some
 
processing
to
to
the

 overridden
method
setProperty().

 (c)
Farata
Systems

    • TesGng
 MyPersonProxy
 ACer
3
clicks
adding
pension property
 (c)
Farata
Systems

    • Mediator
 Any
complex
screen,
more
or
less,
of
a
business
applicaGon

 consists
of
a
number
of
containers
and
components.
 We
want
to
create
loosely‐coupled
custom
components

 that
are
self
contained,
do
not
know
about
existence

 of
each
other
and
can
communicate
with
the
“outside
 world”
by
sending
and
receiving
events.


 (c)
Farata
Systems

    • Wall
Street:
Stock
Trading
ApplicaGon
 Before
the
trader
clicked
on
the
Price
Panel

 
PricePanel
component
has
three
 
variables:
symbol, bid and ask

 PricePanel
dispatches
the
OrderEvent
 dispatchEvent(new OrderEvent( OrderEvent.PREPARE_ORDER_EVENT , symbol, bid,ask,buy)); 
 

 OrderPanel
listens
to
OrderEvent

 ACer
the
trader
clicked
on
the
Price
Panel

 addEventListener(
 

OrderEvent.PLACE_ORDER_EVENT,
 





























orderEventHandler)

 func5on
orderEventHandler(evt:OrderEvent){
 


sym.text=evt.symbol;
 


operaGon.text=evt.buy?quot;Buyquot;:quot;Sellquot;;
 


price.text=(oper.text==quot;Buyquot;?
 





































evt.bid:evt.ask);
 (c)
Farata
Systems
 }

    • PricePanel
Component.
Take
1
 OrderEvent
carries
4
variables
 (c)
Farata
Systems

    • Custom
Event
OrderEvent
 Too
many
user
variables.

 It
would
be
a
good
idea
to

 encapsulate
them
in
one

DTO
–
 
Data
Transfer
Object
a.k.a.
Value
Object

 The
Mediator
receives
this
event
from
PricePanel

 and
dispatches
it
to
OrderPanel
 (c)
Farata
Systems

    • The
Mediator
applicaGon
 Listen
to
the
OrderEvent

 from
PricingPanel
 …and
send
it
to
 OrderPanel
 (c)
Farata
Systems

    • Data
Transfer
Object
 Data
Transfer
Objects
(DTO)
a.k.a.
Value
Objects
(VO)
are
used

 for
data
exchange
between
various
applicaGon
components,

 which
can
be
either
co‐located
in
the
same
process
or

 on
remote
computers.

 These
DTO’s
can
even
be
wri*en
in
different
programming

 languages,
for
example
Java
and
AcGonScript.

 (c)
Farata
Systems

    • Introducing
DTO
in
Stock
Trading
App.
 Instead
of
passing
several
variables
between
pricing
and
order
 panels,
we’ll
encapsulate
order
details
in
the
OrderDTO class
 and
send
it
inside
the
event
object
to
the
mediator.
 (c)
Farata
Systems

    • PricePanel
Component.
Take
2
 UI
components
are
bound
to
 DTO
properGes
 startDataFeed() emulates
external
data
feed

 Packaging
a
DTO
inside
the
 event
OrderEvent2

 (c)
Farata
Systems

    • Now
PricePanel
Dispatches
OrderEvent2
 The
applica5on
(mediator)
will
get
this
event
and
dispatvh
it
to
the
OrderPanel:
 var
orderEvt:
OrderEvent2=
new
 
OrderEvent2(OrderEvent2.PLACE_ORDER_EVENT,evt.orderInfo);
 
 
 
ordPanel.dispatchEvent(orderEvt); (c)
Farata
Systems
 


    • OrderPanel
receives
the
event…
 …extracts
the
DTO
 
from
the
event
 …and
populates
 UI
components
of
 OrderPanel
 (c)
Farata
Systems

    • Advanced
DTOs
 If
you
envision
dynamic
updates
to
the
data
on
the
client,
declare
these
classes
as
[Bindable].

 Use
an
ArrayCollecGon
of
such
bindable
DTO’s
as
a
dataProvider
in
your
DataGrid,

 List,
and
similar
components.
 Make
sure
that
both
server‐side
and
client‐side
DTOs
provide
unique
property
uuid.

 Flex
uses
this
property
to
uniquely
idenGfy
the
data
elements
of
the
List‐based
controls.

 Consider
replacing
each

public
properGes
with
the
ge*er
and
se*er
to
have
more
control
 
over
the
modificaGons
of
these
properGes.


 You
can
and
add
the
code
to
these
se*ers/ge*ers
that
will
intercept
the
acGon
of
data

 modificaGon
and
perform
addiGonal
processing
based
on
what’s
being
changed.

 Then,
the
se*er
can

dispatch
the
event
PropertyChange
event
as
shown
on
the
next
slide

 (c)
Farata
Systems

    • Sample
DTO
with
bid
property
 Farata
Systems
has
created
DTO
generator
for
Java
programmers
called
Dto2Fx
 that
creates
AcGonScript
DTOs
from
their
Java
counterparts.
 It’s
a
freeware,
and
you
can
get
it
at
h*p://flexblog.faratasystems.com/?p=357

 (c)
Farata
Systems

    • Asynchronous
Token
 The
user
makes
several
RemoteObject
requests
and
results

 come
back
asynchronously
in
arbitrary
order.

 Each
request
calls
a
result
handler
funcGon
providing

 the
result
event.
 How
the
applicaGon
code
can
map
arriving
result
objects

 back
to
the
iniGal
requestors?

 (c)
Farata
Systems

    • 
AsyncToken
Class
 The
goal
of
the
Asynchronous
Token
pa*ern
is
to
properly
route

 the
processing
on
the
client
in
response
to
the
data
arriving

 asynchronously
form
the
server
 AsyncToken
is
a
dynamic
class,
you
can
add
any
properGes
to
this

 class
during
runGme


 <mx:RemoteObject
id=”ord”
desGnaGon=”Orders”
/>
 
…
 private
funcGon
sendOrder(/*arguments
go
here*/):void{
 



var
token:
AsyncToken
=
ord.placeOrder({item:”Sony
TV”});
 



token.orderNumber=”12345”;
 



token.responder
=
new
Responder(processOrderPlaced,
processOrderFault);
 



token.addResponder(new
Responder(createShipment,processOrderFault));
 }
 (c)
Farata
Systems

    • When
the
result
comes
back
 AsyncToken
is
a
local
object.
It
is
idenGfied
by
a
messageId that
is
passed
with

 the
request
to
server.
 When
the
server
responds,
it
includes
a
correlationId property
in
the
message
 header,
and
Flex
automaGcally
calls
the
appropriate
AsyncToken
responders
in
the
order
 they
were
defined.

 private
funcGon
processOrderPlaced(event:ResultEvent):void
{
 



myOrderNumber:Object
=
event.token.orderNumber;
 



//
if
myOrderNumber
is
12345,
process
it
accordingly
 }
 (c)
Farata
Systems

    • Contact
Info
&
Links
 Email:
yfain@faratasystems.com
 Web
site:
h*p://www.faratasystems.com
 Clear
Toolkit:
h*p://sourceforge.net/projects/cleartoolkit/


 O’Reilly
Book
“Enterprise
Development
with
Flex”
:
 
h*p://my.safaribooksonline.com/9780596801465

 (c)
Farata
Systems