4 javascript design patterns you should know (+ scotchmas day 2) _ scotch

12/20/2015 4 JavaScript Design Patterns You Should Know (+ Scotchmas Day 2) | Scotch

https://scotch.io/bar-talk/4-javascript-design-patterns-you-should-know 1/40

(/)

4 JavaScript DesignPatterns You ShouldKnow (+ Scotchmas

Day 2) Devan Patel ( (https://scotch.io/author/devan)@devanp92 (https://twitter.com/devanp92))

December 15, 2015 54 Bar Talk (https://scotch.io/category/bar-talk) javascript(https://scotch.io/tag/javascript)

0 shares

https://scotch.io/

https://scotch.io/author/devan

https://twitter.com/devanp92

https://scotch.io/category/bar-talk

https://scotch.io/tag/javascript



POPULAR ON SCOTCH

Creating DesktopApplications WithAngularJS and GitHubElectron

(https://scotch.io/tutorials/creating-

desktop-applications-with-angularjs-

and-github-electron)

Create a MEAN StackGoogle Map App (Part I)

(https://scotch.io/tutorials/making-

mean-apps-with-google-maps-part-i)

Containerized Testing forNode Applications withDockunit

(https://scotch.io/tutorials/containerized-

testing-for-node-applications-with-

dockunit)

Aesthetic Sass 3:Typography and VerticalRhythm

(https://scotch.io/tutorials/aesthetic-

sass-3-typography-and-vertical-rhythm)

The Scotchmas Day 2

giveaway can be found at

the end of this article.

Every developer strives to

write maintainable,

readable, and reusable

code. Code structuring

becomes more important

as applications become

larger. Design patterns

prove crucial to solving

this challenge – providing

an organization structure

for common issues in a

particular circumstance.

JavaScript web developers

frequently interact with

design patterns, even

unknowingly, when

creating applications.

https://scotch.io/tutorials/creating-desktop-applications-with-angularjs-and-github-electron

https://scotch.io/tutorials/making-mean-apps-with-google-maps-part-i

https://scotch.io/tutorials/containerized-testing-for-node-applications-with-dockunit

https://scotch.io/tutorials/aesthetic-sass-3-typography-and-vertical-rhythm

https://scotch.io/tutorials/create-a-custom-audio-player-element-using-polymer



Create a Custom AudioPlayer Element usingPolymer

(https://scotch.io/tutorials/create-a-

custom-audio-player-element-using-

polymer)

Create a Real-TimeShoutbox with LaravelEvents

(https://scotch.io/tutorials/create-a-

real-time-shoutbox-with-laravel-events)

Simbla: A Next GenerationResponsive WebsiteBuilder

(https://scotch.io/tutorials/simbla-a-

next-generation-responsive-website-

builder)

LEARN NODE AND ANGULARWITH OUR EBOOK

Although there is a diverse

list of design patterns used

in certain circumstances,

JavaScript developers tend

to use some patterns

customarily more than

others.

In this post, I want to

discuss these common

patterns to expose ways to

improve your

programming repertoire

and dive deeper into the

JavaScript internals.

The design patterns in

question include the

following:

Module

Prototype

Observer

Singleton

Each pattern consists of

many properties.

However, I will emphasize

https://scotch.io/tutorials/create-a-custom-audio-player-element-using-polymer

https://scotch.io/tutorials/create-a-real-time-shoutbox-with-laravel-events

https://scotch.io/tutorials/simbla-a-next-generation-responsive-website-builder

http://bit.ly/1FxJ3TI



(http://bit.ly/1FxJ3TI)

A VAGRANT LAMP STACKTHAT JUST WORKS

(http://bit.ly/1PY0ujh)

DEAD SIMPLE

OFF-CANVAS PANELS

the following key points:

1. Context:Where/under whatcircumstances is thepattern used?

2. Problem: What are wetrying to solve?

3. Solution: How doesusing this patternsolve our proposedproblem?

4. Implementation:What does theimplementation looklike?

JavaScript modules are the

most prevalently used

design patterns for

keeping particular pieces

of code independent of

other components. This

Module DesignPattern

http://bit.ly/1FxJ3TI

http://bit.ly/1PY0ujh



OFF-CANVAS PANELS

(http://bit.ly/1QJLLK5)

SCOTCH.IO STICKERS!

(http://shop.scotch.io)

provides loose coupling to

support well-structured

code.

For those that are familiar

with object-oriented

languages, modules are

JavaScript “classes”. One of

the many advantages of

classes is encapsulation –

protecting states and

behaviors from being

accessed from other

classes. The module

pattern allows for public

and private (plus the

lesser-know protected and

privileged) access levels.

Modules should be

Immediately-Invoked-

Function-Expressions (IIFE)

to allow for private scopes

– that is, a closure that

protect variables and

methods (however, it will

http://bit.ly/1QJLLK5

http://shop.scotch.io/



return an object instead of

a function). This is what it

looks like:

(function()

// declare private variables and/or functions

return // declare public variables and/or functions

)();

Here we instantiate the

private variables and/or

functions before returning

our object that we want to

return. Code outside of

our closure is unable to

access these private

variables since it is not in

the same scope. Let’s take

a more concrete

implementation:



var HTMLChanger = (function() var contents = 'contents'

var changeHTML = function() var element = document.getElementById element.innerHTML = contents;

return callChangeHTML: function() changeHTML(); console.log(contents); ;

)();

HTMLChanger.callChangeHTML(); // Outputs: 'contents'console.log(HTMLChanger.contents); // undefined

Notice that

callChangeHTML binds to

the returned object and

can be referenced within

the HTMLChanger

namespace. However,

when outside the module,

contents are unable to be

referenced.

Revealing ModulePattern



A variation of the module

pattern is called the

Revealing ModulePattern. The purpose is to

maintain privacy for all

variables and methods

only finally revealed in the

returned object literal. The

direct implementation

looks like this:



var Exposer = (function() var privateVariable = 10;

var privateMethod = function() console.log('Inside a private method!' privateVariable++;

var methodToExpose = function() console.log('This is a method I want to expose!'

var otherMethodIWantToExpose = function privateMethod();

return first: methodToExpose, second: otherMethodIWantToExpose ;)();

Exposer.first(); // Output: This is a method I want to expose!Exposer.second(); // Output: Inside a private method!Exposer.methodToExpose; // undefined

Although this looks much

cleaner, an obvious

disadvantage is unable to

reference the private

methods. This can pose

unit testing challenges.



Similarly, the public

behaviors are non-

overridable.

Any JavaScript developer

has either seen the

keyword prototype,

confused by the

prototypical inheritance or

implemented prototypes

in their code. The

Prototype design pattern

relies on the JavaScript

prototypical inheritance

(https://developer.mozilla.

org/en-

US/docs/Web/JavaScript/In

heritance_and_the_prototy

pe_chain). The prototype

model is used mainly for

creating objects in

performance-intensive

situations.

PrototypeDesign Pattern

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain



The objects created are

clones (shallow clones) of

the original object that are

passed around. One use

case of the prototype

pattern is performing an

extensive database

operation to create an

object used for other parts

of the application. If

another process needs to

use this object, instead of

having to perform this

substantial database

operation, it would be

advantageous to clone the

previously created object.

operation()

Client

clone()

ConcretePrototype1

clone()

ConcretePrototype2

clone()

«interface»

Prototype

return copy of self return copy of self

Object p = prototype.clone();

«import»I

Prototype Design Pattern

on Wikipedia

(https://upload.wikimedia.

org/wikipedia/commons/1

/14/Prototype_UML.svg)

OUTLINE

Observer Design Pattern

Scroll to Top

https://upload.wikimedia.org/wikipedia/commons/1/14/Prototype_UML.svg



This UML describes how a

prototype interface is used

to clone concrete

implementations.

To clone an object, a

constructor must exist to

instantiate the first object.

Next, by using the keyword

prototype variables and

methods bind to the

object’s structure. Let’s

look at a basic example:

var TeslaModelS = function() this.numWheels = 4; this.manufacturer = 'Tesla'; this.make = 'Model S';

TeslaModelS.prototype.go = function() // Rotate wheels

TeslaModelS.prototype.stop = function( // Apply brake pads



The constructor allows the

creation of a single

TeslaModelS object. When

a creating new

TeslaModelS object, it will

retain the states initialized

in the constructor.

Additionally, maintaining

the function go and stop is

easy since we declared

them with prototype. A

synonymous way to

extend functions on the

prototype as described

below:


TeslaModelS.prototype = go: function() // Rotate wheels , stop: function() // Apply brake pads

Revealing Prototype



Revealing PrototypePattern

Similar to Module pattern,

the Prototype pattern also

has a revealing variation.

The Revealing Prototype

Pattern provides

encapsulation with public

and private members

since it returns an object

literal.

Since we are returning an

object, we will prefix the

prototype object with a

function. By extending

our example above, we

can choose what we want

to expose in the current

prototype to preserve

their access levels:




TeslaModelS.prototype = function()

var go = function() // Rotate wheels ;

var stop = function() // Apply brake pads ;

return pressBrakePedal: stop, pressGasPedal: go

();

Note how the functions

stop and go will be

shielded from the

returning object due to

being outside of returned

object’s scope. Since

JavaScript natively

supports prototypical



inheritance, there is no

need to rewrite underlying

features.

There are many times

when one part of the

application changes, other

parts needs to be updated.

In AngularJS, if the $scope

object updates, an event

can be triggered to notify

another component. The

observer pattern

incorporates just that – if

an object is modified it

broadcasts to dependent

objects that a change has

occurred.

Another prime example is

the model-view-controller

(MVC) architecture; The

view updates when the

model changes. One

Observer DesignPattern



benefit is decoupling the

view from the model to

reduce dependencies.

Observer Design Pattern

on Wikipedia

(https://upload.wikimedia.

org/wikipedia/commons/t

humb/8/8d/Observer.svg/

1000px-Observer.svg.png)

As shown in the UML

diagram, the necessary

objects are the subject,

observer, and concrete

objects. The subject

contains references to the

concrete observers to

notify for any changes. The

Observer object is an

abstract class that allows

https://upload.wikimedia.org/wikipedia/commons/thumb/8/8d/Observer.svg/1000px-Observer.svg.png



for the concrete observers

to implements the notify

method.

Let’s take a look at an

AngularJS example that

encompasses the observer

pattern through event

management.

// Controller 1$scope.$on('nameChanged', function(event $scope.name = args.name;);

...

// Controller 2$scope.userNameChanged = function(name $scope.$emit('nameChanged', name:;

With the observer pattern,

it is important to

distinguish the

independent object or the

subject.



It is important to note that

although the observer

pattern does offer many

advantages, one of the

disadvantages is a

significant drop in

performance as the

number of observers

increased. One of the most

notorious observers is

watchers. In AngularJS, we

can watch variables,

functions, and objects. The

$$digest cycle runs and

notifies each of the

watchers with the new

values whenever a scope

object is modified.

We can create our own

Subjects and Observers in

JavaScript. Let’s see how

this is implemented:



var Subject = function() this.observers = [];

return subscribeObserver: function(observer this.observers.push(observer); , unsubscribeObserver: function(observer var index = this.observers.indexOf if(index > -1) this.observers.splice(index, 1 , notifyObserver: function(observer) var index = this.observers.indexOf if(index > -1) this.observers[index].notify(index , notifyAllObservers: function() for(var i = 0; i < this.observers this.observers[i].notify(i); ; ;;

var Observer = function() return notify: function(index) console.log("Observer " + index

var subject = new Subject();

var observer1 = new Observer();var observer2 = new Observer();



var observer3 = new Observer();var observer4 = new Observer();

subject.subscribeObserver(observer1);subject.subscribeObserver(observer2);subject.subscribeObserver(observer3);subject.subscribeObserver(observer4);

subject.notifyObserver(observer2); // Observer 2 is notified!

subject.notifyAllObservers();// Observer 1 is notified!// Observer 2 is notified!// Observer 3 is notified!// Observer 4 is notified!

Publish/Subscribe

The Publish/Subscribe

pattern, however, uses a

topic/event channel that

sits between the objects

wishing to receive

notifications (subscribers)

and the object firing the

event (the publisher). This

event system allows code

to define application-

specific events that can

pass custom arguments

containing values needed



by the subscriber. The idea

here is to avoid

dependencies between the

subscriber and publisher.

This differs from the

Observer pattern since any

subscriber implementing

an appropriate event

handler to register for and

receive topic notifications

broadcast by the

publisher.

Many developers choose

to aggregate the

publish/subscribe design

pattern with the observer

though there is a

distinction. Subscribers in

the publish/subscribe

pattern are notified

through some messaging

medium, but observers

are notified by

implementing a handler

similar to the subject.



In AngularJS, a subscriber

‘subscribes’ to an event

using $on(‘event’, callback),

and a publisher ‘publishes’

an event using

$emit(‘event’, args) or

$broadcast(‘event’, args).

A Singleton only allows for

a single instantiation, but

many instances of the

same object. The Singleton

restricts clients from

creating multiple objects,

after the first object

created, it will return

instances of itself.

Finding use cases for

Singletons is difficult for

most who have not yet

used it prior. One example

is using an office printer. If

there are ten people in an

office, and they all use one

printer, ten computers

Singleton



share one printer

(instance). By sharing one

printer, they share the

same resources.



var printer = (function ()

var printerInstance;

function create ()

function print() // underlying printer mechanics

function turnOn() // warm up // check for paper

return // public + private states and behaviors print: print, turnOn: turnOn ;

return getInstance: function() if(!instance) instance = create(); return instance; ;

function Singleton () if(!instance) instance = intialize(); ;

)();



The create method is

private because we do not

want the client to access

this, however, notice that

the getInstance method is

public. Each officer worker

can generate a printer

instance by interacting

with the getInstance

method, like so:

var officePrinter = printer.getInstance

In AngularJS, Singletons

are prevalent, the most

notable being services,

factories, and providers.

Since they maintain state

and provides resource

accessing, creating two

instances defeats the point

of a shared

service/factory/provider.



Race conditions occur in

multi-threaded

applications when more

than one thread tries to

access the same resource.

Singletons are susceptible

to race conditions, such

that if no instance were

initialized first, two threads

could then create two

objects instead of

returning and instance.

This defeats the purpose

of a singleton. Therefore,

developers must be privy

to synchronization when

implementing singletons

in multithreaded

applications.

Design patterns are

frequently used in larger

applications, though to

understand where one

Conclusion



might be advantageous

over another, comes with

practice.

Before building any

application, you should

thoroughly think about

each actor and how they

interact with one another.

After reviewing the

Module, Prototype,

Observer, and Singleton

design patterns, you

should be able to identify

these patterns and use

them in the wild.

Scotchmas Day 2Giveaway



Scotch mug

This contest is no longer accepting entries.

IT'SOVER! 2,137 0/11




(https://scotch.io/author/devan)

DEVAN PATEL(HTTPS://SCOTCH.IO/AUTHOR/DEVAN)

(@DEVANP92(HTTPS://TWITTER.COM/DEVANP92))I'm an avid Javascript developer

which I write about here(http://www.devanpatel.me). Feel

free to reach out to me on myTwitter

(https://twitter.com/devanp92) orcheck out the projects I work on

at my Github(https://github.com/devanp92)! View My Articles (https://scotch.io/author/devan)




http://www.devanpatel.me/


https://github.com/devanp92




READ NEXT

(https://scotch.io/tutorials/building-your-own-javascript-

modal-plugin)

BUILDINGYOUR OWNJAVASCRIPT

MODALPLUGIN

(HTTPS://SCOTCH.IO/TUTORIALS/BUILDING-YOUR-OWN-JAVASCRIPT-

MODAL-PLUGIN)

(https://scotch.io/bar-talk/s-o-l-i-d-the-first-five-principles-of-

object-

S.O.L.I.D:THE FIRST 5PRINCIPLESOF OBJECTORIENTED

DESIGN(HTTPS://SCOTCH.IO/BAR-TALK/S-O-L-

I-D-THE-FIRST-FIVE-

PRINCIPLES-OF-OBJECT-ORIENTED-

DESIGN)

(https://scotch.io/bar-talk/angular-material-vs-

material-design-lite)

ANGULARMATERIAL

VS.MATERIAL

DESIGN LITE(HTTPS://SCOTCH.IO/BAR-TALK/ANGULAR-

(https://scotch.io/bar-talk/changes-and-reasons-behind-the-new-scotch-

CHANGESAND

REASONSBEHIND THE

NEWSCOTCH.IO

DESIGN

https://scotch.io/tutorials/building-your-own-javascript-modal-plugin

https://scotch.io/tutorials/building-your-own-javascript-modal-plugin

https://scotch.io/bar-talk/s-o-l-i-d-the-first-five-principles-of-object-oriented-design

https://scotch.io/bar-talk/s-o-l-i-d-the-first-five-principles-of-object-oriented-design

https://scotch.io/bar-talk/angular-material-vs-material-design-lite


https://scotch.io/bar-talk/changes-and-reasons-behind-the-new-scotch-io




MATERIAL-VS-

MATERIAL-DESIGN-

LITE)

(HTTPS://SCOTCH.IO/BAR-TALK/CHANGES-

AND-REASONS-BEHIND-

THE-NEW-SCOTCH-IO)

(https://scotch.io/bar-talk/scotchmas-

day-5-chromecast-

jedi-bath-

SCOTCHMASDAY 5 –

CHROMECAST,JEDI BATH

ROBES, ANDSTAR WARSCODEPENS

(HTTPS://SCOTCH.IO/BAR-TALK/SCOTCHMAS-

DAY-5-CHROMECAST-JEDI-BATH-

ROBES-AND-STAR-WARS-CODEPENS)

(https://scotch.io/tutorials/google-material-

design-input-boxes-in-

css3)

GOOGLEMATERIAL

DESIGNINPUT

BOXES INCSS3

(HTTPS://SCOTCH.IO/TUTORIALS/GOOGLE-MATERIAL-

DESIGN-INPUT-

BOXES-IN-CSS3)

scotch.io books presents:

MEAN MACHINE



https://scotch.io/bar-talk/scotchmas-day-5-chromecast-jedi-bath-robes-and-star-wars-codepens

https://scotch.io/bar-talk/scotchmas-day-5-chromecast-jedi-bath-robes-and-star-wars-codepens

https://scotch.io/tutorials/google-material-design-input-boxes-in-css3

https://scotch.io/tutorials/google-material-design-input-boxes-in-css3



SUBSCRIBE(HTTPS://SCOTCH.IO/FEED)

FOLLOW(HTTP://TWITTER.COM/SCOTCH_IO)

LIKE(HTTP://WWW.FACEBOOK.COM/SCOTCHDEVELOPMENT)

+1(HTTP://PLUS.GOOGLE.COM/B/113854128330570384219/+SCOTCHIO/POSTS)

(https://leanpub.com/mean-machine)Learn Node, Angular, Express,and MongoDB from scratch.No experience necessary.

Learn About the Book (https://leanpub.com/mean-machine)

https://scotch.io/feed

http://twitter.com/scotch_io

http://www.facebook.com/scotchdevelopment

http://plus.google.com/b/113854128330570384219/+ScotchIo/posts

https://leanpub.com/mean-machine




Get valuable tips, articles, andresources straight to your inbox.

Every Tuesday.

Email Address

Subscribe

Comments Community Login1

Share⤤ Sort by Best

Join the discussion…

• Reply •

skube • 5 days ago

In your very first example you have:

return : // declare public variables and/or

Shouldn't there be no colon?

2

• Reply •

Devan Patel • 8 hours ago

> skube

Hi Skube,

First off, thanks for reading thearticle.

You are correct there should notbe a colon. I will reedit the post.

Thank you!

skube • 8 hours ago

> Devan Patel

Np. Obviously, you knowwhat you are doing and itwas a simple typo. I just pointit out for people like me who

Recommend 5

Share ›

Share ›

https://disqus.com/home/forums/scotchwebdevelopment/

https://disqus.com/home/inbox/

https://disqus.com/by/skube/

https://scotch.io/bar-talk/4-javascript-design-patterns-you-should-know#comment-2411181040

https://disqus.com/by/devanp92/











• Reply •

it out for people like me whoeasily get confused.

• Reply •

Sergey Voloshin • 4 days ago

JavaScript! It'll run the world!

1

• Reply •

gocreating • a day ago

Javascript awesome!!

• Reply •

Leonid Kolomiytsev • 3 days ago

Thanks, helpful information)

• Reply •

Tarun Garg • 4 days ago

Javascript its the next big thing...:D...var myFavLanguage="javascript";It will rule the world...x)

• Reply •

Chris Mathews • 4 days ago

Javascript, Python & R

• Reply •

Hisham • 4 days ago

Java & JS :))

• Reply •

Artsiom • 4 days ago

JavaScript rulezzz! :))

• Reply •

Anastasia Smirnova • 4 days ago

JS of course :)

• Reply •

M. Onur Çelik • 4 days ago

Javascript

• Reply •

Miguel Leite • 4 days ago

JavaScript :)

SerzN1 • 4 days ago

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

https://disqus.com/by/sergey_voloshin/


https://disqus.com/by/gocreating/


https://disqus.com/by/kolomiytsev/


https://disqus.com/by/disqus_JfhGM6UBY8/


https://disqus.com/by/disqus_Y1ADEBPdQo/



https://disqus.com/by/disqus_cZs0Tm0iea/


https://disqus.com/by/nsmirnova/


https://disqus.com/by/monurelik/


https://disqus.com/by/miguelleite/


https://disqus.com/by/disqus_TtVEFFpgqZ/


https://disqus.com/by/sergey_voloshin/

https://disqus.com/by/gocreating/

https://disqus.com/by/kolomiytsev/

https://disqus.com/by/disqus_JfhGM6UBY8/

https://disqus.com/by/disqus_Y1ADEBPdQo/

https://disqus.com/by/disqus_cZs0Tm0iea/

https://disqus.com/by/nsmirnova/

https://disqus.com/by/monurelik/

https://disqus.com/by/miguelleite/




• Reply •

SerzN1 • 4 days ago

"Revealing Prototype Pattern" wrong codeblock!

• Reply •

Marco Guglielmelli • 4 days ago

JavaScript! :)

• Reply •

Yves Schleich • 4 days ago

A good day has to start with scotch!

• Reply •

Mafisz • 4 days ago

PHP

• Reply •

Sarah • 4 days ago

Always bet on JS ;)

• Reply •

mkdudeja • 4 days ago

document.getElementById("scotchmasday2giveaway").innerHTML ="JAVASCRIPT"

• Reply •

Elton Vincent • 4 days ago

JS FTW!

• Reply •

Rodrigo Moreno • 4 days ago

Javascript FTW!

• Reply •

chadlefort • 4 days ago

JavaScript!

• Reply •

JD • 4 days ago

Javascript!!

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›




https://disqus.com/by/yvesschleich/


https://disqus.com/by/mafisz/


https://disqus.com/by/disqus_ttYS9bMh79/


https://disqus.com/by/mkdudeja/


https://disqus.com/by/eltonvincent/



https://disqus.com/by/chadlefort/


https://disqus.com/by/disqus_W9yre4939o/



https://disqus.com/by/yvesschleich/

https://disqus.com/by/mafisz/

https://disqus.com/by/disqus_ttYS9bMh79/

https://disqus.com/by/mkdudeja/

https://disqus.com/by/eltonvincent/

https://disqus.com/by/chadlefort/

https://disqus.com/by/disqus_W9yre4939o/



• Reply •

• Reply •

Rhadow • 4 days ago

JavaScript!

• Reply •

Yomi • 4 days ago

Javascript baby!

• Reply •

Matt • 4 days ago

Javascript!

• Reply •

Tiago Winehouse • 4 days ago

JS.. NICE!!

• Reply •

Thibault Maekelbergh • 4 days ago

How is the prototype pattern even relevantwith everything ES6 gave us?

• Reply •

morsaPT • 4 days ago

Hey Devan. Awesome article!You have an issue on the Singleton patternexample. You are using `instance` ongetInstance method and the same onSingleton function when I guess you shouldbe using `printerInstance`. Can you check?Keep up writing! :)

• Reply •

Devan Patel • 8 hours ago

> morsaPT

Hi morsaPT,

Thanks for the kind words!

Kudos to you for pointing it out! Itshould be 'printerInstance' and not'instance'.

• Reply •

rio zagreb • 4 days ago

js ftw

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

https://disqus.com/by/Rhadow/


https://disqus.com/by/YomiElu/


https://disqus.com/by/disqus_uh8PThHv0Y/


https://disqus.com/by/tiagowinehouse/


https://disqus.com/by/thibaultmaekelbergh/


https://disqus.com/by/morsaPT/





https://disqus.com/by/riozagreb/


https://disqus.com/by/Rhadow/

https://disqus.com/by/YomiElu/

https://disqus.com/by/disqus_uh8PThHv0Y/

https://disqus.com/by/tiagowinehouse/

https://disqus.com/by/thibaultmaekelbergh/

https://disqus.com/by/morsaPT/


https://disqus.com/by/riozagreb/



• Reply •

Nick • 4 days ago

Javascript for the win!

• Reply •

Davor B. • 4 days ago

javascript

• Reply •

Djordje Andzic • 4 days ago

My favorite programming language isjavascript.

• Reply •

Nick Graz • 4 days ago

My favorite language is PHP

• Reply •

Sotiris Katsaniotis • 5 days ago

My favorite programming language is PHP

• Reply •

Rizqy Hidayat • 5 days ago

just getting deeper on javascript. thanks!

• Reply •

Dill • 5 days ago

Definitely JavaScript

• Reply •

FleetNavTech • 5 days ago

AngularJS.

• Reply •

Jonathan Obino • 5 days ago

JS FTW!

• Reply •

Nicole Lambon • 5 days ago

JavaScript, HTML, and CSS FTW!

• Reply •

Amir Tugendhaft • 5 days ago

Python, the love of my life ♥

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

https://disqus.com/by/disqus_hSkKqG6360/


https://disqus.com/by/buda90/


https://disqus.com/by/djordjeandzic/


https://disqus.com/by/nickgraz/


https://disqus.com/by/youtruckadmin/


https://disqus.com/by/rizqyhi/


https://disqus.com/by/disqus_mWYpmwCkKP/


https://disqus.com/by/fleetnavtech/


https://disqus.com/by/jonathanobino/


https://disqus.com/by/nicolelambon/


https://disqus.com/by/amirtugendhaft/


https://disqus.com/by/disqus_hSkKqG6360/

https://disqus.com/by/buda90/

https://disqus.com/by/djordjeandzic/

https://disqus.com/by/nickgraz/

https://disqus.com/by/youtruckadmin/

https://disqus.com/by/rizqyhi/

https://disqus.com/by/disqus_mWYpmwCkKP/

https://disqus.com/by/fleetnavtech/

https://disqus.com/by/jonathanobino/

https://disqus.com/by/nicolelambon/

https://disqus.com/by/amirtugendhaft/



• Reply •

Jairo Jurado • 5 days ago

JavaScript is my favorite language. Talkabout Front and BackEnd developmentwith one language!

• Reply •

Justin Sane • 5 days ago

Choose Javascript for so much WIN!

• Reply •

Cody • 5 days ago

JavaScript is what I use most but I have tosay I am enjoying Ruby the most.

• Reply •

Владимир Кунин • 5 days ago

JS!

• Reply •

JohnH • 5 days ago

PHP is my language of choice.

• Reply •

Mario Gómez • 5 days ago

My favorite programming language isJavaScript!

• Reply •

Kostas Kapenekakis • 5 days ago

Thanks!

Renan Borges • 5 days ago

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

Share ›

License (/license)

Advertise with Us (/advertise)

About (/about)

Join Us on Slack (https://scotch-slack.herokuapp.com/)

https://disqus.com/by/jairojurado/


https://disqus.com/by/disqus_FZzxUarqSP/


https://disqus.com/by/disqus_3KIodCPUgh/


https://disqus.com/by/disqus_wcb9YO6wPC/


https://disqus.com/by/Calysson/


https://disqus.com/by/disqus_gqDoW8UPAR/


https://disqus.com/by/kostaskapenekakis/


https://disqus.com/by/renanborgez/


https://disqus.com/by/jairojurado/

https://disqus.com/by/disqus_FZzxUarqSP/

https://disqus.com/by/disqus_3KIodCPUgh/

https://disqus.com/by/disqus_wcb9YO6wPC/

https://disqus.com/by/Calysson/

https://disqus.com/by/disqus_gqDoW8UPAR/

https://disqus.com/by/kostaskapenekakis/

https://disqus.com/by/renanborgez/

https://scotch.io/license

https://scotch.io/advertise

https://scotch.io/about

https://scotch-slack.herokuapp.com/



Web design and development tutorials for the masses.

© Scotch.io | Proudly hosted by Digital Ocean (https://www.digitalocean.com/?refcode=eaf67777e85b)

Store (http://shop.scotch.io)

Write for Us (/write-for-us)

Contact Us (/contact-us)

JOIN THE NEWSLETTER

Web design/development tutorials and news from around the web.

Email Address

Subscribe

Hire Us (http://bit.ly/18ib8jR)

(https://leanpub.com/mean-machine)

LEARN NODE AND ANGULAR

Scotch's new JavaScript eBook. Learn the full JavaScript stack.

Get the Book (https://leanpub.com/mean-machine)

https://www.digitalocean.com/?refcode=eaf67777e85b

http://shop.scotch.io/

https://scotch.io/write-for-us

https://scotch.io/contact-us

http://bit.ly/18ib8jR



4 javascript design patterns you should know (+ scotchmas day 2) _ scotch

Documents