JavaScript Linux PHP All
Up

Search



Structure Your JavaScript Code - Part 2






Recent




PHP MySQL Pagination

PHP MySQL pagination is used to partition the data from the database to navigate the webpage easier and faster....


How To Use VPS Servers

You will learn how to use VPS servers correctly via the commands without the need of any interface or control panel....


Get Your Own Virtual Server Hosting

Virtual servers are widely used to host websites due to the great features they provide and the cheap costs....


PHP Database Connection

By having a PHP database connection for your program, it will be easy to append and retrieve records and save the statuses of your program....


Create A JavaScript Object Oriented Code

By having a JavaScript object oriented code, your program will be more clear and well structured....


Detailed Example Of A JavaScript Object Oriented Code


Detailed Example Of A JavaScript Object Oriented Code
918   javascript

Learn how to use the properties and methods in the object oriented code and how to call the methods from inside and outside the mother object.



As we discussed in the previous article and explained how can we make a well structured code in JavaScript that doesn't interfere with other scripts, we will go further in this article and will show you a detailed example about sorting the object elements and recall them within our code.


Messaging System Example

Let us assume that we have a messaging system and we want to build a code to manage our system in a very organized way. Our main object is messages which is the mother object. The mother object will contain the Properties and the Functions. We have three properties to define the max limit for the inbox, sent and draft folders and they are:

1.   maxInboxLimit


2.   maxSentLimit


3.   maxDraftLimit


And we have three functions to output the value of the max limit for each folder:

1.   getMaxInboxLimit


2.   getMaxSentLimit


3.   getMaxDraftLimit


Below is the complete code that shows the interaction between the Functions and the Properties within the mother object:


// The mother object
var messages = {};

// Properties related to the mother object "messages"
messages.maxInboxLimit = 100;
messages.maxSentLimit  = 75;
messages.maxDraftLimit = 200;

// First method to output the max inbox limit
messages.getMaxInboxLimit = function(){
// The output result will be: 100
alert(this.maxInboxLimit);
};

// Second method to output the max sent limit
messages.getMaxSentLimit = function(){
// The output result will be: 75
alert(this.maxSentLimit);
};

// Third method to output the max draft limit
messages.getMaxDraftLimit = function(){
// The output result will be: 200
alert(this.maxDraftLimit);
};

// To call the methods
messages.getMaxInboxLimit();
messages.getMaxSentLimit();
messages.getMaxDraftLimit();


How The Code Works

In this code, we are calling the methods(function) to get the max limit for inbox, sent and draft folders in the messaging system. Inside the function implementation, we are outputting the max limit for each folder via the command "alert".

So as you see, when we call the properties from inside the mother object scope, we use 'this' which means this mother object (messages), but notice that we used the prefix 'messages' when we called the methods from outside the mother object scope and if we use this it will not work out, while using the prefix messages from inside the mother object works out fine!


Our code is very organized now, we are following the JavaScript object oriented approach, we can add more properties and methods to the mother object. Also, we can create new objects with new properties and methods and have interaction between the objects and their properties and functions to serve the program needs.













Home · About · Contact · Terms · Company Website

· · · ·