JavaScript

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.

Misal

var nama = 'Fauziah';
var $ttl = 'Bandung, 23 September 1995';
var gend3r = 'Perempuan';
var _alamat = 'Jl Sirna galih No 32 Bandung';
var kd_ps = 40195;
var Pddkn_trkhr = 'S1';



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.

Op                  Nama            Contoh               Keterangan
+              Penjumlahan         x + y     Penjumlahan nilai x dan y
-               Pengurangan        x - y       Pengurangan nilai x oleh y
*              Perkalian                x * y       Perkalian nilai x dan y
/               Pembagian           x / y       Pembagian nilai x oleh y
%             Modulus               x % y      Sisa dari pembagian x oleh y


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. Agar lebih paham, perhatikan tabel berikut:

Contoh        Serupa                                             Keterangan
x += y          x = x + y          x diisi dengan nilai dari x sebelumnya ditambah nilai y
x -= y            x = x - y         x diisi dengan nilai dari x sebelumnya dikurangi nilai y
x *= y           x = x * y          x diisi dengan nilai dari x sebelumnya dikali nilai y
x /= y            x = x / y           x diisi dengan nilai dari x sebelumnya dibagi nilai y
x %= y          x = x % y         x diisi dengan sisa nilai dari x sebelumnya dibagi nilai y


 
Operator Perbandingan

Operator perbandingan digunakan untuk membandingkan dua buah nilai numerik atau string. Output dari operasi ini adalah nilai true atau false.

 
Op            Nama                                  Contoh                                       Hasil
==       Sama dengan                            x == y          TRUE bila nilai x sama dengan y
===     Identik                                      x === y         TRUE bila nilai x sama dengan y, DAN tipe data  keduanya sama
 
!=       Tidak sama dengan                    x != y           TRUE bila nilai x tidak sama dengan y
!==     Tidak identik                              x !== y          TRUE bila nilai x tidak sama dengan y, ATAU tipe data keduanya berbeda
 
>         Lebih dari                                    x > y            TRUE bila nilai x lebih dari y
 
<         Kurang dari                                 x < y            TRUE bila nilai x kurang dari y
 
>=       Lebih dari atau sama dengan      x >= y           TRUE bila nilai x lebih dari atau sama dengan y
 
<=       Kurang dari atau sama dengan    x <= y           TRUE bila nilai x kurang dari atau sama dengan y



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.

Agar lebih jelas lihat tabel berikut:

Operator               Nama                                                        Keterangan
++x                    pre-increment         tambah nilai x sebanyak 1, kemudian kembalikan nilai x
x++                    post-increment       kembalikan nilai x, lalu tambah nilai x sebanyak 1
--x                      pre-decrement        kurangi nilai x sebanyak 1, kemudian kembalikan nilai x
x--                      post-decrement      kembalikan nilai x, lalu kurangi nilai x sebanyak 1



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 titik +. Selain itu, operator konkatenansi ini juga dapat digunakan pada operasi assignment, seperti halnya operator aritmatika.

z = x + y;

Contoh kode di atas artinya kita mengisi variabel z dengan nilai string hasil penggabungan antara nilai variabel x dengan nilai variabel y.


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
}


Statemen if..elseif..else

Adakalanya kita harus mengecek beberapa kondisi dan hanya menjalankan kode dari salahsatu kondisi yang terpenuhi saja. Untuk itu kita dapat menggunakan statemen if..else if..else dst.

if(kondisi a){
   // kode bila kondisi a terpenuhi
} else if(kondisi b){
   // kode bila kondisi b terpenuhi
..
..
} else if(kondisi n) {
   // kode bila kondisi n terpenuhi
} else {
   // kode bila semua kondisi tidak terpenuhi
}
 
if Bersarang

Kita dapat mendeklarasikan statemen if didalam statemen if lainnya untuk pengecekan bersarang. Statemen if pada dasarnya sama seperti kode lainnya, maka kita dapat menyimpan statemen if bersarang dimanapun di dalam blok kode if induknya.

if(kondisi a) {
  if(kondisi b) {
    // jalankan kode
  }
}



Switch

