JavaScript · Membuat sebuah konstanta bisa menggunakan operator assignment (=) seperti pada saat...

JavaScript

Cara Akses JS (1)

Inline. Yang dimaksud disini adalah syntax javascript dibuat pada suatu event (misal:

onload, onclick, onmouseover, dll) di element/tag nya secara langsung.

<body onload=“alert(‘Hai’);”></body>

JavaScript | Aditya Wicaksono 2

Cara Akses JS (2)

Internal. Syntax javascript dibuat pada element/tag script.

<script>

alert(‘Hai’);

</script>


Cara Akses JS (3)

Eksternal. Syntax javascript dibuat pada file tersendiri yang berekstensi *.js

Untuk memanggilnya digunakan element/tag script yang merujuk kepada file javascript.

<script src=“script.js”></script>

script.js

alert(‘Hai’);


Variabel

Variabel adalah wadah untuk menyimpan suatu nilai. Pada Javascript, syarat variabel

diantaranya:

Nama variabel dapat berisi huruf, angka, karater underscores _, dan karakter dollar $.

Nama variabel harus diawali huruf

Nama variabel bisa diawali dengan karakter _ dan $

Nama variabel bersifat case-sensitive (misal, variabel y dan Y berbeda)

Kata kunci bawaan milik Javascript tidak bisa dipakai untuk nama variabel.


Selector

Id

window.document.getElementById(‘id’);

Class

window.document.getElementsByClassName(‘class’);

Name

window.document.getElementsByName(‘name’);

Element

window.document.getElementsByTagName(‘tag’);


Output

Bagaimana menampilkan hasil pemrograman Javascript? Banyak cara yang bisa

digunakan, antara lain:

Mencetak output kedalam elemen HTML dengan innerHTML.

Mencetak output ke HTML dengan document.write().

Mencetak output dengan alert box window.alert().

Mencetak ouput ke konsol browser dengan console.log().


Tipe Data

Tipe data adalah jenis dari data yang digunakan pada sebuah variabel. Javascript mendukung tipe data berikut:

String adalah susunan dari huruf, angka dan karakter lainnya, seperti "Halo Coders!". String ditulis dengan diapit oleh tanda kutip " atau tanda petik '.

Number adalah tipe data angka yang bisa ditulis dengan desimal maupun tidak.

Boolean adalah tipe data yang hanya memiliki dua nilai: true atau false.

Array adalah tipe data yang ditulis dengan kurung kurawal {} dan isi array dipisahkan dengan koma ,.

Object adalah tipe data yang ditulis dengan kurung siku [] dan properti object ditulis dengan sepasang nama:nilai yang kemudian dipisahkan dengan tanda koma ,.

null adalah nilai yang dapat digunakan untuk menunjukkan sesuatu yang tidak ada, null memiliki tipe data object.

undefined adalah nilai bawaan variabel yang ditulis tanpa isi.


Konstanta

Konstanta adalah sebuah nama (seperti variabel) untuk menyimpan suatu nilai. Berbeda

dengan variabel, nilai dari konstanta tidak dapat diubah setelah dia didefinisikan.

Membuat sebuah konstanta bisa menggunakan operator assignment (=) seperti pada

saat membuat variabel, namun diawal variabel tambahkan const.


Operator Aritmatika

Operator digunakan untuk melakukan operasi terhadap suatu nilai dan variabel.

Operator Aritmatika digunakan untuk melakukan operasi aritmatik terhadap nilai numerik,

seperti penjumlahan, pengurangan, perkalian, pembagian, dan sebagainya.


Operator Penugasan (Assignment)

Operator penugasan (assignment) digunakan untuk menuliskan nilai pada suatu variabel.

Operator penugasan yang paling umum digunakan adalah operator = (sama dengan).

Operator ini digunakan untuk mengisi variabel yang ada di sebelah kiri dengan nilai yang

ada di sebelah kanan. Misalnya x = 3 berarti kita mengisi variabel x dengan nilai 3. Atau x

