Prototype Based Programming pada Javascript

posted Nov 13, 2011, 1:27 AM by Editor KursusInternet   [ updated Dec 13, 2011, 8:52 AM ]

Pendahuluan

Javascript mendukung apa yang dinamakan dengan Prototype Based Programming, yaitu penggunaan object yang tidak memerlukan pendefinisian class.

Dengan penggunaan prototype yang terdapat pada tiap object Javascript maka satu/beberapa function dan property dapat dibuat dan dirubah ke object terkait pada saat runtime. Sifat yang sangat dynamic ini menjadi basis berbagai framework Javascript.

Contoh Penggunaan

Pada artikel ini, penulis memutuskan untuk tidak menerangkan dengan detil object oriented pada Javascript dan konsep di balik prototype. Namun akan diberikan contoh penggunaan pada dokumen HTML yang cukup komprehensif sehingga developer dapat mendapatkan insight penggunaan prototype ini dengan lebih baik. 


contoh_prototype_01.html

<html> <head> <title>Contoh Prototype - 01</title> </head> <body> <h1>Contoh Penggunaan Prototype</h1>     <script type="text/javascript">         function kali(x, y )         {             return x * y;         }         
        document.write("3 x 2 = " + kali(3,2) + "<BR />");         document.write("kali.prototype.constructor = " + kali.prototype.constructor + "<BR />");
        //Membuat objek dari function kali()         var objKali = new kali(3,3);         document.write("objKali = " + objKali + "<BR />");         document.write("objKali.prototype = " + objKali.prototype + "<BR />");         document.write("objKali.constructor = " + objKali.constructor + "<BR/>");         //Menambahkan property & method dengan prototype         kali.prototype.var1 = "halo"; //menambahkan property var1         kali.prototype.kuadrat = function (x) {             return x * x;         };         //karena objKali merupakan objek dari kali         // maka property var1 dan method kuadrat         // dapat digunakan         document.write("objKali.var1 = " + objKali.var1 + "<BR />");         document.write("objKali.kuadrat(5) = " + objKali.kuadrat(5) + "<BR />");         var objKali2 = { x : 5 };         objKali2.prototype = kali;         document.write("objKali2.constructor.prototype = " + objKali2.prototype + "<BR />");         document.write("objKali2.var1 = " + objKali2.var1 + "<BR />");         var objKali3 = objKali;         objKali3.var1 = "halo again";         document.write("objKali3.prototype = " + objKali3.prototype + "<BR />");         document.write("objKali.var1 = " + objKali3.var1 + "<BR />");         document.write("objKali3.var1 = " + objKali3.var1 + "<BR />");     </script> </body> </html>


Hasil Eksekusi :


~~ Semoga Bermanfaat ~~
Comments