Statemen switch digunakan untuk menjalankan satu diantara banyak blok kode berdasarkan kecocokan nilai yang dievaluasi.

switch(variabel){
   case a:
      // blok kode A
      break;
   case b:
      // blok kode B
      break;
   ...
   default:
      // blok kode default
}

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 (2)

Kita sudah paham bahwa switch akan menjalankan blok kode yang casenya cocok dengan nilai variabel yang dievaluasi. Lalu bagaimana bila kita ingin menjalankan blok kode yang sama untuk beberapa case berbeda? Ada dua solusi. Pertama dengan memasang blok kode yang sama untuk case-case berbeda yang ingin outputnya sama.

var binatang = 'kambing';
switch(binatang)
{
  case 'ayam':
    console.log(binatang + " jumlah kaki 2");
    break;
  case 'sapi':
    console.log(binatang + " jumlah kaki 4");
    break;
  case 'kambing':
    console.log(binatang + " jumlah kaki 4");
    break;
...
}

Akan tetapi switch memperbolehkan cara yang lebih sederhana agar kita tidak perlu mengulang baris kode yang sama.

var binatang = 'kambing';
switch(binatang)
{
  case 'ayam':
    console.log(binatang + " jumlah kaki 2");
    break;
  case 'sapi':
  case 'kambing':
    console.log(binatang + " jumlah kaki 4");
    break;
...

Pada kode di atas kita melihat ada case yang tidak memiliki blok kode. case tanpa blok kode berarti dia mengikuti blok kode yang dimiliki case setelahnya. Contohnya, bila variabel binatang bernilai "sapi" maka dia akan menampilkan output jumlah kaki 4 karena case "sapi" tidak memiliki blok kode, sehingga blok kodenya mengikuti blok kode yang dimiliki case setelahnya yaitu case "kambing".



Pengertian Array

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";
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 Berindeks

Umumnya indeks dari array bertipe integer, dimulai dari 0 hingga n-1 dengan n adalah jumlah elemen di dalam array. Kode berikut:

var sayuran = ['kangkung', 'bayam', 'kol'];

Berarti nilai array indeks ke-0 berisi 'kangkung', indeks ke-1 berisi 'bayam' dan seterusnya. Kita dapat memanggil nilai di dalam array dengan memanggil nama variabel diikuti nomor indeks yang ingin diambil. Nomor indeks ditulis di dalam kurung siku.

sayur = sayuran[0];

Pada kode di atas variabel sayur akan diisi oleh nilai dari elemen array sayuran indeks ke-0, yaitu 'kangkung'.

Kita juga dapat mengisi nilai dari suatu elemen array dengan cara yang sama:

sayuran[0] = 'selada'; sayuran[3] = 'brokoli';

Pada kode di atas kita mengisi array indeks ke-0 menjadi 'selada' dan indeks ke-3 dengan 'brokoli'.


Array Asosiatif

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}

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.


Array Multidimensi

Kita dapat mengisi elemen array dengan nilai bertipe array lagi. Ini dikenal dengan array bersarang atau array multidimensi. Kedalaman array bersarang pada dasarnya tidak terbatas.

var herbivora = new Array('kambing', 'sapi');
var karnivora = new Array('harimau', 'serigala');
var omnivora = new Aray('ayam', 'monyet');

var binatang = new Array(herbivora, karnivora, omnivora);

Pada contoh di atas, kita memiliki tiga buah variabel berisi array, yakni herbivora, karnivora dan omnivora. Kemudian ketiga variabel tersebut kita simpan di dalam satu variabel array binatang. Dengan demikian variabel binatang adalah variabel dengan nilai bertipe array bersarang (berdimensi dua).


Menghitung Jumlah Isi Array

Adakalanya kita perlu mengetahui ada berapa banyak elemen yang terdapat di dalam suatu array. Untuk itu kita dapat menggunakan method Array.length.

var herbivora = new Array('kambing', 'sapi');
var karnivora = new Array('harimau', 'serigala');
var omnivora = new Array('ayam', 'monyet');

var binatang = new Array(herbivora, karnivora, omnivora);
console.log(binatang.length);

