Menciptakan Subkelas dan Pewarisan Javascript

Hallo sahabat dumenity berjumpa lagi dalam tutorial dumetschool, pada tutorial kali ini saya akan membahas tentang Menciptakan Subkelas dan Pewarisan Javascript. Untuk mendemontrasikan bagaimana pewarisan dapat dilakukan . Teman – teman dapat menyimpulkan sebuah kelas basis, hewan misalnya. Yang memiliki properti – properti dan metode – metodenya sendiri dan dapat menciptakan beberapa instans(objek) melalui operator new. Kemudian teman – teman akan menggunakan kelas basis tersebut untuk menciptakan dua subkelas, kucing dan singnga misalnya.

Setiap subkelas(kelas terderivasi) ini akan menggunakan property prototype untuk mewarisiÂ semua propertiÂ dan metode dari kelas hewan. Kedua kelas kucing dan kelinci akan dimodifikasi untuk memiliki metode bicar() sendiri. meskipun nama metode sama untuk kelas kucing dan singnga Javascript akan memanggil metode bicara() untuk objek tertentu yang memiliki metode tersebut, yaitu ketika metode bicara() dipanggil untuk objek kucing , ia akan menghasilkan ” Meong…”. dan ketika di panggil untuk objek singnga, ia akan menghasilkan “aungggg…”.

Oke untuk lebih jelasnya silahkan lihat di bawah ini:

<!DOCTYPE html>
 	<html>
 	<head>
 		<title></title>
 		 <script type="text/javascript">
        function Hewan(){ 
        var pemilik = "MP.Feri";
        var gender = undefined;
        this.setPemilik = function (who)   {pemilik=who;};
        this.getPemilik = function() {return pemilik;}
        this.setGender = function(seks){gender=seks;}
        this.getGender = function() {return gender;}
        } 

        function Kucing (){}//konstruktor subkelas
          Kucing.prototype = new Hewan();
          Kucing.prototype.constructor=Kucing;
          Kucing.prototype.bicara=function bicara(){
            return("Meong...");
          };

        function Anjing(){} //konstruktor subkelas
        	Anjing.prototype = new Hewan();
          Anjing.prototype.constructor=Anjing;
          Anjing.prototype.bicara=function bicara(){
            return ("aunggg...");
          };
    </script>
 	</head>
 	<body>
 		 <big>
          <script >
            var cing = new Kucing;
            var sing = new Anjing;
            cing.setPemilik("Feri");
           	cing.setGender("Betina");
            sing.setGender("Jantan");
            document.write("Kucing "+ cing.getGender()+ "dimiliki oleh "+ cing.getPemilik() +" dan ia selalu berkata"+ cing.bicara());
            document.write("<br>Singnga" + sing.getGender() + "" + "dimiliki oleh " + sing.getPemilik()+"dan ia selalu berbicara"+ sing.bicara());
          </script>
        </big>

 	</body>
 	</html>

<!DOCTYPE html>

<html>

<head>

function Hewan(){

var pemilik = "MP.Feri";

var gender = undefined;

this.setPemilik = function (who) {pemilik=who;};

this.getPemilik = function() {return pemilik;}

this.setGender = function(seks){gender=seks;}

this.getGender = function() {return gender;}

}

function Kucing (){}//konstruktor subkelas

Kucing.prototype = new Hewan();

Kucing.prototype.constructor=Kucing;

Kucing.prototype.bicara=function bicara(){

return("Meong...");

};

function Anjing(){} //konstruktor subkelas

Anjing.prototype = new Hewan();

Anjing.prototype.constructor=Anjing;

Anjing.prototype.bicara=function bicara(){

return ("aunggg...");

};

</script>

</head>

<body>

<big>

var cing = new Kucing;

var sing = new Anjing;

cing.setPemilik("Feri");

cing.setGender("Betina");

sing.setGender("Jantan");

document.write("Kucing "+ cing.getGender()+ "dimiliki oleh "+ cing.getPemilik() +" dan ia selalu berkata"+ cing.bicara());

document.write("<br>Singnga" + sing.getGender() + "" + "dimiliki oleh " + sing.getPemilik()+"dan ia selalu berbicara"+ sing.bicara());

</script>

</big>

</body>

</html>

dari script di atas maka akan menghasilkan output seperti di bawah ini:

oke semoga bermanfaat.

Facebook DUMET School

Categories