Belajar JavaScript Dasar Lengkap

Object Oriented programming JavaScript

Belajar javascript dasar lengkap untuk pemula – Pemrograman Berorientasi Objek (OOP). Sebuah bahasa pemrograman dapat disebut berorientasi objek jika menyediakan empat kemampuan dasar untuk pengembang.

• Enkapsulasi (Encapsulation) – kemampuan untuk menyimpan informasi terkait, apakah data atau metode, bersama-sama dalam suatu objek.
• Agregasi (Aggregation) – kemampuan untuk menyimpan satu objek di dalam objek lain.
• Warisan (Inheritance) – kemampuan kelas untuk mengandalkan kelas lain (atau jumlah kelas) untuk beberapa properti dan metodenya.
• Polimorfisme (Polymorphism) – kemampuan untuk menulis satu fungsi atau metode yang bekerja dalam berbagai cara yang berbeda.

Inheritance

Inheritance atau Pewarisan/Penurunan adalah konsep pemrograman dimana sebuah class dapat ‘menurunkan’ property dan method yang dimilikinya kepada class lain. Konsep inheritance digunakan untuk memanfaatkan fitur ‘code reuse’ untuk menghindari duplikasi kode program.

Untuk membuat pewarisan kelas, gunakan kata kunci extends. Kelas yang dibuat dengan pewarisan kelas mewarisi semua metode dari kelas lain.

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Class Inheritance</h2>
<p>Use the "extends" keyword to inherit all methods from another class.</p>
<p>Use the "super" method to call the parent's constructor function.</p>
<p id="demo"></p>

<script>
class Buku {
  constructor(judul) {
    this.bookname = judul;
  }
  present() {
    return 'Saya punya buku ' + this.bookname;
  }
}

class Penerbit extends Buku {
  constructor(judul, publsh) {
    super(judul);
    this.publisher = publsh;
  }
  show() {
    return this.present() + ', Penerbit  ' + this.publisher;
  }
}

let myBook = new Penerbit("Pemrogramman", " Andi Yogyakarta");
document.getElementById("demo").innerHTML = myBook.show();
</script>

</body>
</html>

Encapsulation 

Modifier merupakan bentuk pengimplementasian konsep Enkapsulasi. Dengan adanya modifier maka class, Interface, Method, dan variabel akan terkena suatu  dampak tertentu. Didalam bahasa pemograman Javascript.

Kita dapat mengatur akses baca dan tulis properti objek dengan menggunakan enkapsulasi.

Read Only: Jika kita mendeklarasikan metode getter only maka itu memfasilitasi akses read only.

Write Only: Jika kita mendeklarasikan metode setter saja maka itu memfasilitasi akses write only.

Read & Write : Jika kita mendeklarasikan metode getter dan setter, maka itu memfasilitasi akses Read & Write

Contoh tidak menggunakan metode set atau get.

<!DOCTYPE html>
<html>
<body>
 
<script>
class Employee
  {
    constructor()
    {
       var name;
       var rating;
    }
        getName()
        {
          return this.name;
        }
      setName(name)
      {
        this.name=name;
      }
 
      getRating()
      {
        return this.rating;
      }
    setRating(rating)
    {
          this.rating=rating;
    }
    }
    var emp=new Employee();
     emp.setName("Ahmad Mubarok");
     emp.setRating(3);
     document.writeln(emp.getName()+" "+emp.getRating());
</script>
 
</body>
</html>

Contoh menggunakan metode set atau get

<!DOCTYPE html>
<html>
<body>
 
<script>
function Employee(id,name)
{
  var eId=id;
  var ename=name;
  Object.defineProperty(this,"name",{
    get:function()
    {
      return ename;
    },
  set:function(ename)
  {
    this.ename=ename;
  }
 
});
 
    Object.defineProperty(this,"id",{
    get:function()
    {
      return eId;
    },
  set:function(eId)
  {
    this.eId=eId;
  }
 
});
 
}
  var emp=new Employee(8, "Ahmad Taufik");
  document.writeln(emp.id+" "+emp.name);
</script>
 
</body>
</html>

Polymorphism

Polimorfisme adalah konsep inti dari paradigma berorientasi objek yang menyediakan cara untuk melakukan tindakan tunggal dalam bentuk yang berbeda. Ini memberikan kemampuan untuk memanggil metode yang sama pada objek JavaScript yang berbeda.

Mari kita lihat contoh di mana objek kelas anak memanggil metode kelas induk.

<!DOCTYPE html>
<html>
<body>

<script>
class Dosen
  {
     display()
    {
      document.writeln("Mahasiswa dipanggil Dosen");
    }
  }
class Mahasiswa extends Dosen
  {
  }
var b=new Mahasiswa();
b.display();
</script>

</body>
</html>

<< Part 11

Sumber :

• Abdul Qadir, 2013, From Zero to A Pro Javascript & Jquery, Andi Yogyakarta
• Tutorials point, 2015, JavaScript Language Tutorials Point, E-book,com
• https://www.w3bai.com/id/
• https://www.w3schools.com/