Contoh kode di atas akan mencetak angka 3, karena variabel binatang memiliki 3 buah nilai di dalamnya. Untuk menghitung jumlah isi Array herbivora, kita bisa menggunakan indeks baris saja melalui variabel binatang atau bisa juga langsung menggunakan variabel herbivora.

console.log(binatang[0].length);
console.log(herbivora.length);


Perulangan dengan while

Statemen perulangan while akan menjalankan blok kode berulang-ulang selama kondisi masih bernilai true.

while (cek kondisi) {
    // kode yang akan dijalankan berulang
}

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 {
    // kode yang akan dijalankan berulang
} 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

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) {
    // kode yang akan dijalankan berulang
}


    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.
       
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

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

Array.forEach(function(value)
{
  // kode yang akan dijalankan berulang
})

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.

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.


foreach Bersarang

Bagaimana halnya bila kita hendak menampilkan setiap elemen array yang ada di dalam array (array bersarang/multidimensi)? Gunakanlah foreach bersarang.

var herbivora = new Array('kambing', 'sapi', 'kuda');
var karnivora = new Array('harimau', 'serigala', 'anjing');
var omnivora = new Array('ayam', 'monyet', 'beruang');
var binatang = new Array(herbivora, karnivora, omnivora);

Untuk menampilkan semua nilai elemen pada array multidimensi di atas, kita dapat menggunakan foreach seperti berikut:

binatang.forEach(function(jenis)
{
  jenis.forEach(function(nama)
  {
    console.log(nama + '<br/>');
  });
})

foreach pertama mengiterasi variabel array binatang dan setiap elemennya dapat dipanggil pada variabel jenis. Karena nilai variabel jenis juga bertipe array, maka kita panggil variabel tersebut pada foreach kedua. Elemen dari variabel array jenis dapat diakses pada variabel nama.



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

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.

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();



Skup Variabel pada Fungsi

Didalam Javascript dikenal adanya skup variabel local dan global. Ketika kita membuat sebuah variabel di dalam fungsi, maka skup variabel tersebut adalah local yang berarti hanya dapat diakses di dalam fungsi tersebut.

function cetakPesan()
{
  var pesan = 'Halo Coder!';
  console.log(pesan);
}

console.log(pesan);

Pada contoh kode di atas, variabel pesan terdapat di dalam fungsi dan hanya dapat digunakan di dalam fungsi. Kode console.log(pesan); yang ada di luar fungsi akan menghasilkan error pada program yaitu ReferenceError: pesan is not defined.

Begitu pula sebaliknya, variabel yang ada di luar fungsi pada dasarnya tidak dapat diakses dari dalam fungsi.

var pesan = 'Halo Coder!';

function cetakPesan()
{
  console.log(pesan);
}

Pada contoh kode di atas baris kode console.log(pesan); yang ada di dalam fungsi tidak akan menghasilkan apapun (riilnya akan menampilkan pesan error) karena variabel pesan di dalam fungsi adalah variabel baru yang skupnya lokal dan bukan variabel yang ada di luar fungsi.

 
Global secara otomatis

Jika Anda memasukkan nilai ke variabel yang tidak dideklarasikan, secara otomatis akan menjadi variabel GLOBAL.

Kode dibawah ini merupakan contoh, deklarasi variabel global pesan, meskipun nilainya dimasukkan dalam fungsi.

cetakPesan();

function cetakPesan() {
  var pesan = 'Halo Coder!';
  console.log(pesan);
}
Jangan menggunakan variabel global jika memang tak terlalu dibutuhkan. Di Strict Mode variabel secara otomatis akan gagal dideklarasikan.



Argumen Fungsi

Dalam membangun aplikasi riil penggunaan skup global di dalam fungsi tidak efisien. Ada cara yang lebih baik untuk memproses suatu data di dalam fungsi, yakni dengan melewatkan variabel melalui argumen fungsi.

Argumen fungsi adalah variabel yang ada di dalam kurung setelah nama fungsi. Argumen menjadi pintu masuk data yang akan digunakan di dalam fungsi. Kita dapat mengisi argumen fungsi dengan nilai input langsung, nilai default (bawaan), atau nilai referensi.

