eolas/neuron/d0ed26d0-cdc8-4643-8c09-445408195f9b/.neuron/output/Factory_pattern.html

111 lines
14 KiB
HTML
Raw Normal View History

2024-10-20 19:00:04 +01:00
<!DOCTYPE html><html><head><meta content="text/html; charset=utf-8" http-equiv="Content-Type" /><meta content="width=device-width, initial-scale=1" name="viewport" /><!--replace-start-0--><!--replace-start-5--><!--replace-start-8--><title>Factory pattern - My Zettelkasten</title><!--replace-end-8--><!--replace-end-5--><!--replace-end-0--><link href="https://cdn.jsdelivr.net/npm/fomantic-ui@2.8.7/dist/semantic.min.css" rel="stylesheet" /><link href="https://fonts.googleapis.com/css?family=Merriweather|Libre+Franklin|Roboto+Mono&amp;display=swap" rel="stylesheet" /><!--replace-start-1--><!--replace-start-4--><!--replace-start-7--><link href="https://raw.githubusercontent.com/srid/neuron/master/assets/neuron.svg" rel="icon" /><meta content="The factory pattern pertains to how objects are created in the course of the code. It is class based." name="description" /><meta content="Factory pattern" property="og:title" /><meta content="My Zettelkasten" property="og:site_name" /><meta content="article" property="og:type" /><meta content="Factory_pattern" property="neuron:zettel-id" /><meta content="Factory_pattern" property="neuron:zettel-slug" /><meta content="OOP" property="neuron:zettel-tag" /><meta content="design-patterns" property="neuron:zettel-tag" /><script type="application/ld+json">[]</script><style type="text/css">body{background-color:#eeeeee !important;font-family:"Libre Franklin", serif !important}body .ui.container{font-family:"Libre Franklin", serif !important}body h1, h2, h3, h4, h5, h6, .ui.header, .headerFont{font-family:"Merriweather", sans-serif !important}body code, pre, tt, .monoFont{font-family:"Roboto Mono","SFMono-Regular","Menlo","Monaco","Consolas","Liberation Mono","Courier New", monospace !important}body div.z-index p.info{color:#808080}body div.z-index ul{list-style-type:square;padding-left:1.5em}body div.z-index .uplinks{margin-left:0.29999em}body .zettel-content h1#title-h1{background-color:rgba(33,133,208,0.1)}body nav.bottomPane{background-color:rgba(33,133,208,2.0e-2)}body div#footnotes{border-top-color:#2185d0}body p{line-height:150%}body img{max-width:100%}body .deemphasized{font-size:0.94999em}body .deemphasized:hover{opacity:1}body .deemphasized:not(:hover){opacity:0.69999}body .deemphasized:not(:hover) a{color:#808080 !important}body div.container.universe{padding-top:1em}body div.zettel-view ul{padding-left:1.5em;list-style-type:square}body div.zettel-view .pandoc .highlight{background-color:#ffff00}body div.zettel-view .pandoc .ui.disabled.fitted.checkbox{margin-right:0.29999em;vertical-align:middle}body div.zettel-view .zettel-content .metadata{margin-top:1em}body div.zettel-view .zettel-content .metadata div.date{text-align:center;color:#808080}body div.zettel-view .zettel-content h1{padding-top:0.2em;padding-bottom:0.2em;text-align:center}body div.zettel-view .zettel-content h2{border-bottom:solid 1px #4682b4;margin-bottom:0.5em}body div.zettel-view .zettel-content h3{margin:0px 0px 0.4em 0px}body div.zettel-view .zettel-content h4{opacity:0.8}body div.zettel-view .zettel-content div#footnotes{margin-top:4em;border-top-style:groove;border-top-width:2px;font-size:0.9em}body div.zettel-view .zettel-content div#footnotes ol > li > p:only-of-type{display:inline;margin-right:0.5em}body div.zettel-view .zettel-content aside.footnote-inline{width:30%;padding-left:15px;margin-left:15px;float:right;background-color:#d3d3d3}body div.zettel-view .zettel-content .overflows{overflow:auto}body div.zettel-view .zettel-content code{margin:auto auto auto auto;font-size:100%}body div.zettel-view .zettel-content p code, li code, ol code{padding:0.2em 0.2em 0.2em 0.2em;background-color:#f5f2f0}body div.zettel-view .zettel-content pre{overflow:auto}body div.zettel-view .zettel-content dl dt{font-weight:bold}body div.zettel-view .zettel-content blockquote{background-color:#f9f9f9;border-left:solid 10px #cccccc;margin:1.5em 0px 1.5em 0px;padding:0.5em 10px 0.5em 10px}body div.zettel-view .zettel-content.raw{background-color:#dddddd}body .ui.label.zettel-tag{color:#000000}body .ui.label.zettel-tag a{color:#
async=""
id="MathJax-script"
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"
></script>
<link
href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/themes/prism.min.css"
rel="stylesheet"
/><link rel="preconnect" href="https://fonts.googleapis.com" /><link
rel="preconnect"
href="https://fonts.gstatic.com"
crossorigin
/><link
href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=IBM+Plex+Sans+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=IBM+Plex+Serif:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap"
rel="stylesheet"
/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/components/prism-core.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/plugins/autoloader/prism-autoloader.min.js"></script>
<style>
body .ui.container,
body ul {
font-family: "IBM Plex Sans" !important;
}
body blockquote {
border-left-width: 3px !important;
font-style: italic;
}
.headerFont,
.ui.header,
body h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "IBM Plex Sans Condensed" !important;
}
body p {
line-height: 1.4;
}
.monoFont,
body code,
pre,
tt {
font-family: "IBM Plex Mono" !important;
font-size: 12px !important;
line-height: 1.4 !important;
}
</style>
<!--replace-end-7--><!--replace-end-4--><!--replace-end-1--></head><body><div class="ui fluid container universe"><!--replace-start-2--><!--replace-start-3--><!--replace-start-6--><div class="ui text container" id="zettel-container" style="position: relative"><div class="zettel-view"><article class="ui raised attached segment zettel-content"><div class="pandoc"><h1 id="title-h1">Factory pattern</h1><p>The factory pattern pertains to how objects are created in the course of the code. It is class based.</p><p>In this pattern we create a class interface that delegates the responsibility of object instantiation to its subclasses.</p><p>You have a high level class that sits on top of two or more lower level classes that are semantically related but different in function. Depending on the input the higher level class receives upon instantiation, it will generate one of the lower level classes.</p><h3 id="advantages">Advantages</h3><ul><li>allows for dynamic creation<ul><li>we may not know what objects are required until runtime: the factory allows us to cover several eventualities</li></ul></li><li>decoupling<ul><li>in cases where the lower level classes combine to create something greater than their individual parts (see the Alligator example below), they do not have to know about each other.</li></ul></li><li>maintenance<ul><li>allows us to add/remove new object classes easily without changing a lot of code.</li></ul></li></ul><h2 id="examples">Examples</h2><p>We have two types of notification: email and push. The creation of these two is handled by a factory class called <code>NotificationFactory</code> :</p><pre><code class="jsx language-jsx">class PushNotification {
constructor(sendTo, message) {
this.sendTo = sendTo;
this.message = message;
}
}
class EmailNotification {
constructor(sendTo, cc, emailContent) {
this.sendTo = sendTo;
this.cc = cc;
this.emailContent = emailContent;
}
}</code></pre><pre><code class="jsx language-jsx">class NotificationFactory {
createNotification(type, props) {
switch (type) {
case &quot;email&quot;:
return new EmailNotification(
props.sendTo,
props.cc,
props.emailContent
);
case &quot;push&quot;:
return new PushNotification(props.sendTo, props.message);
}
}
}</code></pre><p>We first instantiate an instance of the factory and then pass into it the parameters for either of the two lower level classes.</p><pre><code class="jsx language-jsx">const factory = new NotificationFactory();
// create email notification
const emailNotification = factory.createNotification(&quot;email&quot;, {
sendTo: &quot;receiver@domain.com&quot;,
cc: &quot;test@domain.com&quot;,
emailContent: &quot;This is the email content to be delivered.!&quot;,
});
// create push notification
const pushNotification = factory.createNotification(&quot;push&quot;, {
sendTo: &quot;receiver-device-id&quot;,
message: &quot;The push notification message&quot;,
});</code></pre><p>This example doesnt use a constructor on the factory class, but we could easily do so. This would remove the need to call a method on the factory class when we want to instantiate one of the subclasses. Here is another example that does this with an alligator factory:</p><pre><code class="jsx language-jsx">class ReptilePartFactory {
constructor(type, props) {
if (type === &quot;tail&quot;) return new TailFactory(props);
if (type === &quot;torso&quot;) return new TorsoFactory(props);
if (type === &quot;head&quot;) return new HeadFactory(props);
}
}
let alligator = {};
let alligatorProps = {
tailLength: 2.5,
color: &quot;green&quot;,
snoutLenth: 1,
};
//gets a tail from the tail factory
alligator.tail = new ReptilePartFactory(&quot;tail&quot;, alligatorProps);
//gets a torso from the torso factory
alligator.torso = new ReptilePartFactory(&quot;torso&quot;, alligatorProps);
//gets a head from the head factory
alligator.head = new ReptilePartFactory(&quot;head&quot;, alligatorProps);</code></pre></div></article><nav class="ui attached segment deemphasized bottomPane" id="neuron-tags-pane"><div><span class="ui basic label zettel-tag" title="Tag">OOP</span><span class="ui basic label zettel-tag" title="Tag">design-patterns</span></div></nav><nav class="ui bottom attached icon compact inverted menu blue" id="neuron-nav-bar"><!--replace-start-9--><!--replace-end-9--><a class="right item" href="impulse.html" title="Open Impulse"><i class="wave square icon"></i></a></nav></div></div><!--replace-end-6--><!--replace-end-3--><!--replace-end-2--><div class="ui center aligned container footer-version"><div class="ui tiny image"><a href="https://neuron.zettel.page"><img alt="logo" src="https://raw.githubusercontent.com/srid/neuron/master/assets/neuron.svg" title="Generated by Neuron 1.9.35.3" /></a></div></div></div></body></html>