Categories: Website & Blog

Panduan Belajar JavaScript Untuk Pemula

Pada artikel ini saya akan membahas mengenai belajar JavaScript untuk pemula sebelum membahas mengenai belajar JavaScript lengkap. JavaScript menjadi bahasa pemrograman yang wajib dipelajari untuk para developer website. JavaScript dianggap mudah digunakan untuk membuat website yang menarik dan interaktif. Akibatnya, saat ini hampir semua website menggunakan JavaScript sebagai bahasa pemrograman yang digunakan untuk membuat website mereka.

Kemudahan yang ditawarkan membuat JavaScript saat ini tidak hanya digunakan pada sisi klien saja. JavaScript sudah bisa digunakan pada sisi server, mobile, game, aplikasi desktop, Internet of Things (IoT), dan lain sebagainya.

Apa itu JavaScript?

Untuk tahap awal belajar JavaScript, Anda perlu mengenal apa itu JavaScript. Pertama kali, JavaScript dikembangkan oleh Brendan Eich dari Netscape dengan nama Mocha. Nantinya, nama ini diganti menjadi LiveScript sebelum berakhir dengan nama JavaScript. JavaScript inilah yang merupakan pengembangan bahasa dari LiveScript.

JavaScript saat ini sudah banyak dikembangkan menjadi beberapa pengetahuan lain, seperti AJAX. Asynchronous JavaScript dan XML (AJAX) adalah teknik yang digunakan pada halaman website dengan menggunakan bahasa pemrograman JavaScript. Metode yang diterapkan adalah menerima dan mengirimkan data dengan server tanpa harus menyegarkan (refresh) halaman itu.

JavaScript sudah menjadi bahasa pemrograman yang baku. Maka dari itu, JavaScript bisa dikolaborasikan dengan banyak bahasa lain, seperti HTML, untuk membuat website yang mudah digunakan oleh pengguna.

JavaScript bisa membuat berbagai fitur mulai dari yang sederhana sampai dengan yang paling kompleks, mislanya layout, galeri, tombol, causels, dan lain sebagainya. Jika dikembangkan lebih lanjut, JavaScript dapat digunakan untuk membuat baik animasi dua dimensi maupun tiga dimensi, bahkan aplikasi yang behubungan dengan database.

Meski tersusun atas bahasa yang cukup kompleks, JavaScript sangatlah fleksibel. Banyak pengembang yang telah memanfaatkannya untuk membangun dan menyediakan berbagai macam aplikasi. Apalagi saat ini juga tersedia banyak sekali bahasa pemograman pendukung seperti Node.js dan lainnya. Node.js sendiri merupakan salah satu framework Javacript yang mengeksekusi kode program JavaScript di luar browser.

Baca juga: Belajar HTML Lengkap untuk Pemula

Apa Saja yang Dibutuhkan untuk Belajar JavaScript?

Ada beberapa aplikasi yang dibutuhkan untuk belajar JavaScript, yaitu:

  • Web Browser (Google Chrome, Firefox, Opera, dll).
  • Teks Editor (Atom, Notepad++, Sublime, dll).
  • Web server, digunakan untuk menjalankan kode program, seperti HTML dan PHP yang biasanya dikombinasikan dengan JavaScript.

Panduan Singkat JavaScript

Setelah semuanya sudah siap, selanjutnya adalah mempelajari cara kerja JavaScript dan penggunaan bahasa JavaScript secara sederhana. Panduan berikut didapatkan dari beberapa referensi halaman yang saya coba kombinasikan dan kembangkan.

Hello JavaScript

1. Pertama, pada folder web server atau biasanya jika di dalam server web hosting disebut dengan public_html, buatlah sebuah folder dengan nama script dan di dalam folder tersebut ditambahkan file dengan nama main.js

2. Selanjutnya, buka atau buat file index.html Anda, kemudian masukkan elemen pada sebuah baris sebelum tag penutup </body>. Tambahkan kode berikut pada file main.js

Berikut tampilan kode program pada file index.html dan main.js:

4. Akses file index.html pada folder web server Anda melalui browser.

Sebelum menggunakan JavaScript, tulisan yang ditampilkan adalah ‘Domain Murah‘. Setelah ditambahkan, Anda akan melihat ‘Hello, Welcome to Arch‘.

Kode program di atas digunakan untuk mengganti Heading dari tampilan website yang sudah ada menjadi tampilan yang sesuai dengan kode JavaScript. Kesimpulannya, kode yang sudah ada ditimpa dengan kode JavaScript setelahnya.

Baca juga: [Terlengkap] Panduan Laravel Tutorial Pemula

Aturan Penulisan Kode JavaScript

Berikut ini adalah beberapa penulisan pada kode program JavaScript yang perlu Anda ketahui.

1. Penulisan Dengan Embed