function selamatDatang(nama)
{
  console.log('Selamat Datang, ' + nama + '<br/>');
}
selamatDatang('Bambang Rahmanto');

selamatDatang("Coder");
var username = 'Bambang Rahmanto';
selamatDatang(username);

Pada contoh di atas, kita membuat fungsi selamatDatang() yang memiliki satu buah argumen nama. Fungsi ini dipanggil dan argumen nama diisi dengan nilai string "Coder". Pada pemanggilan fungsi selanjutnya, argumen diisi dengan variabel username yang bernilai string 'Bambang Rahmanto'.

Kita dapat membuat argumen fungsi lebih dari satu, dengan dipisahkan oleh tanda koma. Saat pemanggilan fungsi, argumen fungsi diisi sesuai urutan penulisan argumen (dari kiri ke kanan) pada deklarasi fungsi.



Argumen Default Fungsi

Apa yang terjadi bila suatu fungsi memiliki misalnya dua buah argumen dan kita hanya mengisi salah satunya atau tidak mengisi kedua argumen tersebut saat pemanggilan? Program tentunya akan memunculkan pesan peringatan bahwa fungsi tersebut memerlukan input pada argumennya.

Namun adakalanya suatu fungsi membolehkan beberapa argumen tidak wajib diisi (opsional). Hal yang sama juga dapat kita lakukan pada fungsi yang kita buat sendiri, yakni dengan mendefinisikan nilai bawaan pada argumen.

function cetakPesan(nama, bahasa='id')
{
  var pesan = 'Selamat datang, ' + nama;
  if(bahasa == 'en')
  {
    pesan = 'Welcome, ' + nama;
  }
  console.log(pesan);
}
var nama = 'Bambang';
cetakPesan(nama);

Sebagai contoh, fungsi cetakPesan() di atas memiliki dua buah argumen. Argumen nama wajib diisi saat pemanggilan fungsi karena tidak diset nilai bawaannya, sedangkan argumen bahasa tidak wajib diisi karena sudah memiliki nilai default.



Argumen Referensi pada Fungsi

Ketika kita melewatkan variabel ke dalam argumen sebuah fungsi, nilai yang ada di dalam variabel tersebut tidak akan berubah.

function kuadrat(angka)
{
  angka.key *= angka.key;
}

var x = {key:5};
console.log('sebelum dikuadratkan: ' + x['key'] + '<br/>');
kuadrat(x);
console.log('setelah dikuadratkan: ' + x['key'] + '<br/>');

Pada kode di atas, nilai awal x adalah 5. Saat fungsi kuadrat(x) dipanggil, fungsi tersebut akan mengkuadratkan nilai variabel argumen dan mencetaknya. Adapun variabel x setelah proses pemanggilan fungsi kuadrat() bernilai 25.



Mengembalikan Nilai Fungsi

Sejauh ini kita sudah belajar membuat fungsi untuk mengerjakan sejumlah proses yang dapat dipanggil secara berulang. Tapi di banyak kesempatan kita tidak hanya perlu menjalankan sejumlah kode dan mencetak output, tapi juga menerima hasil dari proses yang dikerjakan. Seperti contoh fungsi Date() yang bila dipanggil dia mengembalikan nilai tanggal sekarang.

var tanggal = Date();
console.log(tanggal);

Pada contoh kode di atas, variabel tanggal akan bernilai tanggal searang karena dia menerima nilai dari fungsi Date().

Pada deklarasi fungsi sendiri, kita dapat mengembalikan nilai hasil pemanggilan suatu fungsi dengan menggunakan kata kunci return.

function luasSegitiga(alas, tinggi){
    luas = alas * tinggi / 2;
    return luas;
}

//mencetak nilai 10
console.log(luasSegitiga(5,4));

// variabel `hasil` bernilai 15
console.log(hasil);

Fungsi luasSegitiga() di atas menerima 2 argumen alas dan tinggi dan mengembalikan nilai luas segitiga berdasarkan nilai argumen yang dilewatkan.



Mengenal String

Javascript string digunakan untuk menyimpan dan memanipulasi teks.


 
Javascript strings

Javascript string secara sederhana menyimpan rangkaian karakter seperti Bambang Rahmanto. String dapat ditulis dengan tanda kutip. Kamu dapat menggunakan kutip tunggal maupun ganda.

