Should I be using a Class or an Object Literal when implementing a singleton in JS?

Question

I often find myself needing to use a singleton based pattern when creating web apps with typescript and react. Previously I have always implemented these with object literals like so:

interface IExample {
    var_one: string;
    var_two: boolean;

    func_one: () => void;
    func_two: () => void;
}

const Example:IExample = {
    var_one: "",
    var_two: false,

    func_one() {
        return;
    },

    func_two() {
        return;
    }
}

I would much prefer to use a class based system but am wondering if there are any downsides to this or what are the pros and cons of each. An example would be:

class ExampleClass
{
    private static _instance:ExampleClass = new ExampleClass();

    constructor() {
        if(ExampleClass._instance){
            throw new Error("Instance already created");
        }
        ExampleClass._instance = this;
    }
}

I have previously only really used the object literal pattern in my code but would much prefer to use the class based system if there is little difference between the two.

Thanks! I actually used your example to convert from a class to an object literal as I prefer the other way around! — NickJ
– NickJ, Commented Jul 20, 2024 at 1:25

Daniel Greaves · Accepted Answer · 2022-12-23 09:09:16Z

1

You might be interested to learn that modules are already singletons, so you can leverage the module system to achieve what you need.

export class MyClass {
  constructor(readonly foo: string) {}
}

export const instance = new MyClass("bar");

In your consuming modules, you can import either the class, or your singleton instance.

import { instance } from "./lib";

instance.foo // bar

answered Dec 23, 2022 at 9:09

Daniel Greaves

9875 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Brandon · Accepted Answer · 2022-12-23 02:24:07Z

0

I would agree with preferring to use a Class. I can think of a few distinct advantages that Classes offer that using pojo don't:

Private a protected methods/members.
Inheritance. If you need to define a similar object you can extend and super your way into it very quickly and easily.
Simpler syntax for object factory behavior.

I would say that the more complex you plan on making it- the more obvious a choice a Class becomes. In javascript- nearly everything is already an Object and Classes just add a couple shortcuts. The only advantage using a pojo would give is simplicity in syntax.

answered Dec 23, 2022 at 2:24

Brandon

3792 silver badges8 bronze badges

Collectives™ on Stack Overflow

Should I be using a Class or an Object Literal when implementing a singleton in JS?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related