Penulisan JavaScript dengan Embed memanfaatkan tag <script> untuk menyisipkan kode JavaScript ke html di dalam tag <body> atau <head>. Akan tetapi, disarankan untuk menambahkan kode embed pada tag <body> karena loadnya lebih cepat apabila menambahkannya pada <head>.

2. Penulisan InLine

Penulisan secara inLine sudah dicontohkan pada program untuk memunculkan teks ‘Hello, Welcome to Arch!’ pada bagian awal artikel.

3. Eksternal Line

Contoh penulisan ini sudah kita bahas pada bagian sebelumnya ketika menggunakan main.js sebagai tempat file JavaScript. Jadi, akan tedapat beberapa file terpisah yang tersimpan di dalam folder web server untuk membuat satu struktur web yang lengkap.

Biasanya struktur seperti ini digunakan untuk mengembangkan proyek website yang besar dan sangat kompleks.

4. Case Sensitivity

Jadi, penulisan huruf pada JavaScript juga memperhatikan besar dan kecilnya. Anda akan menemui masalah jika menganggap tidak ada masalah pada besar dan kecilnya huruf di JavaScript. Sehingga penulisan harus konsisten.

Misalnya, jika menggunakan variabel ‘Tanggal’ akan berbeda jika menggunakan huruf kecil ‘tanggal’, keduanya adalah variabel yang berbeda meskipun cara membacanya sama.

5. Penulisan Komentar

Komentar pada JavaScript bisa menggunakan dua cara, yaitu satu baris dan yang mencakup beberapa baris.

6. Penulisan Karakter

Kode program JavaScript akan mengabaikan karakter-karakter yang menggunakan spasi, enter, tab, dan karakter lainnya, sedangkan tanda titik dua koma ‘;’ tidak wajib digunakan di setiap akhir baris program JavaScript. Hanya saja, untuk mendapatkan hasil yang diinginkan, terkadang penggunaan tanda ‘;’ diperlukan.

Variabel

Jika Anda belajar JavaScript, seperti belajar JavaScript Android atau belajar JavaScript untuk game pasti akan kesulitan memahami jika tidak belajar bagaimana menggunakan variabelnya dengan baik. Berikut ini adalah beberapa contoh penggunaan variabel pada JavaScript.

Variabel merupakan tempat yang bisa digunakan untuk memberikan nilai pada kode pemrograman. Pertama-tama deklarasikan variabel dengan keyword var, diikuti dengan nama variabel yang akan digunakan.

var nama;

var az=12;

var teks="Belajar JavaScript dengan Niagablogger";

Tanda titik koma digunakan untuk memisahkan antarvariabel. Meskipun ada variabel yang sudah terlebih dahulu diberikan nilai. Anda nantinya dapat mengubah nilai tersebut dengan nilai yang lainnya. Misalnya:

var nama = ’Nia’;

nama = ‘Angga’;

Sejak awal variabel nama dari awal sudah diberikan nilai dengan isi ‘Nia’, setelah itu diisikan nilai lain menjadi ‘Angga’, maka nilai akhir yang ada pada variabel nama adalah ‘Angga’.

Tipe data pada variabel JavaScript dinamis, yang berarti satu variabel bisa mengelola beberapa tipe data. Misalnya:

var x;             // Belum

x = 10;          // Tipe data Number

x = "Nia";     // Tipe data String

Ada beberapa tipe data yang bisa dipelajari saat Anda belajar JavaScript dengan cepat:

Tipe Data JavaScript

Beberapa tipe data yang dimiliki JavaScript.

1. String

Menandakan bahwa variabel tersebut adalah string sehingga jika ingin mengubahnya, harus menggunakan tanda kutip.

var nama = "Nia Blogger";

2. Number

Digunakan untuk variabel angka.

Var tahun = 2017;

var tanggal = 20;

3. Boolean

Digunakan untuk memberikan nilai benar atau salah (true/false).

var nilaiAwal = TRUE;

4. Array

Digunakan untuk menyimpan lebih dari satu nilai dalam satu var.

var hari = ["Senin","Selasa","Rabu","Kamis","Jumat","Sabtu","Minggu"];

var nilai = [5,7,8,2.4,4.5,10];

var mix = [

       "gfyty$^%",

       12.3,

       NULL,

       TRUE,

       FALSE,

       ["a","b","C"]

    ];

5. Object

Bisa menyimpan semua bentuk pada JavaScript.

var orang = {

    nama : "Nia",

    umur : 23,

    "berat badan" : 55.5,

    "sudah nikah" : TRUE,

    "jumlah anak": NULL

  };

6. Function

Potongan kode yang dikumpulkan dan bisa digunakan rulang, caranya dengan cara memanggil fungsi tersebut.

var apakahGanjil = function(nilai){

       return nilai % 2 == 0;

   };

function(nilai) merupakan fungsi yang digunakan untuk melakukan pengecekan apakah nilai tersebut genap atau tidak.

