eagdad

Apa itu JavaScript dan Bagaimana Cara Kerjanya?

JavaScript adalah bahasa pemrograman untuk web. Ini didukung oleh sebagian besar browser web termasuk Chrome, Firefox, Safari, Internet Explorer, Edge, Opera, dll. Sebagian besar peramban seluler untuk ponsel pintar juga mendukung JavaScript.

Ini terutama digunakan untuk meningkatkan halaman web untuk menyediakan pengalaman yang lebih ramah pengguna. Ini termasuk memperbarui halaman web secara dinamis, peningkatan antarmuka pengguna seperti menu dan kotak dialog, animasi, grafik 2D dan 3D, peta interaktif, pemutar video, dan banyak lagi. Mode penggunaan JavaScript ini di browser web juga disebut sebagai javascript sisi-klien .

Triad halaman web

Ketika Anda mempertimbangkan komponen yang membentuk halaman web, JavaScript membentuk komponen ketiga dari triad, HTML dan CSS menjadi dua lainnya. HTML menjelaskan halaman , termasuk teks, grafik, dll. CSS digunakan untuk mengontrol dan menyesuaikan tampilan halaman web, termasuk warna, font, dll. JavaScript digunakan untuk menambahkan komponen dinamis ke halaman web dan membuat sebagian besar elemen pada halaman yang dapat diprogram.

Triad halaman web

Sejarah JavaScript

Pengembangan JavaScript dimulai pada tahun 1995 di Netscape Communications, pembuat browser Netscape. Mereka menyadari bahwa menambahkan “bahasa lem” untuk meningkatkan pengalaman pengguna web akan meningkatkan serapan pengguna. Jadi mereka membawa Brendan Eich untuk menyematkan bahasa Pemrograman Skema. Namun, karena Java adalah, pada saat itu, bahasa baru yang hangat dari web, mereka memutuskan untuk membuat bahasa lebih dekat dalam sintaks ke Java. Hasilnya adalah JavaScript, dengan fitur Skema, orientasi objek SmallTalk dan sintaks Java. Versi pertama dari bahasa ini sebenarnya bernama Mocha pada Mei 1995, berganti nama menjadi LiveScript pada September 1995, dan kembali berganti nama menjadi JavaScript pada Desember 1995.

Pada tahun 1996, JavaScript dikirim ke ECMA International untuk diselesaikan sebagai spesifikasi standar. Pada Juni 1997, spesifikasi resmi pertama untuk bahasa dirilis sebagai ECMA-262. Versi bahasa terbaru adalah ECMAScript 2017 yang dirilis pada Juni 2017.

Apa Yang Dapat Saya Lakukan Dengan JavaScript?

JavaScript adalah penerjemah bahasa pemrograman lengkap yang tertanam di dalam browser web Anda. Anda dapat melakukan apa saja di JavaScript yang bahasa reguler seperti Java memungkinkan. Ini termasuk:

  • Deklarasikan variabel
  • Simpan dan ambil nilai
  • Definisikan dan aktifkan fungsi
  • Tentukan kelas Anda sendiri
  • Muat dan gunakan modul eksternal
  • Menulis pengendali event yang merespons pengguna dan acara lainnya
  • Dan banyak lagi

Browser web memuat halaman web, mem-parsing HTML dan menciptakan apa yang dikenal sebagai Model Objek Dokumen (DOM) dari konten. DOM menyajikan tampilan langsung dari halaman web ke kode JavaScript Anda. Kode Anda kemudian dapat melakukan pembaruan ke DOM dan mempresentasikannya langsung kepada pengguna. Browser juga memungkinkan Anda untuk mendaftarkan kode Anda untuk diberitahu tentang peristiwa antarmuka pengguna seperti gerakan mouse, klik tombol, dll. Dengan menggunakan semua fasilitas ini, Anda dapat membangun aplikasi kecil yang keren (dan tidak begitu kecil) untuk melayani tujuan apa pun yang Anda pilih .

