Scribd
Unggah
5 tayangan

Pemrograman JS

Dokumen ini membahas pemrograman JavaScript, termasuk capaian pembelajaran, penulisan kode, cara menampilkan output, dan penggunaan jendela dialog. JavaScript adalah bahasa pemrograman penting untuk web development yang dapat digunakan di berbagai platform. Selain itu, dokumen ini juga menjelaskan variabel, tipe data, dan operator dalam JavaScript.

Diunggah oleh

laraarumsari
Hak Cipta
© © All Rights Reserved
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
5 tayangan

Pemrograman JS

Dokumen ini membahas pemrograman JavaScript, termasuk capaian pembelajaran, penulisan kode, cara menampilkan output, dan penggunaan jendela dialog. JavaScript adalah bahasa pemrograman penting untuk web development yang dapat digunakan di berbagai platform. Selain itu, dokumen ini juga menjelaskan variabel, tipe data, dan operator dalam JavaScript.

Diunggah oleh

laraarumsari
Hak Cipta
© © All Rights Reserved
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 26

BAB XI

PEMROGRAMAN JAVASCRIPT

CAPAIAN PEMBELAJARAN
1. Capaian Pembelajaran Umum :
Mahasiswa dapat mengetahui dan memahami tentang bahasa pemrograman JavaScript.
2. Capaian Pembelajaran Khusus :
1. Mahasiswa mampu memahami cara menggunakan bahasa pemrograman
Javascript
2. Mahasiswa mampu memahami cara penulisan kodei Javascript
3. Mahasiswa mampu memahami penulisan output dan jendela dialog pada
Javascript.
4. Mahasiswa mampu memahami varibael, tipe data dan operator pada javascript.

A. PENDAHULUAN/DESKRIPSI SINGKAT
Javascript merupakan bahasa pemrograman yang wajib di pelajari jika ingin
mendalami dunia web development. Saat ini javascript tidak hanya digunakan di sisi client
(browser) saja. Javascript juga digunakan pada server, console, program desktop, mobile,
IoT, game, dan lain-lain.

B. POKOK-POKOK ISI.
11.1 Pengenalan Javascript
Javascript merupakan bahasa pemrograman berbasis client-side yang berfungsi untuk
menjadikan halaman web menjadi interaktif. Client-side berarti bahasa ini akan berjalan
pada client dan tidak membutuhkan server tersendiri layaknya PHP. Namun, seiring
perkembangan zaman, javascript tidak hanya berjalan di atas browser saja. javascript juga
dapat digunakan pada sisi Server, Game, IoT, Desktop, dsb.
Javascript dibuat 1995 oleh Brendan Eich, awalnya bernama Mocha, lalu berubah
menjadi LiveScript saat browser Netscape Navigator 2.0 rilis versi beta, namun, setelah itu
dinamai ulang menjadi Javascript.
11.2 Cara Penulisan Javascript Pada HTML
Ada 4 cara penulisan kode javascript pada HTML yaitu :
1. Menulis Javascript pada Tag <script>
Penulisan kode Javascript menggunakan tag <script> adalah cara umum yang
digunakan. Tag <script> dapat kita buat di dalam tag <head> maupun <body>.
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Cara Penulisan Javascript</title>
<script>
console.log('Hi, ini merupakan kode Javascript pada console');
</script>
</head>
<body>
<script>
document.write('Selamat Belajar Program Javascript!');
</script>
</body>
</html>
Tampilan halaman penulisan kode javascript dengan tag <script> terlihat seperti gambar
11.1

Gambar 11.1 Penulisan Kode Javascript Dengan Tag <script>