Baca Juga: JSON: Pengertian, Fungsi, dan Cara Menggunakannya

Operator

Merupakan simbol matematika yang menghasilkan nilai yang baru. Operator berikut bisa Anda gunakan pada kode program JavaScript.

1. Penambahan/penggabungan (+)

6 + 9;

"Hello " + "world!";

2. Pengurangan, Perkalian, Pembagian (-, *, /)

9 - 3;

8 * 2; // perkalian di JS menggunakan tanda bintang (*)

9 / 3;

3. Operator Penugasan (=)

var myVariable = 'Bob';

4. Operator Kesetaraan (==)

var myVariable = 3;

myVariable === 4;

5. Negasi, Tidak Sama Dengan (!, !==)

Operator ini digunakan untuk kesetaraan dan membalikan nilai dari sebuah variabel. Contohnya membalikan true menjadi false dan sebaliknya.

  • Kondisional

Kondisional ini digunakan untuk mempertimbangkan ekspresi memberikan nilai benar atau tidak. Hasilnya adalah menjalankan perintah lain sesuai dengan hasil kondisi dari ekspresi yang dimasukan dalam pengujian.

var makanan = 'nasi';

if (makanan === 'nasi') {

 alert('Variabel makanan isinya nasi!');

} else {

 alert('Makanan tidak sama dengan nasil');

}

Ekspresi if digunakan untuk pengujian kesetaraan, jadi untuk membandingkan antara string makanan dengan string nasi. Jika yang dibandingkan benar, maka eksekusi kode block selanjutnya. Sebaliknya jika salah, maka kode block else yang dieksekusi.

  • Fungsi

Fungsi merupakan potongan kode yang bisa digunakan kembali dan dipanggil secara berulang. Anda pun tidak perlu menuliskan kembali kode block yang sama. Fungsi digunakan jika potongan kode tersebut digunakan pada beberapa bagian kode program JavaScript. Misalnya:

function penjumlahan(nilai1,nilai2) {

 var hasil = nilai1 + nilai2;

 return hasil;

}

Fungsi tersebut bisa dipanggil dengan menggunakan kode program penjumlahan(1,2). Output-nya adalah angka 3.

https://www.niagahoster.co.id/blog/membuat-countdown-timer-dengan-javascript/

Kesimpulan

JavaScript merupakan bahasa pemrograman yang cukup mudah untuk dipelajari. Meskipun dikenal sebagai bahasa pemrograman website yang handal, hampir tidak ada perbedaan dengan bahasa lainnya dalam penggunaan dan penulisan beberapa kode programnya.

Pada artikel belajar JavaScript dasar untuk pemula ini dibahas mengenai apa saja pengetahuan dasar mengenai JavaScript. Ada beberapa bagian yang perlu diperhatikan saat Anda belajar JavaScript untuk pertama kali, yaitu cara penulisan kode program, variabel, tipe data, operator, kondisional, dan fungsi. Setelah itu, Anda bisa mengembangkannya sesuai dengan kebutuhan website atau sistem yang ingin Anda kelola.

Yasin K

Yasin K is a Technical Content Writer for Niagahoster Blog. Other words are unimportant things you will never need to know. Let the content speak for itself :)

Share
Published by
Yasin K
Tags: javascript

Recent Posts

Google WebP: Format Gambar Digital yang Bisa Mempercepat Website

Kalau Anda ingin meningkatkan kecepatan website, ukuran gambar adalah salah satu kuncinya. Kenapa? Karena semakin besar ukuran gambar, semakin lama…

6 hours ago

Apa itu Spoofing? Pahami Jenis-Jenis dan Cara Pencegahannya

Spoofing adalah salah satu bentuk kejahatan dunia maya atau cyber crime yang perlu Anda waspadai.  Menurut Indonesia Computer Emergency Response…

1 day ago

Cara Memasukkan dan Mengatur Gambar di HTML

Website tanpa gambar ibarat sayuran tanpa garam, akan terasa hambar. Sebab, kemungkinan  website akan terasa membosankan, sulit dipahami, dan tidak…

2 days ago

5+ Rekomendasi Tools Google Gratis untuk Digital Marketer

Untuk bisa mencapai kesuksesan bisnis online, Anda perlu melakukan upaya pemasaran dengan tepat. Untungnya, saat ini ada banyak tools Google…

2 days ago

Apa itu Blogwalking? Perlukah Setiap Blogger Melakukannya?

Blogwalking tentu bukan hal asing bagi blogger. Namun, tahukah Anda kalau sebenarnya blogwalking merupakan istilah yang hanya ada di Indonesia?…

3 days ago

Panduan Blogging Terlengkap yang Wajib Anda Baca!

Membuat blog saat ini sudah semakin mudah. Tak heran, banyak pihak membangun blog untuk berbagai tujuan, baik untuk pribadi maupun…

3 days ago