-
Notifications
You must be signed in to change notification settings - Fork 1
/
creational.html
104 lines (78 loc) · 4.15 KB
/
creational.html
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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="favicon.ico">
<title>IS 217 - creational js design patterns</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/cover.css" rel="stylesheet">
<!-- Javascript Design Pattern-->
<script type="text/javascript" src="js/factory_decorator.js"> </script>
<!-- Just for debugging purposes. Don't actually copy this line! -->
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="site-wrapper">
<div class="site-wrapper-inner">
<div class="cover-container">
<div class="masthead clearfix">
<div class="inner">
<h3 class="masthead-brand">.js design patterns</h3>
<ul class="nav masthead-nav">
<li><a href="index.html"><span class="glyphicon glyphicon-home"></span> home</a></li>
<li class="active"><a href="creational.html">creational</a></li>
<li><a href="structural.html">structural</a></li>
<li><a href="behavioral.html">behavioral</a></li>
</ul>
</div>
</div>
<div class="inner cover" style="background-color:black;filter:alpha(opacity=70); opacity:0.58;">
<h1 class="cover-heading">Creational Design Patterns.</h1>
<p class="lead">
Creational design patterns focus on handling object creation mechanisms where objects are created in a
manner suitable for the situation we're working in. </p>
<p class="lead">
<a href="#" class="btn btn-lg btn-success">Learn more</a>
</p>
</div>
<div class="row marketing">
<div class="col-lg-6">
<h4>Factory Design Pattern</h4>
<p>So in a real-world Factory, it's able to produce many items and really as a customer we don't care how its produce.
What this Factory design pattern allows us to do, is allow the user to create an instance of an object without using the new constructor. </p>
<h4>Factory/Decorator Design Pattern Implementation</h4>
<p>We are combining these 2 patterns by allowing a company to create new vehicles using the Factory pattern. They create a factory and can then instentiate cars and pass the options. Then, using Decorators a company can list upgrades like leather upgrade or rim upgrade</p>
</div>
<div class="col-lg-6">
<h4>Decorator Design Pattern</h4>
<p>The Decorator Design Pattern allows functions to be added without adding or editing a constructor. You can add functionality quicker and just truly simplifies having to add functionality to a talk</p>
<h4>Link to Code</h4>
<p><a href="js/factory_decorator.js">Link to JS</a></p>
</div>
</div>
</div> <!-- /container -->
<div class="mastfoot">
<div class="inner">
<p><a href="https://github.com/dg253" target="blank">David Garcia</a>, <a href="https://github.com/abartolo2" target="blank">Alex Bartolo.</a></p>
</div>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
</body>
</html>