Single Responsibility Principle – SOLID Principles

Hi Coders, Today we are going to discuss about Single Responsibility Principle – SOLID Principles which is a important concept in object oriented programming.

Before discussing Single Responsibility Principle, Lets understand what is S.O.L.I.D principles

What is S.O.L.I.D?

S.O.L.I.D is a acronym for 5 important concept of object oriented programming and code design provided by Uncle Bob (Robert C. Martin) by the year 2000. These rules help code to be structured and organized.

[S]ingle Responsibility Principle
[O]pen/Closed Principle
[L]iskov Substitution Principle
[I]nterface Segregation Principle
[D]ependency Inversion Principle

What is Single Responsibility Principle (SRP) ?

According to Uncle Bob

A class should have one, and only one, reason to change.

The first principle says that a class holds a single responsibility and have only one reaspon to change.

Lets see a example below

const guests = ['baLOO', 'chARliE', 'BEth'];

class Greeter {
    static greet(guests) {
        guests.map((guest) => {
            let guestName = guest.toLowerCase(); 
            guestName = guestName.charAt(0).toUpperCase() + guestName.slice(1);
            document.body.innerHTML += `<p>Hi ${guestName}!</p>`;
        })
    }
}

Greeter.greet(guests);

In the above example if you see class Greeter is taking guest list and changing names to lowercase

On second step it takes the first character and converts it to uppercase and printing the names.

The Greeter class here should be responsible for Greeting the guests but we have assigned more responsibilities to this class which is violation of SRP principle. If in future if we change anything in the Greeter class, this may be leads to change other code too.

To achive single responsibility principle we have to remove other responsibilities from Greeter class and inject it separately as shown below

const guests = ['baLOO', 'chARliE', 'BEth'];

class Formatter {
    static sentenceCase(string) {
        const lowerCaseString = this.lowerCase(string); 
        const capitalized = this.capitalize(lowerCaseString);
        
        return capitalized;
    }

    static lowerCase(string) {
        return string.toLowerCase();
    }
    
    static capitalize(string) {
        return string.charAt(0).toUpperCase() + string.slice(1);
    }
}

class Greeter {
    constructor(guests, GreetFormatter = Formatter) {
        this.guests = guests;
        this.formatter = GreetFormatter;
    }
    
    greet() {
        this.guests.map((guest) => {
            const formattedGuestName = this.formatter.sentenceCase(guest);
            this.sendGreeting(formattedGuestName)
        })
    }
    
    sendGreeting(name) {
        document.body.innerHTML += `<p>Hi ${name}!</p>`;
    }
}

const eventGreeter = new Greeter(guests);

eventGreeter.greet();

The above example shows how we have removed the guest list formatting from Greeter class and moved it to other class Formatter.

Formatter class has 3 methods . These methods are independent from each other.

Formatter class is injected in Greeter class for formatting. That’s the single responsibility pattern. If a class has only one responsibility, they tend to be more reusable, simpler, and propagate fewer changes to the system.

References :

https://codepen.io/allanpope/post/single-responsibility-principle