Scribd
Unggah
1K tayangan

Modul JavaScript

Javascript dapat digunakan untuk membuat halaman web menjadi lebih interaktif dan dinamis. Javascript umumnya digunakan untuk membuat animasi, game, form interaktif, dan lainnya. Beberapa contoh penerapan javascript dalam kehidupan sehari-hari antara lain pada game, tiket online, dan untuk mengatasi masalah yang mungkin timbul pada browser.

Diunggah oleh

Abdurrohim Fajar
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai DOCX, PDF, TXT atau baca online di Scribd
1K tayangan

Modul JavaScript

Javascript dapat digunakan untuk membuat halaman web menjadi lebih interaktif dan dinamis. Javascript umumnya digunakan untuk membuat animasi, game, form interaktif, dan lainnya. Beberapa contoh penerapan javascript dalam kehidupan sehari-hari antara lain pada game, tiket online, dan untuk mengatasi masalah yang mungkin timbul pada browser.

Diunggah oleh

Abdurrohim Fajar
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai DOCX, PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 20

PENGENALAN DAN IMPLEMENTASI

JAVASCRIPT
A. Apa Itu Javascript

Javascript adalah bahasa script yang biasa jalan di browser, orang-orang biasa bilang client
side programming. Client di sini adalah browser, seperti: Internet Explorer, Firefox, Safari dan
sebagainya. Kode javascript biasanya disisipkan diantara kode-kode HTML.

Di mana saya bisa menulis kode javascript ? Anda bisa menulis kode javascript diteks
editor seperti notepad dan sebagainya.

Apakah saya butuh compiler untuk menjalankan javascript ? Tidak perlu, anda cukup
menjalankan javascript menggunakan browser. Semua browser mempunyai engine yang
menginterpretasikan kode javascript kita.

B. Memulai Javascript

Oke sekarang mari kita coba mulai menulis kode javascript kita. Di sini kita menggunakan
notepad sebagai teks editor.

Kode javascript ditulis diantara tag <script> dan </script>, bisa kita sisipkan di kode-kode
HTML kita. Sekarang mari kita simpan kode tersebut dengan File Name: Javascript
Pertama.html, jangan lupa Save as type : All Files, seperti gambar di bawah.
Untuk mengetesnya, anda tinggal double klik file Javascript Pertama.html yang kita buat
tadi, hasilnya akan seperti berikut :

Javascript bisa juga ditulis terpisah, filenya diberi ekstension .js Contoh: namafile.js, nanti
cara menyisipkannya di file html adalah seperti berikut :

<script type="text/javascript" src="namafile.js"></script>


C. Sintaks Javascript
Sintaks javascript mirip-mirip bahasa C atau java. Javascript bersifat case sensitive, artinya
huruf kecil dan huruf besar adalah berbeda. Setiap baris kode javascript dipisahkan baris baru
atau bisa juga titik koma (;) Komentar dalam javascript di awali dengan // atau ditulis diantara /*
dan */

D. Variabel
Variabel di javascript bisa ditulis dengan diawalai huruf atau underscore ( _ ) atau tanda
dollar (). Contoh : jumlah_hits , _nama

Variabel dan Tipe Data dalam Javascript

Apa itu variabel ?…dan apa pula itu tipe data ?, Apapun bahasa pemrograman yang
digunakan. Dua hal ini akan selalu ada. Lalu apa sebenarnya variabel itu ? Variabel adalah
sebuah nama yang mewakili sebuah nilai. Variabel bisa diisi dengan berbagai macam nilai
seperti string (teks), number (angka), objek, array, dan sebagainya.
Kita bisa ibaratkan, variabel itu seperti wadah untuk menyimpan sesuatu.

Pada kesempatan ini kita akan belajar tentang variabel dan tipe data dalam Javascript. Dimulai
dari cara membuat, cara mencetak variabel ke output, mengisi ulang, dan menghapusnya dari
memori.

Deklarasi variable
 Anda bisa mendeklarasi dengan menggunakan var, contoh: var x = 5, ini bersifat local
dan global (bisa di akses oleh semua fungsi).
 Atau langsung deklarasikan tanpa var, x = 5.
Contoh :
<script>
var x = 5;
var nama = “Desrizal”;
document.write(nama);
</script>