Peringatan: Karena JavaScript adalah bahasa yang sangat kuat , juga mungkin untuk menulis malware, virus, pembajak peramban, dan kejahatan lainnya untuk memberikannya kepada pengguna. Ini berkisar dari mencuri cookie browser, kata sandi, kartu kredit hingga mengunduh virus ke komputer Anda.

 

Baca Juga  Cara Membuat Palet Warna Kustom untuk Tema Gutenberg Anda

Bagaimana Cara Kerja JavaScript?

Ketika browser web memuat halaman web, parser HTML mulai menguraikan kode HTML dan membuat DOM. Setiap kali parser menemukan petunjuk CSS atau JavaScript (sebaris atau dimuat secara eksternal), parser akan diserahkan ke pengurai CSS atau mesin JavaScript sesuai kebutuhan. Mesin JavaScript memuat file JavaScript eksternal dan kode inline, tetapi tidak segera menjalankan kode. Ini menunggu penguraian HTML dan CSS selesai. Setelah ini dilakukan, JavaScript dijalankan dalam urutan mereka ditemukan di halaman web: variabel dan fungsi didefinisikan, fungsi panggilan dijalankan, pengendali event dipicu, dll. Kegiatan ini menghasilkan DOM yang diperbarui oleh JavaScript dan dirender secara instan oleh browser.

Cara kerja JavaScript

Memuat JavaScript di Halaman Web

Cara paling umum untuk memuat JavaScript di halaman web adalah menggunakan tag HTML skrip . Tergantung pada kebutuhan Anda, Anda dapat menggunakan salah satu metode berikut.

  • Memuat file javascript eksternal ke halaman web sebagai berikut:
    <script type="text/javascript" src="/path/to/javascript"></script>
    
  • Anda dapat menentukan URL lengkap jika javascript berasal dari domain yang berbeda dari halaman web sebagai berikut:
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    
  • JavaScript dapat langsung tertanam di HTML. Hal berikut ini menyebabkan halaman web untuk memunculkan kotak peringatan ketika dimuat.
    <script type="text/javascript">
    alert("Page is loaded");
    </script>
    

Selain metode ini ada cara memuat kode JavaScript secara dinamis sesuai permintaan. Bahkan, ada seluruh kerangka kerja yang didedikasikan untuk memuat dan menjalankan modul JavaScript dengan dependensi yang tepat diselesaikan pada waktu proses. Diskusi teknik-teknik ini harus ditunda ke artikel lanjutan.

Beberapa Contoh Cuplikan Kode JavaScript

Berikut ini beberapa contoh kode JavaScript sederhana untuk menggambarkan betapa mudahnya menggunakannya di halaman web Anda.

  • Berikut ini memilih semua elemen tebal dalam dokumen dan mengatur warna yang pertama menjadi merah.
    var elems = document.getElementsByTagName('b');
    elems[].style.color = 'red';
    
  • Ingin mengubah gambar di img tag? Berikut ini mengaitkan event handler untuk peristiwa klik tombol.
    <img id="myImg" src="prev-image.png">
    <button onclick="document.getElementById('myImg').src='new-image.png'">Change Image</button>
    
  • Perbarui konten teks elemen paragraf ( p )? Setel properti innerHTML dari elemen seperti yang ditunjukkan:
    <p id="first-para">Hello World</p>
    <button onclick="document.getElementById('first-para').innerHTML = "Welcome to JavaScript!"'>Click me</button>
    

Contoh kode ini hanya menawarkan sekilas tentang apa yang dapat Anda lakukan menggunakan JavaScript di halaman web Anda. Ada banyak tutorial di web untuk memulai. Coba hari ini!

Membungkus

Mudah-mudahan, pengantar ini telah membawa beberapa wawasan ke JavaScript dan membangkitkan selera Anda untuk pemrograman web secara umum dan JavaScript pada khususnya.

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan.