Tutorial JS

JS RUMAH Pengenalan JS JS Dimana Keluaran JS Pernyataan JS Sintaks JS Komentar JS Variabel JS JS Let JS Const Operator JS JS Aritmatika Tugas JS Tipe Data JS Fungsi JS Objek JS Acara JS String JS Metode String JS Pencarian String JS Template String JS Nomor JS Metode Nomor JS JS Array Metode Array JS Sortir Array JS Iterasi Array JS JS Array Const Tanggal JS Format Tanggal JS Metode Dapatkan Tanggal JS Metode Penetapan Tanggal JS JS Matematika JS Acak JS Boolean Perbandingan JS Ketentuan JS Beralih JS JS Loop Untuk JS Loop Untuk Masuk JS Loop Untuk Of JS Loop Sementara Istirahat JS JS Iterable JS Set Peta JS Tipe JS Konversi Tipe JS JS Bitwise JS RegExp Kesalahan JS Lingkup JS Pengangkatan JS Mode Ketat JS JS Kata Kunci ini Fungsi Panah JS Kelas JS JS JSON Debug JS Panduan Gaya JS Praktik Terbaik JS Kesalahan JS Kinerja JS Kata-kata Cadangan JS

Versi JS

Versi JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Tepi Sejarah JS

Objek JS

Definisi Objek Properti Objek Metode Objek Tampilan Objek Aksesor Objek Konstruktor Objek Prototipe Objek Obyek Iterable Set Objek Peta Objek Referensi Objek

Fungsi JS

Definisi Fungsi Parameter Fungsi Panggilan Fungsi Panggilan Fungsi Fungsi Terapkan Penutupan Fungsi

Kelas JS

Perkenalan Kelas Warisan Kelas Kelas Statis

JS Asinkron

Panggilan Balik JS JS Asinkron JS Janji JS Async/Menunggu

JS HTML DOM

Pengenalan DOM Metode DOM Dokumen DOM Elemen DOM HTML DOM Formulir DOM CSS DOM Animasi DOM Acara DOM Pendengar Acara DOM Navigasi DOM Node DOM Koleksi DOM Daftar Node DOM

JS Browser BOM

Jendela JS Layar JS Lokasi JS Sejarah JS JS Navigator Peringatan Munculan JS Waktu JS JS Cookies

JS Web API

Pengantar API Web API Formulir Web API Riwayat Web API Penyimpanan Web API Pekerja Web API Pengambilan Web API Geolokasi Web

JS AJAX

Pengenalan AJAX AJAX XMLHttp Permintaan AJAX Tanggapan AJAX File XML AJAX AJAX PHP AJAX ASP Basis Data AJAX Aplikasi AJAX Contoh AJAX

JS JSON

Perkenalan JSON Sintaks JSON JSON vs XML Tipe Data JSON Penguraian JSON Stringify JSON Objek JSON Array JSON Server JSON JSON PHP JSON HTML JSON JSONP

JS vs jQuery

Pemilih jQuery jQuery HTML jQuery CSS jQuery DOM

Grafik JS

Grafik JS JS Kanvas JS Plotly JS Chart.js Bagan Google JS JS D3.js

Contoh JS

Contoh JS JS HTML DOM Masukan HTML JS Objek HTML JS Acara HTML JS JS Browser Editor JS Latihan JS kuis JS Sertifikat JS

Referensi JS

Objek JavaScript Objek DOM HTML


Pernyataan Beralih JavaScript


Pernyataan switchtersebut digunakan untuk melakukan tindakan yang berbeda berdasarkan kondisi yang berbeda.


Pernyataan Beralih JavaScript

Gunakan switchpernyataan untuk memilih salah satu dari banyak blok kode yang akan dieksekusi.

Sintaksis

switch(expression) {
  case x:
    // code block
    break;
  case y:
    // code block
    break;
  default:
    // code block
}