E. Operator
Operator pada JavaScript terbagi menjadi enam, yaitu :
 Aritmatika
 Pemberian nilai (Assign)
 Pemanipulasian bit (bitwise)
 Pembanding
 Logika
 String

a. Operator Aritmatika
Digunakan untuk operan beripe numerik. Ada dua macam operator aritmatik, yaitu operator
numerik tunggal dan operator aritmatik biner. Perbedaan kedua operator terletak pada jumlah
operan yang harus dioperasikan.

Operator Definisi Contoh


+ Penambahan 5 + 5 = 10
- Pengurangan 6 – 2 = 4
* Pengalian 4 * 4 = 16
/ Pembagian 8 / 2 = 4
Modulus (sisa hasil 5 % 2 = 1
% 10 % 4 = 2
pembagian)

Contoh :
<script>
var x = 4;
var y = 2;
z = x + y;
alert(z);
</script>
F. Operator String
Selain operator pembanding, operator string pada JavaScript juga mengenal satu operator
lagi yang bernama PENGGABUNGAN. Operator ini digunakan untuk menggabungkan beberapa
string menjadi sebuah string yang lebih panjang. Contoh :
nama = ”Java” + ”Script”;
akan menghasilkan ”JavaScript” pada variabel nama
Contoh Script String JAVASCRIPT :