2. Menulis Javascript pada File Eksternal
Cara kedua adalah menuliskan kode Javascript di file yang terpisah dengan HTML.
Biasanya digunakan jika kita tidak ingin kode Javascript bercampur dengan kode
HTML. Caranya dengan membuat sebuah file yang berekstensi .js. File ini kita isi
dengan kode Javascript.
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Cara Penulisan Javascript Eksternal</title>
</head>
<body>
<script src="script.js"></script>
</body>
</html>
file script.js
document.write('Ini Merupakan Kode Javascript dari File Eksternal');

Tampilan halaman penulisan kode javascript eksternal terlihat seperti gambar 11.2

Gambar 11.2 Penulisan Kode Javascript Eksternal


3. Menulis Javascript pada Atribut
Penulisan Javascript pada atribut bisanya dilakukan pada atribut event.
Contoh:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Cara Penulisan Javascript pada Atribut</title>
</head>
<body>
<button onclick="alert('Selamat Belajar Javascript!')">Silahkan
di Klik!</button>
</body>
</html>
Pada contoh kita membuat elemen <button> dan memiliki attribut onclick yang berisi
kode Javascript. Nantinya, kode javascript yang ada di dalam atribut onclick akan dieksekusi
saat event klik terjadi pada elemen <button>. Tampilan halaman penulisan kode javascript
pada atribut terlihat seperti gambar 11.3

Gambar 11.3 Penulisan Kode Javascript pada Atribut


4. Penulisan Javascript pada URL
Cara ini jarang digunakan dan hampir tidak ada yang menggunakannya di dalam
aplikasi. Caranya, pada URL kita gunakan javascript: lalu diikuti dengan kode
Javascript yang ingin dieksekusi.
Contoh:
javascript:alert("Ini contoh penulisan Javascript pada URL")

Tampilan halaman penulisan kode javascript pada URL terlihat seperti gambar 11.4

Gambar 11.4 Penulisan Kode Javascript pada URL

11.3 Menampilkan Output pada Javascript


Output merupakan tampilan program yang biasanya digunakan untuk memperlihatkan
hasil. Output biasanya ditampilkan dalam bentuk teks dengan fungsi print(). Beberapa cara
untuk menampilkan output pada Javascript adalah :
- console.log();
- alert();
- document.write();
- innerHTML.
1. Fungsi console.log() : Fungsi console.log() adalah fungsi untuk menampilkan teks ke
console Javascript.
Contoh :
console.log("Hello World!");

Hasil output console.log terlihat seperti pada gambar 11.5

Gambar 11.5 Tampilan Output dengan Console.log

Fungsi console.log() biasanya digunakan untuk debugging. Karena setiap pesaan error
di Javascript selalu ditampilkan di dalam Console. Selain console.log(), terdapat juga
beberapa fungsi untuk debugging seperti console.debug(), console.info(), console.error(),
console.dir() dan lain sebagainya.

2. Fungsi alert() : Fungsi alert() adalah fungsi untuk menampilkan jendela dialog. Fungsi
sebenarnya berada pada objek window. Fungsi alert(), hanya bisa digunakan di dalam
browser saja. Secara lengkap bisa ditulis seperti ini:
window.alert("Hello World!");
atau
alert("Hello World!");
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Output Alert Javascript</title>
</head>
<body>
<script>
alert('Selamat belajar Program Javascript');

function sayHello() {
alert('Hello, Welcome Here!');
}
</script>
<button onclick="sayHello()">Click Me!</button>
</body>
</html>
Hasil output alert terlihat seperti pada gambar 11.6

Gambar 11.6 Tampilan Output Alert


3. Fungsi document.write() : Objek document adalah objek yang mewakili dokumen
HTML di dalam Javascript. Dalam objek document, terdapat fungsi write() untuk
menulis sesuatu ke dokumen HTML.
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Output write</title>
</head>
<body>
<script>
document.write('<h2>Hello, Selamat Datang!</h2>');
document.write('<hr>');
document.write('<p>Selamat belajar program Javascript</p>');
document.write('<b>Semoga Sukses</b>');
</script>
</body>
</html>
Hasil output document.write terlihat seperti pada gambar 11.7

