Pengenalan JavaScript Dasar

Halo sobat PP, kali ini kita akan sedikit membahas tentang Pengenalan JavaScript. Sebelum belajar lebih jauh kita pahami dulu apa itu JavaSript. Sobat bia lihat penjelasannya didawah ini.  

JavaScript adalah bahasa pemograman yang digunakan untuk menambahkan fitur interaktif pada website anda, seperti ketika ingin membuat game, melakukan perubahan ketika mengklik tombol, efek dinamik, animasi, dan masih banyak lagi. Tutorial ini adalah dasar dari JavaScript yang akan memberikan gambaran apa yang bisa anda buat dengan JavaScript.

Apakah JavaScript yang Sebenarnya?

JavaScript adalah bahasa pemograman yang sangat matang dan dapat dikolaborasikan dengan dokumen HTML dan digunakan untuk membuat website yang interaktif. JavaScript diciptakan oleh Brendan Eich yang juga co-founder dari Mozilla project, Mozilla Foundation dan Mozilla Corporation.
Anda dapat melakukan banyak hal dengan JavaScript. Anda akan memulai dari fitur sederhana seperti menentukan layout, membuat respon ketika mengkil button, caousels, dan gallery gambar. Namun pada akhirnya ketika anda sudah mendapat banyak pengetahuan anda juga akan dapat membuat game, animasi 2D dan 3D, aplikasi yang berhubungan dengan database, dan masih banyak lagi.
JavaScript sendiri adalah bahasa yang cukup komplek namun sangat fleksibel, dan banyak Developer (Programmer) telah menyediakan tool yang berdiri diatas core JavaScript agar anda dapat menggunakan fungsi - fungsi ekstra, tool tersebut sebagai berikut :

• Application Programming Interfaces (APIs) dibangun pada web browser agar memungkinkan anda melakukan apapun dari dinamik dokumen HTML dan set CSS yang anda buat, untuk menangkap dan memodifikasi video dari web cam, atau membuat animasi 3D dan sampel audio.
• 3rd party APIs menyediakan akses bagi Developer untuk menghubungkan aplikasi mereka pada website atau aplikasi lain layaknya facebook dan twitter. Pernahkan anda login soundcloud dengan facebook ? itu 3rd party APIs.
• 3rd party frameworks dan libraries dapat digabungkan pada HTML sehingga memungkinkan Developer membangun website atau aplikasi dengan cepat.

Contoh "Hello World"

Judul diatas terdengar menarik bukan ?. JavaScript adalah salah satu bahasa yang sangar menarik dari banyak teknologi web yang lain. dan jika anda mengikuti tutorial ini dengan baik, anda dapat menambahkan dimensi baru dan hal lain yang kreatif pada website anda.
Namun, JavaScript sedikit lebih rumit dari pada HTML dan CSS, dan anda akan belajar sedikit demi sedikit, dan tetaplah belajar pada langkah-langkah kecil yang kami berikan. Untuk memulainya, kami akan menunjukkan bagaimana cara menambah beberapa skrip JavaScript yang sangat sederhana pada halaman Anda, yakni dengan contoh cara membuat "Hello, world!" (contoh standar pada dasar pemrograman.)

Penting: Jika anda belum mengikuti semua kursus kami, download contoh kode berikut dan gunakan untuk memulai.

Catatan: Alasan kita menepatkan elemen <script> di bawah file html adalah ketika HTML di muat oleh browser untuk ditampilkan pada sebuah file. Jika JavaScript dimuat pertama kali dan seharusnya mempengatuhi HTML di bawahnya, kemungkinan ini tidak bisa bekerja, oleh karena itu JavaScript dimuat sebelum HTML bekeja seperti seharusnya. Oleh karena itu, strategi yang terbaik biasanya adalah di bawah halaman.

• Pertama-tema, buka situs percobaan anda, dan buatlah sebuah file baru bernama main.js. Simpan di dalam folder scripts.

• Selanjutnya, buka file index.html Anda, dan masukkan elemen berikut pada sebuah baris bari sebelum tag penutup </body>:

  <script src="scripts/main.js"></script>. 

  Ini sama halnya dengan cara kerja elemen <link> untuk CSS — ini menempatkan JavaScript ke halaman, sehingga dapat memberikan pegaruh pada HTML (CSS, dan lainnya pada halaman).

• Sekarang tambahkan ode berikut pada file main.js:

  var myHeading = document.querySelector('h1');
  myHeading.innerHTML = 'Hello world!';

• Sekarang pastikan file HTML dan JavaScript disimpan, dan muat index.html di browser. Anda seharusnya mendapatkan hasil seperti berikut:

Apa yang Terjadi?

Jadi text heading anda telah diubah menjadi "Hello world!" mengunakan JavaScript. Kita melakukannya dengan menggunakan fungsi querySelector() untuk mendapatkan referensi untuk heading, dan menyimpannya di variabel myHeading. Ini sama halnya seperti yang kita lakukan saat menggunakan CSS selector — kita menginginkan untuk melakukan sesuatu ke sebuah elemen, maka kita perlu memilihnya terlebih dahulu.
Setelah itu, kita tambahkan nilai dari variabel myHeading  properti innerHTML  ( dimana mewakili konten heading) ke "Hello world!".

Segini dulu pengenalan mengenai JavaSript, pada tab selanjutnya saya akan membahas mengenai elemen-elemen apa saja yang ada di javascript.

Salam Koding...!!!

Share this

Share on FacebookPlus on Google+