tag : how to

JavaScript Templating: Adding HTML the Right Way

If you’ve been using JavaScript for any semi-substantial amount of time, you’ve probably had to add some HTML to your page dynamically. If you haven’t then you’re missing out on some of the greatest power of JavaScript. There’s a problem though: It’s a pain in the buttocks to write HTML code inside a JavaScript string – especially when it’s a large amount of HTML and/or some of the tags have attributes – and adding in values from variables. It’s just a giant mess of quotes and plus signs.

How and Why JZ Publish / Subscribe Should Be Used

If you don’t already know, JZ Publish/Subscribe is a jQuery plugin that I developed to add a simple, but powerful Pub/Sub feature to the jQuery utility functions. I’m guessing there are some people out there who don’t understand what Pub/Sub is, how to use it, or why to use it. I’m here to bring some answers and give a specific example of how JZ Publish/Subscribe can be used.

JavaScript Design Patterns: Proxy

This is the 9th installment of the JavaScript Design Patterns series and today we’re featuring the Proxy pattern. The word “proxy” can be defined as a substitute, and that essentially explains what a proxy is. A proxy is an object that has the same interface as another object and is used in place of that other object. The only question is why we would use a proxy instead of the original object.

JavaScript Design Patterns: Factory Part 2

In the last post, I started talking about the Factory Design Pattern, which creates objects for you, generally all of which follow the same interface. So far we’ve covered the Simple Factory, which creates this functionality in a Singleton object, which is the _simplest _way of creating a Factory, hence its nomenclature (I love that word). This time I’ll show you the true Factory.

JavaScript Design Patterns: Factory

Another post, another JavaScript design pattern. Today we feature the Factory pattern. The Factory pattern is one of my favorite patterns, especially the “simple factory”, which I’ll explain later. Factories – in real life as well as within the programming world – create objects. It helps clean up your code by removing all of the new operators.

JavaScript Design Patterns: Decorator

Today I’d like to show another JavaScript Design Pattern: the Decorator, which is a way to add features to objects without subclassing or adding extra attributes. This post continues the JavaScript Design Patterns series that I started several months ago. If you’re new to the JavaScript Design Patterns series that I’m running here, you can find a list of the previous and upcoming posts in the series at the bottom of the post.

JavaScript Design Patterns: Facade

In our 4th installment of the JavaScript Design Patterns Series, we’ll be taking a look at the Facade pattern. Whether you know it or not, I can almost guarantee that you’ve used the Facade pattern if you’ve been programming in any language for more than a second (that might be a bit of a hyperbole, but you’ll forgive me, right?). You can define the Facade pattern as a piece of code that simplifies a more complex interface. You can pretty much call any form of abstraction a facade. Have you ever made a named function that had more than one line of code within it? Yup, that’s technically an example of the Facade pattern.

JavaScript Design Patterns: Composite

My last post was about the Bridge Design Pattern, which continued the JavaScript Design Patterns series that started off with the Singleton. Today we’ve moved onto the Composite Pattern. Composites are quite useful. By definition of the word “composite”, Composites are _composed _of multiple parts to create one whole entity.

JavaScript Design Patterns: Bridge

In my last blog post article I discussed the Singleton Design Pattern and how it is used in JavaScript. This time around the Bridge design pattern is poking its head up and asking for a bit of attention, making it the second in the JavaScript Design Patterns series. Every place I’ve read about the Bridge pattern likes to quote the Gang of Four directly in their description of what the Bridge pattern is, so I figure why not me too? The Bridge pattern should “decouple an abstraction from its implementation so that the two can vary independently.” Bridges are quite beneficial in event-driven applications, which are quite common in JavaScript. Considering that fact, it’s surprisingly one of the most underused design patterns.

JavaScript Design Patterns: Singleton

This is the first in what should be a pretty long series about JavaScript design patterns. In 1995, Erich Game, Richard Helm, Ralph Johnson and John Vlissides (known as the Gang of Four) published Design Patterns: Elements of Reusable Object-Oriented Software, a book cataloging recurring solutions to common dilemmas in software architecture and design. It also started a common vocabulary for referring to these solutions. If you’d like to know more you can find it on Wikipedia.