Click here to Skip to main content
15,875,017 members
Articles / Programming Languages / Javascript
Tip/Trick

How to use Javascript as OOPS for beginner

Rate me:
Please Sign up or sign in to vote.
4.82/5 (10 votes)
22 Nov 2010CPOL2 min read 24.8K   8   5
Javascript
Hello,
This is my first tips and trick for codeproject. So I decides start from very basic tips on javascript. As most of the beginner developer use javascript something like
<script type="text/javascript">
function product(a,b)
{
return a*b;
}
</script>
</head>
<body>
<script type="text/javascript">
document.write(product(4,3));
</script>


This is very basic style to make fucntion and expose that function in different function like in above example function product(a,b) is directly call in body javascript.

This is very simple approach to use javascript. Let try to learn Javascript in more generic term. I will give demo in steps

Step 1: First i would recommend to make external javascript rather then in same html header although this is not mandatory. But for good coding practices Javascript should be separated in file.
Step 2: Create airthmaticOp.js
function airthmaticOperation()
{
}

Step3: as you can see in step 2, i create airthmaticOpration function which in this step i will treated function like a class.
hmmm.. So as you know in class there are methods, so how i can make methods in javascript for my class airthmaticOpration. In javascript special keyword prototype is used in order to make method for class.The prototype object is here to help when you wish to quickly add a custom property to an object that is reflected on all instances of it. To use this object, simply reference the keyword "prototype" on the object before adding the custom property to it, and this property is instantly attached to all instances of the object. A demonstration is worth a thousand words, so I'll show one right now , how to use it in my class airthmaticOperation
airthmaticOperation.prototype.addition = function(a,b)
{
  return a+b;
}

airthmaticOperation.prototype.multiply = function(a,b)
{
  return a*b;
}


Step 4: That looking cool Now how to use it in my function.

first you have to make object as you make in simple class like
var objMyClass = new aithmaticOperation();


Object is created and Now you are ready to access method of my class airthmaticOperation

var resultAdd = objMyClass.addition(a,b);

var resultMul = objMyClass.multiply(a,b);


That's all about it. Its very good approach to make complex javascript and scalable like as OOPS.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Technical Lead
United States United States
Rohit started Embedded Programing in his college days and now he is a Software Developer by Profession. Mainly he interested in cutting edge technology offer by Microsoft (i.e Azure,MVC). He Loves coding and his passion is always been towards Microsoft Technologies. Apart from coding his other hobbies include reading books and hang out with friends is his most favorite past time hobby.


1. 20 Apr 2014: Best Mobile Article of March 2014 - First Prize

Comments and Discussions

 
GeneralReason for my vote of 5 Very good article to understand the ... Pin
Anjum.Rizwi10-Dec-11 19:39
professionalAnjum.Rizwi10-Dec-11 19:39 
GeneralThanks Abdur Pin
maq_rohit7-Feb-11 22:10
professionalmaq_rohit7-Feb-11 22:10 
GeneralBrilliant help for a beginer. Pin
Abdur Rashid7-Feb-11 18:02
professionalAbdur Rashid7-Feb-11 18:02 
GeneralReason for my vote of 5 great post and article for beginner.... Pin
hugevishal22-Nov-10 6:18
hugevishal22-Nov-10 6:18 
GeneralReason for my vote of 4 I like this article, easy to underst... Pin
300521804622-Nov-10 3:52
300521804622-Nov-10 3:52 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.