Object Oriented Programming di Javascript
New Post has been published on https://loveyourcode.com/object-oriented-programming-di-javascript/
Object Oriented Programming di Javascript
Javascript adalah satu halaman browser dalam berbagi objek dengan tujuan untuk memudahkan kita mengakses salah satu dari objek dan memanipulasinya dengan cara merubah sifat/kondisi (properti) objek. Objek tersebut diklasifikasikan berdasarkan hirarki/tingkatan khusus, sehingga kita bisa mengetahui dimana letak/lokasi obyek itu sebenarnya.
Baca Panduan sebelumnya,Ā
Panduan 4: Mengenal Konsep Javascript Dasar
Panduan 4: Mengenal Konsep Javascript Lanjutan
Ā Dimulai dari objek yang paling besar diantara semuanya (yang berisi objek lainnya). Kemudian turun berdasarkan tingkatan atau hirarkinya sampai kepada objek yang kita inginkan.
Objek paling besar adalah objek window dari browser.
Di dalam objek window, ada satu objek yang ditampilkan dalam bentuk sebuah halaman, kita sebagai objek dokumen atau document.
Halaman berisi banyak objek seperti formula, image dll.
Dalam sebuah halaman web terdapat bermacam-macam elemen seperti gambar (image), link, form, tombol, input text, dan sebagainya. JavaScript menyusun semua elemen halaman web dalam satu susunan hirarki. Setiap elemen dilihat sebagai object. Setiap object dapat memiliki beberapa property (yang menentukan sifat dan tampilannya) dan method (yang menentukan apa yang bisa dikerjakan oleh object yang bersangkutan). Dengan bantuan JavaScript kita dapat dengan mudah memanipulasi object-object tersebut. Untuk ini kita harus mengerti hirarki dari semua object-object HTML.
Contoh gambar di bawah adalah halaman htmlĀ yang kontennya terdapat banyak komponen web, yaitu:
object-oriented-programming-di-javascript
Gambar dibawah ini merupakan ilustrasi hirarki yang dibuat oleh contoh halaman HTML pada
object oriented programming di javascript dasar
Properti adalah atribut dari sebuah objek. Penulisannya dipisahkan dengan tanda ā.ā (titik).
Properti dapat diberi nilai, penulisannya :
public class Mobil Ā Ā Ā public String WarnaBadan get; set; //ini properti var mercedes = new Mobil(); mercedes.WarnaBadan = "Merah"; //ini properti setelah diberi nilai
Metode adalah suatu kumpulan kode yang digunakan untuk melakukan sesuatu tindakan terhadap objek. Penulisannya dipisahkan dengan tanda ā.ā (titik).
Nama_objek.nama_metode(āparameterā)
<script> function myFunction() var fruits = ["Banana", "Orange", "Apple", "Mango"]; document.getElementById("demo").innerHTML = fruits.valueOf(); //ini metode </script>
JavaScript Global Properties
Tabel JavaScript Global Properties
Properti Deskripsi constructor Menyimpan fungsi konstruktor Length Menyimpan ukuran dari string prototype Memungkinkan untuk penambahan properti dan methods untuk sebuah objek infinity Nilai numerik yang merepresentasikan bilangan positif atau negatif yang tidak terhingga NaN Nilai āNot-a-Numberā
Ā JavaScript Global Methods
Tabel JavaScript Global Methods
Method Deskripsi toString() Mengkonversikan nilai numerik ke string concat() Menggabungkan dua atau lebih nilai valueOf() Mengembalikan nilai primitif dari sebuah array
JavaScript Global Functions
Tabel JavaScript Global Functions
Method Deskripsi String() Mengkonversikan nilai dari sebuah objek ke bentuk tipe data string parseInt() Mengkonversikan nilai dari sebuah objek ke bentuk tipe data integer parseFloat() Mengkonversikan nilai dari sebuah objek ke bentuk tipe data float
Ā JavaScript Event Handler
Tabel JavaScript Event Handler
Method Deskripsi onFocus Event handler jenis ini terjadi pada saat user memberikan fokus ke satu elemen. onBlur Event handler terjadi ketika elemen kehilangan fokus (user melakukan klik di luar elemen). onChange Event handler terjadi pada saat user melakukan modifikasi isi dari data dalam satu field data. onLoad Event handler terjadi pada saat navigator user melakukan load suatu halaman. onMouseover Event handler terjadi pada saat user meletakkan kursor di atas suatu elemen. onMouseout Event handler terjadi pada saat kursor meninggalkan posisi dari atas suatu elemen.
