Realisasi JavaScript
- Halaman Sebelumnya Sejarah JavaScript
- Halaman Berikutnya Syarat ECMAScript
ECMAScript inti JavaScript mendeskripsikan sintaks dan objek dasar bahasa ini;
DOM mendeskripsikan metode dan antarmuka untuk menangani konten halaman web;
BOM mendeskripsikan metode dan antarmuka untuk berinteraksi dengan browser.
ECMAScript, DOM dan BOM
Meskipun ECMAScript adalah standar penting, ia bukan bagian tunggal dari JavaScript, tentu saja, ia juga bukan bagian yang disepadankan secara tunggal. Secara faktual, implementasi penuh JavaScript terdiri dari 3 bagian yang berbeda:
ECMAScript
ECMAScript tidak terikat dengan browser khusus apapun, sebenarnya, ia juga tidak menyebutkan metode untuk input dan output pengguna (ini berbeda dengan bahasa seperti C, yang membutuhkan pustaka eksternal untuk menyelesaikan tugas seperti itu). Apa yang benar adalah ECMAScript? Deskripsi standar ECMA-262 (pasal 2) adalah seperti berikut:
“ECMAScript dapat menyediakan kemampuan pemrograman skrip inti untuk berbagai jenis lingkungan tuan rumah, sehingga bahasa skrip inti adalah yang diatur terpisah dari lingkungan tuan rumah khusus... ...”
Browser web adalah lingkungan tuan untuk ECMAScript, tetapi itu bukan yang satu-satunya. Sebenarnya, ada ribuan lingkungan yang berbeda lainnya (seperti Nombas ScriptEase, serta ActionScript yang digunakan bersamaan oleh Macromedia di Flash dan Director MX) yang dapat menampung implementasi ECMAScript. Apa yang diatur ECMAScript di luar browser?
Dengan kata sederhana, ECMAScript mendeskripsikan berikut ini:
- Syarat
- Tipe
- Perintah
- Kata-kunci
- Kata-reservasi
- Operator
- Objek
ECMAScript hanya sebuah deskripsi, yang mendefinisikan semua properti, metode, dan objek bahasa skrip. Bahasa lain dapat melaksanakan ECMAScript sebagai dasar fungsi, seperti JavaScript:
Setiap browser memiliki implementasi interface ECMAScript yang sendiri, dan kemudian implementasi ini dijalankan, termasuk DOM dan BOM (yang akan disebutkan di bab berikutnya). Tentu saja ada juga implementasi lain yang memperluas ECMAScript, seperti Windows Scripting Host (WSH), ActionScript di Flash dan Director MX oleh Macromedia, serta Nombas ScriptEase.
1. Versi ECMAScript
ECMAScript dibagi menjadi beberapa versi yang berbeda, dan ia didefiniskan dalam standar yang disebut ECMA-262. Seperti standar lainnya, ECMA-262 akan diedit dan diperbarui. Saat ada pembaruan utama, standar baru akan dipublikasikan. Versi terbaru ECMA-262 adalah 5.1, yang dirilis pada Juni 2011.
Versi pertama ECMA-262 secara esensial sama dengan Netscape JavaScript 1.1, hanya menghapus semua kode yang berhubungan dengan browser, serta beberapa penyesuaian kecil. Pada awalnya, ECMA-262 meminta dukungan standar Unicode (untuk mendukung berbagai bahasa). Kedua, ia meminta objek yang bebas platform (Netscape JavaScript 1.1 sebenarnya memiliki implementasi objek yang berbeda, seperti objek Date, yang tergantung pada platform). Ini adalah alasan utama mengapa JavaScript 1.1 dan 1.2 tidak memenuhi spesifikasi ECMA-262 versi pertama.
Sebagian besar pembaruan yang dilakukan di versi kedua ECMA-262 secara dasar adalah pembaruan editor. Pembaruan standar ini bertujuan untuk memastikan kesamaan yang ketat dengan ISO/IEC-16262, dan tidak menambahkan, mengubah, atau menghapus konten. ECMAScript biasanya tidak mengikuti versi kedua.
ECMA-262 versi ketiga adalah pembaruan yang sebenarnya pertama kali standar ini. Ia menyediakan pembaruan bagi pengolahan string, definisi kesalahan, dan keluaran numerik. Selain itu, ia menambahkan dukungan ekspresi reguler, kontrol statement baru, penanganan eksepsi try...catch, serta beberapa perubahan kecil untuk memfasilitasi standar yang internasional. Secara umum, ia menandai bahwa ECMAScript menjadi bahasa pemrograman yang sebenarnya.
2. Apa itu Konformitas ECMAScript
Di ECMA-262, konformitas ECMAScript (conformance) memiliki definisi yang jelas. Bahasa skrip harus memenuhi empat prinsip dasar berikut:
- Eksekusi yang memenuhi standar harus mendukung semua “tipe, nilai, objek, atribut, fungsi, dan bahasa program serta semantik” yang dijelaskan di ECMA-262 (ECMA-262, halaman pertama)
- Eksekusi yang memenuhi standar harus mendukung standar karakter Unicode (UCS)
- Eksekusi yang memenuhi standar dapat menambahkan “tipe ekstra, nilai, objek, atribut, dan fungsi” yang tidak dispecifikasikan di ECMA-262. ECMA-262 mendeskripsikan penambahan ini sebagai objek baru atau atribut baru objek di dalam spesifikasi
- Eksekusi yang memenuhi standar dapat mendukung “gramatika program dan ekspresi reguler” yang tidak didefinisi di ECMA-262 (berarti dapat digantikan atau diperluas dukungan ekspresi reguler bawaan)
Semua eksekusi ECMAScript harus memenuhi standar di atas.
3. Dukungan ECMAScript di Peramban Web
Netscape Navigator 3.0 yang mengandung JavaScript 1.1 diluncurkan pada tahun 1996. kemudian, spesifikasi JavaScript 1.1 diserahkan sebagai rancangan standar baru kepada EMCA. Dengan kepopuleran yang hebat dari JavaScript, Netscape dengan gembira memulai pengembangan versi 1.2. Namun, ada masalah, ECMA belum menerima rancangan Netscape. Setelah Netscape Navigator 3.0 diluncurkan, Microsoft segera meluncurkan IE 3.0. Versi IE ini mengandung JScript 1.0 (nama eksekusi JavaScript sendiri Microsoft), yang direncanakan dapat dihubungkan dengan JavaScript 1.1. Namun, karena dokumentasi yang cacat dan beberapa karakteristik yang tidak sesuai, JScript 1.0 jauh kurang mencapai tingkat JavaScript 1.1.
Sebelum versi pertama ECMA-262 disepakati, Netscape Navigator 4.0 yang mengandung JavaScript 1.2 dirilis pada tahun 1997. Pada akhir tahun itu, standar ECMA-262 diterima dan disetujui. Oleh karena itu, JavaScript 1.2 tidak kompatibel dengan ECMAScript versi pertama, meskipun ECMAScript seharusnya berdasarkan JavaScript 1.1.
Langkah berikutnya untuk JScript adalah JScript 3.0 yang ditambahkan di IE 4.0 (versi 2.0 dirilis bersamaan dengan IIS 3.0, tetapi tidak disertakan di dalam peramban). Microsoft secara kuat mempromosikan JScript 3.0 sebagai bahasa skrip yang benar-benar sesuai standar ECMA. Pada saat itu, ECMA-262 belum disepakati secara final, jadi JScript 3.0 mengalami nasib yang sama seperti JavaScript 1.2 - ia masih belum memenuhi standar ECMAScript yang akhirnya.
Netscape memilih untuk meningkatkan implementasi JavaScriptnya di Netscape Navigator 4.06. JavaScript 1.3 akhirnya membuat Netscape sepenuhnya sesuai dengan ECMAScript versi pertama. Netscape menambahkan dukungan untuk standar Unicode, dan mempertahankan semua objek tetap memiliki fitur baru yang diintroduksi di JavaScript 1.2 sambil mencapai platform yang bebas.
Ketika Netscape mengumumkan kode sumbernya sebagai proyek Mozilla kepada publik, rencana awalnya adalah JavaScript 1.4 akan disertakan di Netscape Navigator 5.0. Namun, keputusan yang beresiko - untuk merancang ulang kode Netscape dari awal, menghancurkan pekerjaan ini. JavaScript 1.4 hanya diterbitkan sebagai bahasa skrip server Netscape Enterprise, dan kemudian tidak disertakan di dalam peramban.
Sekarang, semua peramban web utama mengikuti ECMA-262 versi ketiga.
Tabel di bawah ini menampilkan dukungan ECMAScript di sebagian besar browser Web yang populer:
| Peramban | Kompatibilitas DOM |
|---|---|
| Netscape Navigator 2.0 | - |
| Netscape Navigator 3.0 | - |
| Netscape Navigator 4.0 - 4.05 | - |
| Netscape Navigator 4.06 - 4.79 | Edisi 1 |
| Netscape 6.0+ (Mozilla 0.6.0+) | Edisi 3 |
| Internet Explorer 3.0 | - |
| Internet Explorer 4.0 | - |
| Internet Explorer 5.0 | Edisi 1 |
| Internet Explorer 5.5+ | Edisi 3 |
| Opera 6.0 - 7.1 | Edisi 2 |
| Opera 7.2+ | Edisi 3 |
| Safari 1.0+/Konqueror ~ 2.0+ | Edisi 3 |
DOM
DOM (Model Objek Dokumen) adalah API (Application Programming Interface) untuk HTML dan XML. DOM akan merancang seluruh halaman menjadi dokumen yang terdiri dari tingkat node. Setiap bagian dari halaman HTML atau XML adalah turunan dari node. Dengan ini, berikan perhatian kepada halaman HTML di bawah ini:
<html>
<head>
<title>Halaman Sample</title>
</head>
<body>
<p>hello world!</p>
</body>
</html>
Kode ini dapat digambarkan dengan DOM menjadi pohon tingkat node:
DOM membuat pohon untuk merepresentasikan dokumen, sehingga para pengembang memiliki pengendalian yang luar biasa terhadap konten dan struktur dokumen. Dengan DOM API, penghapusan, penambahan, dan penggantian node dapat dilakukan dengan mudah.
1. Mengapa DOM tak dapat dihindari
Sejak IE 4.0 dan Netscape Navigator 4.0 mendukung berbagai bentuk HTML yang dinamis (DHTML), para pengembang untuk pertama kalinya dapat mengubah penampilan dan kontennya tanpa memuat kembali halaman. Ini adalah lonjakan besar dalam teknologi Web, namun juga membawa masalah besar. Netscape dan Microsoft masing-masing mengembangkan DHTML sendiri, sehingga mengakhiri periode para pengembang web hanya menulis satu halaman HTML yang dapat diakses di semua browser.
Industri memutuskan harus melakukan sesuatu untuk mempertahankan khususnya kewajiban Web yang berbasis platform, mereka khawatir jika meninggalkan Netscape dan Microsoft perusahaan untuk melakukan hal ini, Web pasti akan membagi diri menjadi dua bagian yang terpisah, setiap bagian hanya dapat digunakan untuk browser khusus. Oleh karena itu, kelompok yang bertanggung jawab untuk menetapkan standar komunikasi Web W3C (World Wide Web Consortium) mulai merancang DOM.
2. Level DOM
DOM Level 1 diperkenalkan oleh W3C pada bulan Oktober 1998. Ini terdiri dari dua modul, yaitu DOM Core dan DOM HTML. Yang pertama menyediakan grafik struktur dokumen berdasarkan XML untuk mengakses dan mengoperasikan bagian mana saja dari dokumen; yang kedua menambahkan beberapa objek dan metode khusus HTML, sehingga memperluas DOM Core.
Perhatikan, DOM bukan milik JavaScript, sebenarnya banyak bahasa lain yang melaksanakannya. Walaupun demikian, DOM di browser Web sudah diimplementasikan dengan ECMAScript, sekarang ini adalah bagian penting dari bahasa JavaScript.
DOM Level 1 hanya tujuan, yaitu merancang struktur dokumen, sementara tujuan DOM Level 2 lebih luas. Perluasan DOM yang asli menambahkan dukungan untuk even mouse dan antarmuka pengguna (DHTML menawarkan dukungan yang kaya untuk hal ini), range, pengelilingan (metode yang diulang-ulang DOM dokumen), dan menambahkan dukungan CSS (Cascading Style Sheets) melalui antarmuka objek. DOM Core yang diintroduksi Level 1 juga menambahkan dukungan untuk namespace XML.
DOM Level 2 memperkenalkan beberapa modul DOM baru untuk menangani tipe antarmuka yang baru:
- DOM Tampilan - Menggambarkan pengawasan berbagai tampilan dokumen (yaitu dokumen sebelum dan setelah di-stilisasi CSS)
- DOM Event - Menggambarkan antarmuka untuk even
- DOM Gaya - Menggambarkan antarmuka untuk menangani gaya yang berdasarkan CSS
- DOM Pelengkap dan Range - Menggambarkan antarmuka untuk mengelilingi dan mengoperasikan pohon dokumen
DOM Level 3 memperkenalkan metode untuk memuat dan mempertahankan dokumen dengan cara yang seragam (termasuk dalam modul DOM Load and Save) serta metode untuk memvalidasi dokumen (DOM Validation), sehingga memperluas DOM. Pada Level 3, DOM Core diperluas untuk mendukung semua fitur XML 1.0, termasuk XML Infoset, XPath, dan XML Base.
Saat mempelajari DOM, mungkin ada yang mengutip DOM Level 0. Perhatikan, tidak ada standar DOM Level 0, ini hanya referensi sejarah DOM (DOM Level 0 merujuk kepada DHTML yang didukung IE 4.0 dan Netscape Navigator 4.0).
3. DOM Lainnya
Diantara DOM Core dan DOM HTML, ada beberapa bahasa yang telah merilis standar DOM sendiri. Bahasa-bahasa ini berdasarkan XML, setiap DOM menambahkan metode dan antarmuka khusus untuk bahasa yang masing-masing:
- Bahasa Vektor Skalabel (SVG) 1.0
- Bahasa Tanda Digital (MathML) 1.0
- Bahasa Integrasi Multimedia Sincron (SMIL)
Catatan:Jika ingin belajar tentang konten yang berhubungan, kunjungi CodeW3C Tutorial SMIL dan Tutorial SVG.
Selain itu, bahasa lainnya juga mengembangkan implementasi DOM sendiri, seperti bahasa antarmuka XML Mozilla (XUL). Namun, hanya beberapa bahasa yang tercantum di atas yang direkomendasikan standar W3C.
Dukungan DOM di Peramban Web
DOM sudah menjadi standar sebelum Web browser mulai melaksanakannya. IE mencoba DOM untuk pertama kalinya di versi 5.0, tetapi sebenarnya hanya mulai memiliki dukungan DOM yang benar di versi 5.5, IE 5.5 melaksanakan DOM Level 1. Dari waktu itu, IE belum memperkenalkan fitur DOM baru.
Netscape hanya mengintegrasikan dukungan DOM mulai dari Netscape 6 (Mozilla 0.6.0). Saat ini, Mozilla memiliki dukungan DOM yang terbaik, melaksanakan Level 1 penuh, hampir semua Level 2, dan bagian dari Level 3. (Tujuannya adalah untuk membangun peramban yang 100% kompatibel dengan standar, dan kerja mereka telah memberikan hasil.)
Opera hanya menambahkan dukungan DOM mulai dari versi 7.0, dan Safari juga melaksanakan sebagian besar DOM Level 1. Mereka hampir semua berada di tingkat yang sama dengan IE 5.5, dan beberapa kasus, bahkan melebihi IE 5.5. Meskipun demikian, dalam hal dukungan DOM, semua peramban jauh ketinggalan Mozilla. Tabel di bawah ini menunjukkan dukungan DOM bagi peramban yang sering digunakan.
| Peramban | Kompatibilitas DOM |
|---|---|
| Netscape Navigator 1.0 - 4.x | - |
| Netscape 6.0+ (Mozilla 0.6.0+) | Level 1、Level 2、Level 3（bagian） |
| IE 2.0 - 4.x | - |
| IE 5.0 | Level 1（terkecil） |
| IE 5.5+ | Level 1（hampir seluruhnya） |
| Opera 1.0 - 6.0 | - |
| Opera 7.0+ | Level 1（hampir seluruhnya）、Level 2 （bagian） |
| Safari 1.0+/Konqueror ~ 2.0+ | Level 1 |
Catatan:Jika ingin belajar lebih lanjut tentang DOM, kunjungi CodeW3C Tutorial HTML DOM dan Tutorial XML DOM.
BOM
IE 3.0 dan Netscape Navigator 3.0 menyediakan fitur - BOM (Browser Object Model), yang dapat mengakses dan mengoperasikan jendela peramban. Dengan BOM, pengembang dapat memgerakkan jendela, mengubah teks di bawah status bar, dan melaksanakan tindakan lain yang tidak langsung berhubungan dengan konten halaman. Yang membedakan BOM dan sering dipertanyakan adalah bahwa ia hanya bagian dari JavaScript, tanpa standar yang relevan.
BOM utamanya mengatur jendela peramban dan frame, tetapi umumnya ekspansi JavaScript spesifik browser dianggap bagian dari BOM. Ekspansi ini termasuk:
- Munculkan jendela peramban baru
- Menggerakkan, menutup jendela peramban, dan mengatur ukuran jendela
- Objek lokasi yang menyediakan informasi detil tentang peramban web
- Objek layar yang menyediakan informasi detil tentang resolusi layar pengguna
- Dukungan cookie
- IE meluas BOM dengan menambahkan kelas ActiveXObject, yang dapat diinstansiasi objek ActiveX melalui JavaScript
Karena tidak ada standar BOM yang relevan, setiap browser memiliki implementasi BOM sendiri. Ada beberapa standar faktual, seperti adanya objek jendela dan objek navigasi, tetapi setiap browser dapat menentukan atribut dan metode untuk objek ini atau objek lain.
Lihat:
- Halaman Sebelumnya Sejarah JavaScript
- Halaman Berikutnya Syarat ECMAScript
