5.2 Factory Fonction
The object literal syntax is convenient, but it falls apart as soon as you need several similar objects. If you copy the same circle definition to create circle2, you also duplicate the draw method. With one trivial line it doesn't matter, but with ten lines of logic, every bug fix would have to be applied in multiple places. We need a better pattern. The first one is the factory function.
A factory function is like a small factory that produces objects. We move the object literal inside a function and return it:
function createCircle(radius) {
return {
radius,
draw() {
console.log("draw");
}
};
}
const circle1 = createCircle(1);
const circle2 = createCircle(2);
circle1.draw();
Modern ES6 shortcuts used here
- Shorthand property: when the key and the variable share the same name (
radius: radius), we just writeradius. - Method shorthand: instead of
draw: function () { ... }, we can writedraw() { ... }directly inside the object. - Single return statement — we don't need an intermediate constant, we just return the object literal.
Thanks to the parameters, every call to createCircle returns a new circle with its own radius, while sharing one single source of truth for the draw method. If the implementation of draw ever needs to change, you only fix it in one place. Factory functions are not the only way to create objects in JavaScript — constructor functions also exist, and they are the topic of the next video.
Summary
This lesson introduces factory functions as a solution to code duplication when creating multiple objects with shared logic. A factory function is a regular function that returns a new object, allowing you to parameterize object creation and keep implementation details in a single location. The lesson demonstrates how factory functions eliminate the need to repeat object definitions and simplify bug fixes, using a practical example with a circle object that includes a console logging method.
Key points
- Factory functions solve code duplication by centralizing object creation logic in a reusable function
- Factory functions accept parameters (like radius) to create customized objects with different values
- Using factory functions means fixing bugs in object methods only requires updating one location, not multiple
- Modern JavaScript shorthand syntax (property shorthand and method shorthand) makes factory functions more concise
- Each call to a factory function creates a new independent object with the provided parameter values
- Factory functions are an alternative to object literal syntax when you need to create multiple similar objects
FAQ
What problem do factory functions solve?
Factory functions solve code duplication. Without them, creating multiple similar objects using literal syntax forces you to repeat the same implementation (methods and properties) multiple times. If you later find a bug in one of those methods, you must fix it in every duplicate location instead of just one place.
How do you create a basic factory function?
Define a function (like createCircle) that takes parameters and returns an object. Inside the function, create and return an object with the desired properties and methods, using the parameters to customize values. For example: function createCircle(radius) { return { radius, draw() { console.log('draw'); } }; }
What are the benefits of using factory functions over object literals?
Factory functions allow you to create multiple objects with different parameter values from a single function, eliminate code duplication, simplify maintenance (bugs are fixed in one place), and use modern JavaScript shorthand syntax to keep code concise.