Gambar 11.7 Tampilan Output document.write


4. Menggunakan innerHTML : innerHTML adalah sebuah atribut di dalam (objek)
elemen HTML yang berisi string HTML. Dengan innerHTML, kita dapat menampilkan
output ke elemen yang lebih spesifik.
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Output innerHTML</title>
</head>
<body>
<h2>Belajar Javascript untuk Pemula</h2>
<div id="hasil-output"></div>
<script>
// membuat objek elemen
var hasil = document.getElementById('hasil-output');
// menampilkan output ke elemen hasil
hasil.innerHTML = '<p>Saya Suka Belajar Javascript</p>';
</script>
</body>
</html>
Hasil output innerHTML terlihat seperti pada gambar 11.8

Gambar 11.8 Tampilan Output innerHTML


11.4 Jendela Dialog pada Javascript
Jendela dialog merupakan jendela yang digunakan untuk berinteraksi dengan
pengguna. Ada tiga macam jendela dialog pada Javascript yaitu :
1. Dialog alert() : Dialog alert() biasanya digunakan untuk menampilkan sebuah pesan
peringatan atau informasi. Fungsi alert() berada dalam objek window.
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Dialog Alert</title>
</head>
<body>
<button onClick="alert('Tombol diklik!')">Click Me</button>
</body>
</html>

2. Dialog Confirm : Dialog confirm() digunakan untuk melakukan konfirmasi dalam


