» Unlabelled » JavaScript

Monday, September 9, 2019

JavaScript

Posted by on Monday, September 9, 2019

JavaScript adalah bahasa script yang di-interpreteroleh browser (client-side). Pada awalnya bahasa ini dinamakan “LiveScript” yang berfungsi sebagai bahasa sederhana untuk browser Netscape Navigator 2. Sintaks penulisan JavaScript memiliki kemiripan dengan bahasa pemrograman Java atau C yang bisa diterapkan dalam JavaScript, tetapi perlu diingat JavaScript tidak sama dengan Java.
Penulisan kode JavaScript diletakkan di antara tag HTML. Dengan menambahkan JavaScript akan membuat halaman web menjadi lebih menarik dan interaktif. Menggunakan JavaScript memungkinkan kustomisasi terhadap dokumen HTML pada saat diakses dengan menulis melalui penanganan event terhadap elemen-elemen tag HTML dalam halaman tersebut, memeriksa data form pada sisi client dan melakukan perhitungan pada sisi client hingga membuat animasi kursor mouse dan sebagainya.
Sintaks penulisan Java Script sebagai berikut :
<script language=”javascript”>
<!--
//pendefinisian variabel atau objek
/*statement-statement javascript*/
//-->
</script>

Cara Penulisan JavaScript
Script JavaScript dapat ditempatkan pada :
1.      Body dalam dokumen HTML
<body>
<script language=”javascript”>
<!--
//pendefinisian variabel atau objek
/*statement-statement javascript*/
//-->
</script>
</body>

2.      Header, dalam bentuk function
<head>
<script language=”javascript”>
Function namafunction(parameter input)
{
    //baris kode fungsi di sini dan diakhiri  oleh “;”
}
</script>
</head>




3.      Terpisah dari dokumen HTML (Eksternal JavaScript). Bilamana JavaScript diletakkan pada file (file.js) terpisah maka file tersebut dapat dipanggil dengan cara :
<script language=”javascript” src=”path/file.js></script>
Tampilan Web dengan JavaScript
JavaScript dapat "menampilkan" data dalam beberapa cara:
  • Menulis ke dalamalert box, menggunakan window.alert().
Untuk menampilkan data data, dapat digunakan alert box:
Contoh :
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
window.alert(5 + 6);
</script>

</body>
</html>

  • Menulis ke dalam keluaran HTML menggunakan document.write().
Untuk keperluan pengujian, dimungkinkan untuk menggunakan  document.write():
Contoh :
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
document.write(5 + 6);
</script>

</body>
</html>

Penggunaan document.write() setelah seluruh dokumen HTML terbuka, akan menghapus semua HTML yang ada. Sehingga penggunaan document.write(), hanya untuk keperluan pengujian saja.
Contoh :
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<button onclick="document.write(5 + 6)">Try it</button>

</body>
</html>

  • Menulis ke dalam elemen HTML,menggunakan innerHTML.
Untuk mengakses sebuah elemen HTML, JavaScript dapat menggunakan method document.getElementById(id) method.
Atribut id mendefinisikan elemen HTML. Properti InnerHTML mendefinisikan konten HTLM. Untuk “menampilkan data” di HTLM, (dalam banyak kasus) dapat di-set nilai dari properti innerHTML
Contoh:
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My First Paragraph</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>

</body>
</html>

  • Menulis ke dalam console browser, menggunakan console.log().
Contoh :
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
console.log(5 + 6);
</script>

</body>
</html>

Pernyataan-Pernyataan JavaScript
Pernyataan-pernyataan JavaScript disusun oleh Nilai, Operator, Eksrpesi, Kata Kunci dan Komentar-Komentar
Nilai-Nilai JavaScript
Aturan penulisan JavaScript mendefinisikan dua jenis nilai, yakni nilai tetap dan nilai berubah. Nilai tetap disebut literal. Nilai berubah disebut variables.
Literal-literal JavaScript
Aturan yang paling penting dalam penulisan nilai tetap adalah angka-angka ditulis dengan atau tanpa tanda desimal.
Contoh :
10.50
1001
Strings adalah teks, penulisannya diantara tanda petik dua atau tanda petik satu.
Contoh:
"John Doe"
'John Doe'

Variabel-variabel JavaScript
Dalam bahasa pemrograman, variabel-variabel digunakan untuk menyimpan nilai data. JavaScript menggunakan kata kunci var untuk mendeklarasikan variabel. Tanda sama dengan digunakan untuk memasukkan nilai ke dalam variabel. Pada contoh berikut, x didefinisikan  sebagai sebuah variabel. Kemudian, x diberikan nilai 6.
Contoh :
var x;
x = 6;