<HTML>
<HEAD><TITLE>Operasi Aritmatika</TITLE></HEAD>
<BODY>
<P><SCRIPT language="JavaScript">
<!--
document.writeln("<PRE>");
document.writeln("<H1>Operasi Aritmatik</H1>");
var A = "100";
var B = "200";
var C = 300;
var D = 400;
var E = A + B;
document.writeln('"100" + "200" = ' + E);
E = B + C;
document.writeln('"200" + 300 = ' + E);
E = C + D;
document.writeln('300 + 400 = ' + E);
document.writeln("<PRE>");
//-->
</SCRIPT></P>
</BODY>
</HTML>
OBYEK WINDOWS
A. Membuka Window di Javascript
Untuk membuka window di javascript adalah dengan metode open() Sintaks :
window.open(url, nama_window, konfigurasi). Contoh :
window.open(“http://www.google.com”,”windowku”,”width=300,height=200”); Untuk konfigurasi
yang bisa diset sebagai berikut :

Contoh :

B. Mereload, Menutup, Meloading Halaman Baru, Print


Untuk mereload window adalah dengan cara :
window.location.reload()
Untuk menutup window adalah dengan cara:
window.close()
Untuk meloading halaman baru adalah:
window.location="urlkamu.com" kode di atas akan sama jika anda mengklik suatu link:
<a href=”urlkamu.com”>urlkamu</a>
Untuk mengeprint halaman web
window.print()

C. Alert, Confirm dan Prompt


Alert digunakan untuk menampilkan window alert. Contoh :
<script>
alert(“Hellow World!!”);
</script>
Hasil :

cofirm, digunakan untuk memunculkan window konfirmasi atau semacam pertanyaan yang
jawabannya antara OK atau Cancel.
prompt, digunakan untuk meminta inputan melalui window
Contoh:
<script type="text/javascript">
var y=window.prompt("Masukkan nama anda")
window.alert(y)
</script>
Hasilnya :
 IMPLEMENTASI JAVASCRIPT PADA KEHIDUPAN SEHARI-HARI
 Pada Game
Javascript kebanyakan di gunakan untuk kebutuhan membuat animasi, tapi tidak semata-
mata javascript hanya bisa dipakai untuk membuat animasi. Selain untuk buat
animasi, javascript juga bisa dipakai untuk membuat aplikasi web, salah satunya
adalah Game. yuk langsung aja disimak tutorial membuat game pinball dengan
javascript nya dibawah ini :
Pertama, copy css berikut dan pastekan sebelum tag </head>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/schteppe/poly-
decomp.js/1ef946f1/build/decomp.min.js"></script> <script
src="https://cdn.rawgit.com/liabru/matter-js/0895d81f/build/matter.min.js"></script>
<script src="https://cdn.rawgit.com/liabru/matter-attractors/c470ed42/build/matter-
attractors.min.js"></script>

 Tiket Online
Seiring perkembangan zaman penjual tiket tidak hanya menjual tiketnya di kios dan di
tempat umum, kini sedang marak maraknya jualan online, jangan ketinggalan teknologi.
Lagipula jualan tiket online punya banyak kelebihan.
Form yang akan kita buat lebih mirip dengan kalkulator, fungsinya menghitung harga tiket
yang harus dibayar.
 MASALAH YANG DIHADAPI JAVASCRIPT PADA BROWSER

Javascript adalah sebuah bahasa pemrograman sering kali digunakan pada


sebuah situs agar lebih dinamis. Javascript ini digunakan untuk menampilkan
berbagai jenis elemen dan efek pada sebuah situs. Contohnya tombol Like atau Love
yang sering ditemukan pada banyak sekali situs maupun efek rollover pada teks agar
lebih menarik.
Maka dari itu, bisa dikatakan kalau Javascript merupakan salah satu hal yang
penting untuk bisa menikmati dan mendapatkan pengalaman penuh dari situs yang
kamu kunjungi. Jadinya sebisa mungkin kamu harus selalu mengaktifkan Javascript
di setiap browser yang digunakan. Namun, ada kala juga kamu harus mematikannya
atau secara tidak sengaja menjadi nonaktif.
Jika hal itu terjadi beberapa situs mungkin akan memunculkan notifikasi “You have
a problem with your Javascript” atau kamu tidak bisa menggunakan beberapa fitur
yang ditawarkan oleh situs tersebut. Tentu saja ini merupakan hal yang menyebalkan,
salah satu contohnya seperti dibawah ini :
Dari gambar diatas banyak browser dari browser yang lama tidak support dengan javascript
yang baru dikarenakan beberapa script code yang terbaharukan .

 TUGAS
TUJUAN :
 Siswa memahami tentang Javascript serta dapat menuliskan kode-kode Javascript
terutama untuk membuat teks di layar dan mendapatkan nilai dari user.
 Mempresentasikan Javascript yang sebelumnya sudah dipelajari
MATERI :
 Pengenalan Javascript
 Cara penulisan Javascript
 Tag <SCRIPT>...</SCRIPT>
 Pengenalan tentang obyek
PRAKTIKUM I :
1. Ketikkan Kembali Script Kode dibawah ini :

Penilaian Tugas :
No Penilaian Point
1 Jika Tampilan Sesuai dan Script Benar 3
2 Jika Tampil dan script typo 2
3 Jika Hasil Tidak Tampil dan Script Typo 1
4 Jika Tidak Mengerjakan 0

 Evaluasi
Soal Pilihan Ganda !!
1. Di dalam sebuah kode script ada tertulis seperti ini <input type=”button”
value=”klik disini” onclick=”klik()”, event(kejadian) apa yang digunakan dalam
kode script tersebut …
a. Alert
b. Confirm
c. document.write
d. onmouseout
e. onclik

2. Di dalam sebuah kode script ada tertulis seperti ini document.bgColor="red",


apakah arti dari kode script tersebut …
a. Memberikan warna merah pada background page
b. Memberikan warna merah untuk tulisan pada page
c. Memberikan warna tulisan pada setiap document
d. Memberikan warna merah pada link document
e. Memberikan warna merah pada link dari halaman web
 Penutup
Puji dan Syukur Atas Karunia Allah SWT, atas rahmat dan hidayahnya sehingga penulis
bisa menyelesaikan modul mata pelajaran pemrograman web dan perangkat bergerak.
Diharapkan dari modul ini memberikan informasi tentang JAVASCRIPT. Penulis sadar bahwa
modul ini memiliki banyak kekurangan sehingga membutuhkan kritik dan saran. Dari
pembaca, jika ingin menghubungi bisa mengubungi. Whatsapp : 082320328526 / Email :
abdurrohimfajar5@gmail.com.
DAFTAR PUSTAKA
1. https://www.petanikode.com/javascript-variabel/
2. https://www.duniailkom.com/javascript-uncover-panduan-belajar-javascript-untuk-
pemula/comment-page-1/
3. Modul : BENGKEL INTERNET PENS-ITS
4. http://blog.codingwear.com : Modul Javascript Guide Oleh Desrizal
LINK MODUL SAYA DI CANVA

Link Modul Saya : http://bit.do/ Beginner-Javascript


Barcode Modul :

Anda mungkin juga menyukai