Misal,

var nama_mobil = 'Lamborghini';

Kamu dapat menggunakan kutip sebagai string, dengan catatan, tanda kutip yang digunakan untuk mengapit string berbeda dengan kutip yang didalam string.

Misal,

var salam = "Assalamu'alaikum";
var salam = 'Wa"alaikum salam';

 

Panjang String

Panjang string dapat dihitung dengan properti length.

Misal,

var abjad = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
var panjang_string_abjad = abjad.length;

 

Menggunakan Karakter Spesial

Karena string harus ditulis dengan tanda kutip, Javascript tidak bisa memahami string yang berisi tanda kutip yang sama.

Misal,

var whoami = "Kami adalah "Gerilyawan" dari planet Namex.";

Jika dicetak menggunakan console.log() tidak akan menampilkan output.

Untuk mengatasinya, kita bisa menggunakan karakter escape \ agar bisa diterjemahkan oleh Javascript.

Misal,

var whoami = "Kami adalah \"Gerilyawan\" dari planet Namex.";


 
Transformasi Teks String

Javascript juga sudah menyediakan beragam method bawaan untuk memanipulasi transformasi teks: mengubah teks menjadi huruf kapital semua, huruf kecil semua, setiap kata dan sebagainya.



Mencari dan Mengganti Teks dalam String

Pada lesson sebelumnya pernah disinggung sekilas tentang fungsi/method replace() milik string. Ya, ini adalah fungsi untuk mengganti suatu teks di dalam string dengan teks lain.

string.replace(searchvalue, newvalue)

Argumen searchvalue diisi oleh string yang akan dicari untuk diganti. Argumen newvalue diisi oleh string yang menjadi pengganti.

var pesan = "saya suka baso sapi, sate kambing dan iga bakar";
var hasil = pesan.replace("kambing", "ayam");

Pada contoh kode di atas, variabel hasil akan berisi string 'saya suka baso sapi, sate ayam dan iga bakar', dimana kata kambing diganti menjadi ayam.



Memecah String ke Bentuk Array dan Sebaliknya

Adakalanya kita harus mengurai suatu string dan mengolahnya, seperti contohnya mengambil segmen tertentu dari sebuah url. Untuk hal ini kita dapat menggunakan method split().

var url = 'codepolitan.com/interactive-coding/javascript/output';
var segmen = url.split('/');
console.log(segmen);

Pada kode di atas kita memecah string url ke dalam bentuk array dengan menggunakan karakter '/' sebagai pembatasnya.

Kita juga dapat melakukan hal sebaliknya, yakni menggabungkan nilai-nilai di dalam array menjadi satu kesatuan string. Untuk ini kita dapat menggunakan method join().

var tags = new Array('javascript', 'belajar javascript', 'tutorial javascript');
var tag_str = tags.join(", ");
console.log(tag_str + '<br/>');

Pada kode di atas kita menggabungkan semua nilai elemen pada tags dengan menggunakan karakter ', ' (koma dan spasi) sebagai penghubung antar nilai.



Menghapus Karakter di Depan dan Belakang String

Dalam beberapa kasus, kita harus membersihkan suatu string dari karakter tambahan yang tidak diperlukan di awal atau akhir string. Javascript sudah menyediakan fungsi untuk hal tersebut yakni trim().

var nama = ' Al Khawarizmi    ';
console.log(nama + '<br/>');
console.log('Sebelum menghapus karakter depan dan belakang, panjang string var nama: ' + nama.length + '<br/>');
nama = nama.trim();
console.log(nama + '<br/>');
console.log('Setelah menghapus karakter depan dan belakang, panjang string var nama: ' + nama.length + '<br/>');

Outputnya,

Al Khawarizmi
Sebelum menghapus karakter depan dan belakang, panjang string var nama: 18
Al Khawarizmi
Setelah menghapus karakter depan dan belakang, panjang string var nama: 13
Argumen pertama method string trim() diisi dengan string yang hendak dibersihkan.


Reference :

codepolitan

Materi pembelajaran coding interactive membahas bahasa pemrograman JavaScript