Membuat Kelas & Objek dengan JavaScript

JavaScript merupakan Script yang berjalan di browser yang memanfaatkan teknologi dari Java. Salah satunya adalah pemrograman berbasis objek (PBO). Objek berisi atribut seperti layaknya data atau record tabel, tetapi memiliki proses yang menyertai atribut-atributnya. Untuk memudahkan praktek membuat objek pada JavaScript sebaiknya menggunakan browser Mozilla karena memiliki fasilitas “developer”.

Jendela Developer

Untuk mengakses jendela developer pada mozilla dapat dilakukan dengan menekan Ctr-shif-K dan perhatikan akan muncul jendela di bagian bawah mozilla. JavaScript akan langsung dieksekusi Mozilla ketika sebuah script ditulis di jendela developer tersebut tanpa membutuhkan bantuan file HTML.

Membuat Kelas Objek

Objek-objek dengan karakteristik sejenis dapat dikumpulkan dalam satu kelas yang sama misalnya kelas dosen, kelas mahasiswa, kelas mata kuliah, dan lain-lain. Berikut ini kita coba membuat satu kelas dengan nama Person yang berisi atribut-atribut: first, last, age, gender, dan intersets dengan satu operasi menampilkan salam/greetings. Masukan script berikut di jendela developer pada mozilla. Lihat tutorial resminya.

function Person(first, last, age, gender, interests) {
this.name = {
‘first’: first,
‘last’ : last
};
this.age = age;
this.gender = gender;
this.interests = interests;
this.bio = function() {
alert(this.name.first + ‘ ‘ + this.name.last + ‘ is ‘ + this.age + ‘ years old. He likes ‘ + this.interests[0] + ‘ and ‘ + this.interests[1] + ‘.’);
};
this.greeting = function() {
alert(‘Hi! I\’m ‘ + this.name.first + ‘.’);
};
}

Note: Sepertinya kalau copas kode di atas, tanda petik single harus diketik ulang. Parameter “this” mengartikan suatu variabel milik pemilik objek yang bersangkutan, misalnya this.age berarti variabel “age” yang dimaksud berasal dari objek Person yang bersangkutan. Misal kita memasukan satu objek baru dari kelas Person tersebut.

var person1 = new Person(‘Bob’, ‘Smith’, 32, ‘male’, [‘music’, ‘skiing’]);

Kode di atas memasukan satu objek person1 dari kelas Person. Tampak nama depan, belakang, usia, jenis kelamin, dan hobinya. Bagaimana untuk melihat isi data beserta operasi yang mengiringi kelas Person? Ketik kode berikut ini di jendela developer mozilla.

person1[‘age’]
person1.interests[1]
person1.bio()

Instruksi di atas memunculkan “age”, “intersets” dan “bio”. Hasilnya akan memunculkan jendela berikut ini di mozilla.

Satu hal yang unik dari data objek di atas adalah operation yang muncul, dalam hal ini menambilkan jendela greeting di atas. Satu hal lain yang tidak dimiliki oleh data jenis relational adalah multivalue dalam hal ini contoh di atas memberikan hobi yang terdiri dari “music” dan “skiing” yang tentu saja dilarang dalam jenis data relational (jika ingin ditampilkan lebih dari dua hobi maka kode ada sedikit modifikasi di fungsi bio()). Sekian semoga bermanfaat.

Penulis: rahmadya

I'm a simple man .. Lahir di Sleman Yogyakarta, 7 Juni 1976 TK : - (tidak ada TK di tj Priok waktu itu) SDN : Papanggo, Jakarta 83 - 89 SMPN : 129, Jakarta 89 - 92 SMAN : 8, Yogyakarta 92 - 95 Univ. : Fak. Teknik UGM, Yogyakarta 95 - 2001 Pasca. : Tek. Informatika STMIK Nusa Mandiri, Jakarta 2008 - 2010 Doctoral : Information Management Asian Institute of Technology, Thailand 2013 - 2018 Pekerjaan: Tek. Komputer AMIK BSI Jakarta : 2002 - 2005 IT Danamon Jakarta : 2005 - 2008 Tek. Informatika STMIK Nusa Mandiri Jakarta : 2005 - 2008 Univ. Darma Persada : 2008 - Skrg Fakultas Teknik Universitas Islam "45" Bekasi : 2008 - Skrg ( Homebase)

One thought on “Membuat Kelas & Objek dengan JavaScript”

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout /  Ubah )

Foto Google

You are commenting using your Google account. Logout /  Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout /  Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout /  Ubah )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.