Begini Cara kerjanya:

  • Ekspresi switch dievaluasi sekali.
  • Nilai ekspresi dibandingkan dengan nilai setiap kasus.
  • Jika ada kecocokan, blok kode yang terkait akan dieksekusi.
  • Jika tidak ada kecocokan, blok kode default dijalankan.

Contoh

Metode getDay()ini mengembalikan hari kerja sebagai angka antara 0 dan 6.

(Minggu=0, Senin=1, Selasa=2 ..)

Contoh ini menggunakan nomor hari kerja untuk menghitung nama hari kerja:

switch (new Date().getDay()) {
  case 0:
    day = "Sunday";
    break;
  case 1:
    day = "Monday";
    break;
  case 2:
     day = "Tuesday";
    break;
  case 3:
    day = "Wednesday";
    break;
  case 4:
    day = "Thursday";
    break;
  case 5:
    day = "Friday";
    break;
  case 6:
    day = "Saturday";
}

Hasil hari ini adalah:

Saturday


Kata kunci istirahat

Ketika JavaScript mencapai break kata kunci, itu keluar dari blok sakelar.

Ini akan menghentikan eksekusi di dalam blok switch.

Tidak perlu memecahkan kasing terakhir di blok sakelar. Blok istirahat (berakhir) di sana pula.

Catatan: Jika Anda menghilangkan pernyataan break, kasus berikutnya akan dieksekusi meskipun evaluasi tidak cocok dengan kasus tersebut.


Kata Kunci default

Kata defaultkunci menentukan kode untuk dijalankan jika tidak ada kasus yang cocok:

Contoh

Metode getDay()ini mengembalikan hari kerja sebagai angka antara 0 dan 6.

Jika hari ini bukan Sabtu (6) atau Minggu (0), tulis pesan default:

switch (new Date().getDay()) {
  case 6:
    text = "Today is Saturday";
    break;
  case 0:
    text = "Today is Sunday";
    break;
  default:
    text = "Looking forward to the Weekend";
}

Hasil teks akan menjadi:

Today is Saturday

Kasing defaulttidak harus menjadi kasing terakhir di blok sakelar:

Contoh

switch (new Date().getDay()) {
  default:
    text = "Looking forward to the Weekend";
    break;
  case 6:
    text = "Today is Saturday";
    break;
  case 0:
    text = "Today is Sunday";
}

Jika defaultbukan case terakhir di blok switch, ingatlah untuk mengakhiri case default dengan break.


Blok Kode Umum

Terkadang Anda ingin kasus sakelar yang berbeda menggunakan kode yang sama.

Dalam contoh kasus 4 dan 5 berbagi blok kode yang sama, dan 0 dan 6 berbagi blok kode lain:

Contoh

switch (new Date().getDay()) {
  case 4:
  case 5:
    text = "Soon it is Weekend";
    break;
  case 0:
  case 6:
    text = "It is Weekend";
    break;
  default:
    text = "Looking forward to the Weekend";
}

Peralihan Detail

Jika beberapa kasus cocok dengan nilai kasus, kasus pertama dipilih.

Jika tidak ditemukan kasus yang cocok, program akan melanjutkan ke label default .

Jika tidak ada label default yang ditemukan, program akan melanjutkan ke pernyataan setelah switch .


Perbandingan Ketat

Ganti kasus menggunakan perbandingan ketat (===).

Nilai harus dari jenis yang sama untuk dicocokkan.

Perbandingan ketat hanya bisa benar jika operan memiliki tipe yang sama.

Dalam contoh ini tidak akan ada kecocokan untuk x:

Contoh

let x = "0";
switch (x) {
  case 0:
    text = "Off";
    break;
  case 1:
    text = "On";
    break;
  default:
    text = "No value found";
}

Uji Diri Anda Dengan Latihan

Olahraga:

Buat switchpernyataan yang akan mengingatkan "Halo" jika fruitsadalah "pisang", dan "Selamat datang" jika fruitsadalah "apel".

(fruits) {
  "Banana":
    alert("Hello")
    break;
  "Apple":
    alert("Welcome")
    break;    
}