= y yang berarti kita mengisi variabel x dengan nilai yang ada di dalam variabel y.

Selain itu, kita dapat menyisipkan operator aritmatika sebelum tanda =, yang berarti

mengisi variabel di sebelah kiri operator dengan hasil operasi dari variabel sebelah kiri

sebelum diisi dengan nilai di sebelah kanan.


Operator Perbandingan

Operator perbandingan digunakan untuk membandingkan dua buah nilai numerik atau

string. Output dari operasi ini adalah nilai true atau false.


Operator Increment-Decrement

Operator increment-decrement adalah operator yang digunakan untuk menaikkan atau

menurunkan sebanyak satu dari nilai variabel yang dikenai operasi. Operator increment

adalah tanda ++ yang disimpan sebelum atau sesudah variabel, dan operator

decrement adalah tanda -- yang disimpan sebelum atau sesudah operasi.


Operator Logika

Operator logika digunakan untuk mengkondisikan pernyataan kondisi. Kondisi yang

dimaksud adalah nilai variabel atau hasil perbandingan variabel dalam tipe data

boolean (TRUE dan FALSE). Operator logika yang tersedia diantaranya and, or, xor dan

not.


Operator String

Operator string sangat membantu dan akan sering digunakan pada operasi yang

berkaitan dengan data string. Operasi yang dimaksud adalah konkatenansi

(perangkaian) atau penggabungan dua buah string, dan operator yang digunakan

adalah tanda +. Selain itu, operator konkatenansi ini juga dapat digunakan pada operasi

assignment, seperti halnya operator aritmatika.


Statemen If

Seringkali kita harus melakukan suatu operasi hanya pada kondisi tertentu saja. Artinya kita mengecek terlebih dahulu sebuah kondisi, yang apabila kondisi tersebut terpenuhi (atau bernilai true), maka kita lakukan serangkaian operasi.

Statemen if digunakan untuk mengecek kondisi dan bila kondisi bernilai true, maka program tertentu akan dijalankan. Penulisan sintaksnya adalah:

if(kondisi) {

// kode untuk dieksekusi bila kondisi bernilai true

}

Pada bagian kondisi, kita isi dengan suatu variabel yang nantinya akan dicek nilainya. Variabel bernilai false, null, string kosong atau 0 akan menghasilkan output false, dan selain nilai tersebut akan memberikan output true. Selain itu kita juga dapat membandingkan variabel menggunakan operator perbandingan dan operator logika, atau hasil keluaran dari sebuah fungsi.


Statemen if..else

Adakalanya kita harus mengeksekusi satu blok kode program saat suatu kondisi terpenuhi,

dan mengeksekusi blok kode program lain yang berbeda bila kondisi tidak terpenuhi.

Untuk itu kita gunakan statemen if..else.

if (kondisi) {

// kode untuk dieksekusi bila kondisi bernilai TRUE

} else {

// kode untuk dieksekusi bila kondisi bernilai FALSE

}


Switch

Statemen switch digunakan untuk menjalankan satu diantara banyak blok kode

berdasarkan kecocokan nilai yang dievaluasi.

Pada statemen switch, nilai variabel akan dievaluasi kecocokannya untuk setiap case.

Bila ditemukan kecocokan pada salah satu case, maka blok kode pada case tersebut

akan dijalankan. Umumnya blok kode pada setiap case diakhiri dengan perintah break;

agar program langsung keluar dari blok statemen switch dan tidak perlu lagi mengecek

sisa case di bawahnya.

Apabila tidak ada case yang cocok dengan nilai variabel, maka blok kode pada bagian

default yang akan dijalankan.


Switch

switch(variabel){

case a:

// blok kode A

break;

case b:

// blok kode B

break;

...

default:

// blok kode default

}


Pengertian Array (1)

Pada pembahasan tipe data terdahulu sudah dijelaskan sekilas tentang Array. Array

(dikenal juga dengan istilah larik) adalah tipe data khusus yang dapat menyimpan lebih

