JavaScript Encapsulation

The JavaScript Encapsulation is a process of binding the data (i.e. variables) with the functions acting on that data. It allows us to control the data and validate it. To achieve an encapsulation in JavaScript: -

• Use var keyword to make data members private.
• Use setter methods to set the data and getter methods to get that data.

The encapsulation allows us to handle an object using the following properties:

Read/Write - Here, we use setter methods to write the data and getter methods read that data.

Read Only - In this case, we use getter methods only.

Write Only - In this case, we use setter methods only.

JavaScript Encapsulation Example

Let's see a simple example of encapsulation that contains two data members with its setter and getter methods.

1. <script>  
2. class Student  
3.   {  
4.     constructor()  
5.     {  
6.        var name;  
7.        var marks;  
8.     }  
9.         getName()  
10.         {  
11.           return this.name;  
12.         }  
13.       setName(name)  
14.       {  
15.         this.name=name;  
16.       }  
17.         
18.       getMarks()  
19.       {  
20.         return this.marks;  
21.       }  
22.     setMarks(marks)  
23.     {  
24.       this.marks=marks;  
25.     }  
26.   
27.     }  
28.     var stud=new Student();  
29.      stud.setName("John");  
30.      stud.setMarks(80);  
31.      document.writeln(stud.getName()+" "+stud.getMarks());  
32. </script>  

Output:

John 80

JavaScript Encapsulation Example: Validate

In this example, we validate the marks of the student.

1. <script>  
2. class Student  
3.   {  
4.     constructor()  
5.     {  
6.        var name;  
7.        var marks;  
8.     }  
9.         getName()  
10.         {  
11.           return this.name;  
12.         }  
13.       setName(name)  
14.       {  
15.         this.name=name;  
16.       }  
17.         
18.       getMarks()  
19.       {  
20.         return this.marks;  
21.       }  
22.     setMarks(marks)  
23.     {  
24.         if(marks<0||marks>100)  
25.         {  
26.           alert("Invalid Marks");  
27.         }  
28.       else  
29.         {  
30.           this.marks=marks;  
31.         }  
32.     }  
33.     }  
34.     var stud=new Student();  
35.      stud.setName("John");  
36.      stud.setMarks(110);//alert() invokes  
37.      document.writeln(stud.getName()+" "+stud.getMarks());  
38. </script>  

Output:

John undefined

JavaScript Encapsulation Example: Prototype-based approach

Here, we perform prototype-based encapsulation.

1. <script>  
2. function Student(name,marks)  
3. {  
4.   var s_name=name;  
5.   var s_marks=marks;  
6.   Object.defineProperty(this,"name",{  
7.     get:function()  
8.     {  
9.       return s_name;  
10.     },  
11.   set:function(s_name)  
12.   {  
13.     this.s_name=s_name;  
14.   }  
15.     
16. });  
17.    
18.     Object.defineProperty(this,"marks",{  
19.     get:function()  
20.     {  
21.       return s_marks;  
22.     },  
23.   set:function(s_marks)  
24.   {  
25.     this.s_marks=s_marks;  
26.   }  
27.     
28. });  
29.     
30. }  
31.   var stud=new Student("John",80);  
32.   document.writeln(stud.name+" "+stud.marks);  
33. </script>  

Output:

John 80