melakukan tindakan tertentu, seperti saat kita menghapus sesuatu, maka ada baiknya
menampilkan dialog confirm(). Karena tindakan tersebut cukup berbahaya. Dialog
confirm dapat dibuat dengan fungsi confirm().
Contoh:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Dialog Alert</title>
</head>
<body>
<script>
var yakin = confirm('Apakah kamu yakin akan mengunjungi
petanikode?');

if (yakin) {
window.location = 'https://www.petanikode.com';
} else {
document.write('Baiklah, tetap di sini saja ya :)');
}
</script>
</body>
</html>
Tampilan dialog confirm terlihat seperti pada gambar 11.9

Gambar 11.9 Tampilan Dialog Confirm

3. Dialog Prompt : Dialog prompt() berfungsi untuk mengambil sebuah inputan dari
pengguna. Dialog prompt() akan mengembalikan sebuah nilai string dari apa yang
diinputkan oleh pengguna.
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Dialog Prompt</title>
</head>
<body>
<script>
var nama = prompt('Silahkan Masukkan Nama', '');
document.write('<p>Hello, Selamat Datang ' + '<b>' + nama +
'<b>' + '</p>');
</script>
</body>
</html>
Tampilan dialog prompt terlihat seperti pada gambar 11.10

Gambar 11.10 Tampilan Dialog Prompt

11.5 Variabel dan Tipe Data pada Javascript


Pada setiap bahasa pemrograman yang digunakan, variabel dan tipe data hal ini akan
selalu ada.
1. Variabel pada Javascript
Variabel merupakan sebuah nama yang mewakili sebuah nilai. Variabel bisa diisi
dengan berbagai macam nilai seperti string (teks), number (angka), objek, array, dan
sebagainya. Cara membuat variabel yang umum digunakan di javascript adalah
menggunakan kata kunci var lalu diikuti dengan nama variabel dan nilainya.
Contoh:
var title = "Belajar Pemrograman Javascript";
var siteName = "Petani Kode";
var url = "https://www.petanikode.com";
var visitorCount = 5921;
Pada contoh di atas, kita menggunakan huruf besar atau kapital untuk nama variabel
yang terdiri dari dua suku kata. Pada Javascript dianjurkan menggunakan camelCase dalam
penamaan variabel.
Selain kata kunci var kita juga bisa membuat variabel dengan kata kunci let atau
tanpa awalan apapun.

Contoh:
// membuat variabel dengan kata kunci let
let price = 15000;

// membuat variabel tanpa awalan apapun


stock = 12

Untuk menampilkan isi variabel, kita bisa memanfaatkan fungsi-fungsi untuk


menampilkan output seperti:
- Fungsi console.log() menampilkan output ke console javascript;
- Fungsi document.write() menampilkan output ke dokumen HTML;
- Fungsi alert() menampilkan output ke jendela dialog.

Contoh :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Variabel Javascript</title>
</head>
<body>
<script>
// membuat variabel
var name = 'Petani Kode';
var visitorCount = 150022;
var isActive = true;
var url = 'https://www.petanikode.com/tutorial/javascript/';

// menampilkan variabel ke jendela dialog (alert)


alert('Selamat datang di ' + name);

// menampilkan variabel ke dalam HTML


document.write('Nama Situs: ' + name + '<br>');
document.write('Jumlah Pengunjung: ' + visitorCount + '<br>');
document.write('Status Aktif: ' + isActive + '<br>');
document.write('Alamat URL: ' + url + '<br>');
</script>
</body>
</html>
Tampilan variabel terlihat seperti pada gambar 11.11

Gambar 11.11 Tampilan Variabel pada Javascript

2. Tipe Data pada Javascript


Tipe data merupakan jenis-jenis data yang bisa kita simpan di dalam variabel. Ada beberapa
tipe data dalam pemrograman Javascript yaitu :
- String (teks)
- Integer atau Number (bilangan bulat)
- Float (bilangan Pecahan)
- Boolean
- Array
- Object
Javascript merupakan bahasa yang bersifat dynamic typing, artinya kita tidak harus
menuliskan tipe data pada saat pembuatan variabel seperti pada bahasa C, C++, Java, dsb.
yang bersifat static typing.
Contoh:
var name = "Salsa";
var age = 142;
var single = true;
Javascript akan otomatis mengenali tipe data yang kita berikan pada variabel.
Pada contoh di atas variabel :
• name bertipe data String;
• age bertipe data integer;
• single bertipe data boolean.
Hal ini bisa juga kita cek dengan kata kunci typeof.
Contoh:
typeof name;
typeof age;
typeof single;

11.6 Operator pada Javascript


Operator merupakan hal dasar yang harus dipahami dalam pemrograman dan wajib
ada pada setiap bahasa pemrograman, karena akan banyak digunakan untuk melakukan
berbagai macam operasi di dalam program. Operator adalah simbol yang digunakan untuk
melakukan operasi pada suatu nilai dan variabel.
Operator dalam pemrograman terbagi dalam 6 jenis yaitu :
1. Operator aritmatika ; merupakan operator untuk melakukan operasi aritmatika seperti
penjumlahan, pengurangan, pembagian, perkalian, dan lain sebagainya. Untuk
melakukan operasi perkalian kita menggunakan simbol asterik *, jangan gunakan x,
karena simbol x bukan termasuk dalam operator di dalam pemrograman. Untuk
pemangkatan kita menggunakan asterik ganda **. Untuk pembagian menggunakan
simbol garis miring /. Operator terdiri dari :

Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Operator Aritmatika</title>
</head>
<body>
<script>
var a = 15;
var b = 4;
var c = 0;
// pengurangan
c = a - b;
document.write(`${a} - ${b} = ${c}<br/>`);
// Perkalian
c = a * b;
document.write(`${a} * ${b} = ${c}<br/>`);
// pemangkatan
c = a ** b;
document.write(`${a} ** ${b} = ${c}<br/>`);
// Pembagian
c = a / b;
document.write(`${a} / ${b} = ${c}<br/>`);
// Modulo
c = a % b;
document.write(`${a} % ${b} = ${c}<br/>`);
</script>
</body>
</html>
Tampilan hasil dari operator aritmatika terlihat seperti gambar 11.12

Gambar 11.12 Hasil Operator Aritmatika pada Javascript


Opertor Penggabungan Teks
Pada Javascript, apabila kita akan melakukan operasi terhadap tipe data string atau teks
menggunakan penjumlahan (+), maka yang akan terjadi adalah penggabungan bukan
penjumlahan.
Contoh :
var a = "10" + "2";

Maka hasilnya akan:


102

2. Operator Penugasan (Assignment) ; operator yang digunakan untuk memberikan


tugas kepada variabel. Biasanya digunakan untuk mengisi variabel. Operator penugasan
sama seperti operator aritmatika., juga digunakan untuk melakukan operasi aritmatika.
Operator terdiri dari :

Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Operator Penugasan</title>
</head>
<body>
<script>
document.write('Mula-mula nilai score...<br>');
// pengisian nilai
var score = 100;
document.write('score = ' + score + '<br/>');
// pengisian dan menjumlahan dengan 5
score += 5;
document.write('score = ' + score + '<br/>');
// pengisian dan pengurangan dengan 2
score -= 2;
document.write('score = ' + score + '<br/>');
// pengisian dan perkalian dengan 2
score *= 2;
document.write('score = ' + score + '<br/>');
// pengisian dan pembagian dengan 4
score /= 4;
document.write('score = ' + score + '<br/>');
// pengisian dan pemangkatan dengan 2
score **= 2;
document.write('score = ' + score + '<br/>');
// pengisian dan modulo dengan 3;
score %= 3;
document.write('score = ' + score + '<br/>');
</script>
</body>
</html>
Tampilan hasil dari operator penugasan terlihat seperti gambar 11.13

Gambar 11.13 Hasil Operator Penugasan pada Javascript

3. Opeartor relasi atau perbandingan ; operator yang digunakan untuk membandingkan


dua nilai. Operator perbandingan akan menghasilkan sebuah nilai boolean true dan false.
Operator perbandingan terdiri dari :
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Operator Perbandingan</title>
</head>
<body>
<script>
var aku = 20;
var kamu = 19;

// sama dengan
var hasil = aku == kamu;
document.write(`${aku} == ${kamu} = ${hasil}<br/>`);

// lebih besar
var hasil = aku > kamu;
document.write(`${aku} > ${kamu} = ${hasil}<br/>`);

// lebih besar samadengan


var hasil = aku >= kamu;
document.write(`${aku} >= ${kamu} = ${hasil}<br/>`);

// lebih kecil
var hasil = aku < kamu;
document.write(`${aku} < ${kamu} = ${hasil}<br/>`);
// lebih kecil samadengan
var hasil = aku <= kamu;
document.write(`${aku} <= ${kamu} = ${hasil}<br/>`);

// tidak samadengan
var hasil = aku != kamu;
document.write(`${aku} != ${kamu} = ${hasil}<br/>`);
</script>
</body>
</html>
Tampilan hasil dari operator perbandingan terlihat seperti gambar 11.14

Gambar 11.14 Hasil Operator Perbandingan pada Javascript

4. Operator Logika ; Operator logika digunakan untuk melakukan operasi terhadap dua
nilai boolean. Operator ini terdiri dari:

Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Operator Logika</title>
</head>
<body>
<script>
var aku = 20;
var kamu = 19;
var benar = aku > kamu;
var salah = aku < kamu;
// operator && (and)
var hasil = benar && salah;
document.write(`${benar} && ${salah} = ${hasil}<br/>`);
// operator || (or)
var hasil = benar || salah;
document.write(`${benar} || ${salah} = ${hasil}<br/>`);
// operator ! (not)
var hasil = !benar;
document.write(`!${benar} = ${hasil}<br/>`);
</script>
</body>
</html>
Tampilan hasil dari operator logika terlihat seperti gambar 11.15

Gambar 11.15 Hasil Operator Logika pada Javascript

5. Operator Bitwise ; merupkan operator yang digunakan untuk operasi berdasarkan bit
(biner). Operator ini terdiri dari :
Operator ini berlaku untuk tipe data int, long, short, char, dan byte. Operator ini
akan menghitung dari bit-ke-bit. Misalnya, kita punya variabel a = 60 dan b = 13.
Bila dibuat dalam bentuk biner, akan menjadi seperti ini:

a = 00111100
b = 00001101
(perhatikan bilangan binernya, angka 0 dan 1), kemudian, dilakukan operasi bitwise.

Operasi AND
a = 00111100
b = 00001101
a & b = 00001100

Operasi OR
a = 00111100
b = 00001101
a | b = 00111101

Operasi XOR
a = 00111100
b = 00001101
a ^ b = 00110001

Opearsi NOT (Negasi/kebalikan)


a = 00111100
~a = 11000011

Konsepnya memang hampir sama dengan opeartor Logika. Bedanya, Bitwise


digunakan untuk biner.
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Operator Bitwise</title>
</head>
<body>
<script>
var x = 4;
var y = 3;

// operator bitwise and


var hasil = x & y;
document.write(`${x} & ${y} = ${hasil}<br/>`);

// operator bitwise or
var hasil = x | y;
document.write(`${x} | ${y} = ${hasil}<br/>`);

// operator bitwise xor


var hasil = x ^ y;
document.write(`${x} ^ ${y} = ${hasil}<br/>`);

// operator negasi
var hasil = ~x;
document.write(`~${x} = ${hasil}<br/>`);

// operator bitwise right shift >>


var hasil = x >> y;
document.write(`${x} >> ${y} = ${hasil}<br/>`);

// operator bitwise right shift <<


var hasil = x << y;
document.write(`${x} << ${y} = ${hasil}<br/>`);

// operator bitwise right shift (unsigned) >>>


var hasil = x >>> y;
document.write(`${x} >>> ${y} = ${hasil}<br/>`);
</script>
</body>
</html>
Tampilan hasil dari operator bitwise terlihat seperti gambar 11.16

Gambar 11.16 Hasil Operator Bitwise pada Javascript


6. Operator Ternary ; merupakan operator yang teridiri dari tiga bagian. Operator-
operator sebelumnya hanya dua bagian saja, yaitu: bagian kiri dan kanan. Ini disebut
operator binary. Sementara operator trinary ada bagian kiri, tengah, dan kanan.
bagian kiri <operator> bagian tengah <operator> bagian kanan

Opertor ternary pada Javascript, biasanya digunakan untuk membuat sebuah


percabangan if/else. Simbol opertor ternary terdiri dari tanda tanya dan titik dua ( ?:).
Bentuknya seperti ini :
<kodisi> ? "benar" : "salah"

Perhatikan! <kondisi> dapat kita isi dengan ekspresi yang menghasilkan nilai true
dan false. Apabila kondisi bernilai true, maka "benar" yang akan dipilih dan sebaliknya
apabila false maka "salah" yang akan dipilih. Operator ini unik, seperti membuat
pertanyaan.
Contoh :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-
scale=1.0" />
<title>Penulisan Operator Ternary</title>
</head>
<body>
<script>
var pertanyaan = confirm('Apakah kamu berumur diatas 18
tahun?');

var hasil = pertanyaan ? 'Selamat datang' : 'Kamu tidak boleh


di sini';
document.write(hasil);
</script>
</body>
</html>
Tampilan hasil dari operator ternary terlihat seperti gambar 11.17

Gambar 11.17 Hasil Operator Ternary pada Javascript

E. RUJUKAN.
https://www.petanikode.com/tutorial/javascript/

F. BACAAN YANG DISARANKAN.


Rohi Abdulloh, 7 In 1 Pemrograman Web Untuk Pemula, 2019, Elex Media
Komputindo, Jakarta
https://www.w3schools.com/js/default.asp

Anda mungkin juga menyukai