dari satu nilai dalam satu variabel. Misalnya kita punya beberapa nama hewan yang

ingin diproses di dalam program, maka kita dapat menyimpan ke dalam variabel seperti

ini:

var hewan1 = "ayam";

var hewan2 = "sapi";

var hewan3 = "kuda";


Pengertian Array (2)

Permasalahannya sekarang adalah bagaimana bila kita hendak melakukan pencarian nama hewan diantara daftar nama tersebut? Selain itu bagaimana bila kita ingin mencetak semua daftar nama yang boleh jadi tidak hanya ada 3-4 buah, tapi ratusan? Disinilah peran Array. Bila data nama hewan di atas disimpan dalam bentuk array, maka sintaks penulisannya seperti ini:

var hewan = ["ayam", "sapi", "kuda"];

Apabila kita hendak memanggil nilai dari array tersebut, kita dapat memanggil dengan menggunakan nomor indeksnya.

hewan[0]; // Berisi nilai "ayam“hewan[1]; // Berisi nilai "sapi“hewan[2]; // Berisi nilai "kuda“

Indeks adalah nomor posisi nilai di dalam array. Nomor indeks dimulai dari 0.


Array Asosiatif (1)

Banyak bahasa pemrograman yang mendukung array asosiatif. Array asosiatif adalah

array yang menggunakan indeks nama. Namun, Javascript tidak mendukung array

asosiatif. Array di Javascript selalu menggunakkan indeks bilangan.

Adapun penggantinya adalah objects, dimana kita bisa menggunakan indeks nama

agar lebih informatif.

Sintaks

objects = {name:value, ..., name:value}


Array Asosiatif (2)

Misal

var kuliner = {};kuliner['makanan'] = 'sate’;kuliner['negara'] = 'Indonesia’;

Kode di atas juga dapat ditulis seperti ini:

var kuliner = {makanan: 'sate’,negara: 'indonesia’,

}

Perhatikan penulisan object. Antara nama indeks dan nilai terdapat operator : yang berfungsi sebagai penghubung antara indeks dan nilainya.


Perulangan dengan while (1)

Statemen perulangan while akan menjalankan blok kode berulang-ulang selama kondisi

masih bernilai true.

while (cek kondisi) {

// kode yang akan dijalankan berulang

}


Perulangan dengan while (2)

Sebagai contoh kode berikut:

var x = 1;

while(x <= 5)

{

document.write( x+'<br/>' );

x++;

}

Pada kode di atas, program akan mencetak nomor 1 sampai dengan 5. Statemen while akan mengecek kondisi, yang apabila nilainya true, dia akan menjalankan blok kode di dalamnya. Statemen while akan terus dijalankan sampai kondisi pada while bernilai false. Sehingga kita harus menyiapkan skenario agar kondisi bernilai false. Pada kode di atas kita menambah nilai variabel x sebanyak 1 setiap kali blok kode pada while dijalankan, agar sampai pada kondisi nilai x lebih dari 5 sehingga pengecekan kondisi bernilai false.


Perulangan dengan do..while

Statemen do..while mirip seperti statemen while, yakni menjalankan blok kode berulang-ulang selama kondisi yang dicek bernilai true.

do {


} while (cek kondisi);

Perbedaan statemen do..while dibanding while adalah pada do..while blok kode dijalankan terlebih dahulu baru kemudian dilakukan pengecekan kondisi. Bila kondisi bernilai true maka blok kode akan dijalankan kembali.

Dari sini dapat kita lihat bahwa pada statemen do..while, blok kode akan dijalankan paling tidak satu kali meskipun kondisi bernilai false. Berbeda dengan statemen while yang mana pengecekan kondisi dilakukan di awal, yang bila kondisi bernilai false, maka blok kode tidak akan pernah dijalankan.


Perulangan dengan for (1)

Pada statemen while dan do..while, kondisi yang dicek tidak mesti berupa angka yang diiterasi, tapi bisa juga pengecekan kondisi lain yang kita tak perlu ketahui berapa kali harus dijalankan. Sedangkan statemen perulangan for lebih khusus digunakan apabila kita hendak mengulang eksekusi blok kode sebanyak angka yang kita tentukan.