Operator-operator JavaScript
JavaScript menggunakan operator aritmetika ( + - *  / ) untuk menghitung nilai.
Contoh :
(5 + 6) * 10

Ekspresi-ekspresi JavaScript
Sebuah ekpresi adalah kombinasi dari nilai, variabel dan operator untuk menghitung sebuah nilai.
Contoh :
5 * 10
Eksrpesi dapat juga berisi nilai variabel.
Contoh :
x * 10
nilai-nilai dapat berupa tipe yang bervariasi, misalnya berupa angka-angka dan string. Sebagai contoh, "John" + " " + "Doe", dimaksudkan "John Doe":
"John" + " " + "Doe"
Kata-kata kunci JavaScript
Kata-kata kunci JavaScript digunakan untuk mendefinsikan aksi-aksi yang dilakukan. Kata kunci var “menyuruh” browser untuk menciptakan variabel-variabel.
Contoh :
var x, y;
x = 5 + 6;
y = x * 10;

Komentar-Komentar JavaScript
Tidak semua pernyataan-pernyataan JavaScript  yang “dieksekusi”. Kose setelah tanda dua buah garis miring // atau antara /* dan */ dianggap sebagai sebuah komentar. Komentar dilewati, dan tidak akan dieksekusi.
Contoh :
var x = 5;   // I will be executed
// var x = 6;   I will NOT be executed

Aturan Penulisan Function (Fungsi) JavaScript
Sebuah fungsi JavaScript didefinisikan dengan kata kunci function, yang diikuti oleh sebuah nama kemudian diikuti oleh tanda kurung buka dan kurung tutup (). Nama fungsi dapat berupa huruf, angka, garis bawah dan tanda dollar. Kurung buka dan kurung tutup dapat berisi parameter yang dipisahkan oleh koma(parameter1, parameter2, ...). Kode yang akan dieksekusi oleh fungsi ditempatkan di antara tanda kurung kurawal buka dan kurung kurawal tutup.
Contoh :
function name(parameter1, parameter2, parameter3) {
    code to be executed
}
parameter-parameter fungsi diurutkan dalam definisi fungsi. Argument-argumen fungsi adalah nilai-nilai asli yang diterima ketika fungsi dipanggil. Di dalam fungsi, argumen (parameter) bertindah sebagai variabel lokal.
Pemanggilan Fungsi
Kode di dalam fungsi akan dieksekusi ketika “sesuatu” memanggil fungsi, yaitu :
  • Ketika sebuah event terjadi (ketika pengguna meng-klik sebuah tombol).
  • Ketika fungsi tersebut dipanggil dari kode JavaScript
  • Secara otomatis (pemanggilan diri sendiri)
Keluaran dari Fungsi
Ketika JavaScript sampai pada pernyataan return, fungsi akan berhenti mengeksekusi. Jika fungsi dipanggil dari sebuah pernyataan, JavaScript akan “mengembalikan” kepada kode setelah pernyataan pemanggilan. Fungsi sering menghitung sebuah keluaran nilai. Nilai “dikembalikan” kepada pemanggil.
Contoh : menghitung perkalian dua bilangan dan mengembalikan hasilnya.
var x = myFunction(4, 3);        // Function is called, return value will end up in x

function myFunction(a, b) {
    return a * b;                // Function returns the product of a and b
}

hasilnya adalah :12
Mengapa menggunakan Fungsi?
Kode dapat digunakan kembali: pendefinisian satu kali dan penggunaannya berulang kali. Penggunaan kode yang sama berulang kali dengan argumen-argumen yang berbeda, untuk menghasilkan hasil yang berbeda pula.
Contoh : Konversi Fahrenheit  ke Celcius
function toCelsius(fahrenheit) {
    return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius(77);

The () Operator Invokes the Function
Gunakan contoh di atas, toCelsius mengacu pada objek fungsi dan toCelsius() mengacu pada hasil fungsi.
Contoh :
Pengaksesan sebuah fungsi tanpa () akan mengembalikan definisi fungsi.
function toCelsius(fahrenheit) {
    return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius;

Fungsi digunakan sebagai nilai dari variabel
Fungsi dapat digunakan seperti halnya penggunaan variabel, dalam semua rumus, penetapan nilai dan perhitungan.
Contoh penggantian variabel untuk menyimpan hasil keluaran dari fungsi.
var x = toCelsius(77);
var text = "The temperature is " + x + " Celsius";

fungsi dapat digunakan secara langsung, seperti nilai variabel, contoh :
var text = "The temperature is " + toCelsius(77) + " Celsius";

No comments :

Post a Comment

Subscribe to: Post Comments ( Atom )
Terimakasih Telah Berkunjung Ke Blog Kami :)