What Are Access Modifiers In JavaScript

JavaScript 2 mins read

Table of Content

    Introduction

    Access modifiers are keywords used to specify the declared accessibility of a member or a type.

    Let's discuss how access modifiers i.e. variables and methods are declared and accessed as Private, Public and Privileged in JavaScript.

    What is Access Modifiers?

    An access modifier is a keyword that we can apply to a member of a class to control its access from the outside.

    The followings are the access modifiers in most of the object-oriented programs.

    public, private and protected.

    Public Access Modifiers

    By default, all members (properties, fields, methods, or functions) of classes are public accessible from outside the class.

    For example:

    
    class Employee 
    {
    
        constructor(name: string)
        {
            this.employeeName = name
        }
    
        greet() {
            console.log(`Good Morning ${this.employeeName}`)
        }
    
    }
    
    let employee = new Employee('Ossama')
    
    employee.greet()
    
    

    Explanation:

    • We Define a public property called employeeName, and it's accessible from outside the class.

    • make a constructor with parameter has default type of string

    • make a greet method to say Good Morning to the employee :)

    After that, we define a variable to store the new instance of the Employee class on it, and call the greet method after that.

    Output:

    Good Morning Ossama

    Private Access Modifiers

    Private members can not accessible from outside the class, and it can access only internally within the class.

    Let's add a private method and try to access it outside the class

    class Employee 
    {
        constructor(name: string)
        {
            this.employeeName = name
        }
    
        greet() {
            console.log(`Good Morning ${this.employeeName}`)
        }
    
        private convertToString(num: number) {
            return num.toString()
        }
    }
    
    let employee = new Employee('Ossama')
    
    employee.convertToString(20)
    
    

    Explanation:

    In this case we're adding a private method called convertToString and its role is simply converted the number to string type. We tried to access it outside the class and here is the output:

    (method) Employee.convertToString(num:number): string
    property 'convertToString' is private and only accessible within class 'Employee'
    

    As you can see you can access the private (methods, properties ...) just inside the class and not outside.

    protected Access Modifiers

    Protected members are accessible only internally within the class or any class that extends it, but not externally.

    Meaning, you can access protected members only inside the class or when you extended the class

    Let's take a look at a practical example:

    class Employee 
    {
        public employeeName: string
    
        constructor(name: string)
        {
            this.employeeName = name
        }
    
        protected greet() {
            console.log(`Good Morning ${this.employeeName}`)
        }
    }
    

    here if you're trying to access greet method outside the class like this:

    let employee = new Employee('ossama')
    employee.greet()
    

    We can't and the compiler throw an error

    (method) Employee.greet(): void
    Property 'greet' is protected and only accessible within class 'Employee' and its subclasses
    

    So, in this case, we have two options to access the greet method:

    • within the class itself
    • within its subClasses

    Let's see an example at the second option:

    class Employee 
    {
        public employeeName: string
    
        constructor(name: string)
        {
            this.employeeName = name
        }
    
        protected greet() {
            console.log(`Good Morning ${this.employeeName}`)
        }
    }
    
    class Manager extends Employee 
    {
        public managerName: string
    
        constructor(managerName: string) {
            super(managerName) // super refer to the Employee constructor
        }
    
        managerGreet() {
            this.greet()
        }
    }
    
    let manager = new Manager('Ossama')
    
    manager.greet()
    
    manager.managerGreet()
    
    

    Explanation:

    In this case we create a new class extends the Employee class. When you extend a class it called inheritance, which mean you are borrowing its (properties, methods, ...etc.)

    So, is this situation:

    • You can't access greet directly from Manager class because it's protected method and inherited from Employee class and the method still protected.

    • You can access the greet method from ManagerGreet Because it's a public method and the greet protected method inside it, and this is the point from the example.

    Conclusion

    In this article we take a look at the access modifier public, private and protected.

    We can summarize everything in:

    • public: when you want to access the members everywhere in your application.
    • private: when you want to access the members only inside the class.
    • protected: when you want to access the members inside the class and its subclasses.

    Related Tags

    About the Author

    Oussama's Profile Picture
    Oussama
    Full Stack Web Developer

    I'm a full stack web developer and telecommunications engineer who love to share knowledge and build stuff online!


    Comments

    Join Our Newsletter

    Subscribe to Our Newsletter and never miss our offers, latest news, Articles, etc.

    Our news letter sent once a week, every tuesday.