Class vs Factory function: exploring the way forward

Cristian Salcescu
Frontend Essentials
5 min readMar 25, 2018

--

Photo by the author

ECMAScript 2015 (aka ES6) comes with the class syntax, so now we have two competing patterns for creating objects. In order to compare them, I’ll create the same object definition (TodoModel) as a class, and then as a factory function.

TodoModel as a Class

class TodoModel {
constructor(){
this.todos = [];
this.lastChange = null;
}

addToPrivateList(){
console.log("addToPrivateList");
}
add() { console.log("add"); }
reload(){}
}

TodoModel as a Factory Function

function TodoModel(){
var todos = [];
var lastChange = null;

function addToPrivateList(){
console.log("addToPrivateList");
}
function add() { console.log("add"); }
function reload(){}

return Object.freeze({
add,
reload
});
}

Encapsulation

The first thing we notice is that all members, fields, and methods of a class object are public.

var todoModel = new TodoModel();
console.log(todoModel.todos); //[]
console.log(todoModel.lastChange) //null
todoModel.addToPrivateList(); //addToPrivateList

The lack of encapsulation may create security problems. Take the example of a global object that…

--

--