for (inisiasi counter; cek kondisi; naikkan counter) {


}

Parameter pertama adalah inisial variabel yang akan dijadikan penghitung.

Parameter kedua adalah pengecekan kondisi variabel. Bila kondisi bernilai true, blok kode akan dijalankan.

Parameter ketiga untuk menaikkan/menurunkan nilai variabel setiap kali blok kode selesai dijalankan.

Setiap parameter dipisahkan dengan tanda titik koma.


Perulangan dengan for (2)

var x;

for(x=0;x<5;x++)

{

console.log( 'Nomor: '+ x + '<br/>' );

}

Statemen for membuat proses perulangan dengan jumlah tertentu ditulis dalam bentuk

kode yang lebih ringkas.


Perulangan dengan foreach (1)

Perulangan dengan statemen foreach hanya berlaku pada variabel array, digunakan untuk mengulang membaca setiap elemen array.

Array.forEach(function(value)

{


})

Untuk setiap iterasi, nilai dari setiap elemen dapat diambil melalui variabel value. Pointer array akan menyusuri satu per satu elemen array hingga sampai pada elemen terakhir.


Perulangan dengan foreach (2)

var warna = new Array('merah','jingga','kuning');

warna.forEach(function(value)

{

console.log(value + '<br/>');

});

Pada contoh kode di atas, kode foreach akan menyusuri satu per satu elemen array

warna, kemudian nilai setiap elemen dapat diakses melalui variabel value. Pada blok

kode variabel value ini dicetak satu per satu dari awal hingga akhir elemen.


Memahami Fungsi

Seringkali kita harus melakukan serangkaian operasi yang sama di banyak tempat, seperti

menghitung rumus, mencetak suatu template, dan lain sebagainya. Akan sangat

merepotkan bila kita harus menulis kode yang sama di banyak tempat. Bayangkan bila

kita harus memperbaharui operasi tersebut, maka kita harus mengubah di banyak

tempat. Permasalahan ini dapat diselesaikan salah satunya menggunakan fungsi

(function). Fungsi adalah blok kode yang dapat dipanggil berulang pada program.


Membuat Fungsi (1)

Kita dapat membuat fungsi sendiri untuk kebutuhan yang lebih spesifik pada aplikasi kita.

Berikut adalah sintaks untuk mendeklarasikan fungsi:

function namafungsi() {

// blok kode fungsi

}

Membuat fungsi diawali dengan kata kunci function diikuti nama fungsinya dan kurung

buka dan kurung tutup. Kemudian blok kode fungsi ditulis di dalam kurung kurawal. Nama

fungsi bersifat case sensitive.


Membuat Fungsi (2)

function cetakPesan()

{

console.log('Halo Coder!');

}

Pada contoh di atas kita membuat fungsi dengan nama cetakPesan(). Fungsi tersebut memiliki satu buah baris kode di dalamnya, yakni mencetak teks bertuliskan "Halo Coder!". Blok kode di dalam fungsi tidak akan dijalankan sampai fungsi tersebut dipanggil. Cara memanggil fungsi adalah dengan menuliskan nama fungsinya diikuti oleh kurung buka dan kurung tutup.

cetakPesan();


Membuat Fungsi (3)

Ketika kita membuat suatu event, kita dapat memanggil fungsi yang telah kita definisikansebelumnya maupun langsung mendefinisikan fungsi anonym.

<button id=“x”>Klik</button>

<script>

var elem = window.document.getElementById(‘x’);

elem.onclick = function () {

alert(‘Hai’);

}

</script>


Tugas

https://www.w3schools.com/js/js_quiz.asp


JavaScript · Membuat sebuah konstanta bisa menggunakan operator assignment (=) seperti pada saat...

Documents

Transcript of JavaScript · Membuat sebuah konstanta bisa menggunakan operator assignment (=) seperti pada saat...