Cara Menyederhanakan Pernyataan if dalam JavaScript

Pernyataan bersyarat adalah bagian penting dari JavaScript. Mereka membiarkan Anda mengeksekusi kode berdasarkan apakah kondisi yang diberikan benar atau salah, dan Anda dapat menyarangkan banyak lain jika pernyataan (dan kalau tidak) untuk mengevaluasi lebih dari satu kondisi.

Tapi inilah masalahnya—ketika menulis kompleks jika… lain rantai, hal-hal dapat dengan cepat menjadi berantakan, dan Anda dapat dengan mudah berakhir dengan kode yang sulit dibaca dan dipahami.

Mari pelajari cara refactor yang panjang dan kompleks jika… lain jika… lain rantai bersyarat menjadi versi yang lebih ringkas, lebih bersih, dan lebih mudah dipahami.

Kompleks if…else Chains

Saat menulis pernyataan if…else yang rumit dalam JavaScript, Anda harus menulis kode yang bersih, ringkas, dan mudah dipahami. Misalnya, lihat di jika… lain rantai kondisional di dalam fungsi di bawah ini:

Baca Juga:

Mau Berkarir di Dunia blockchain? Ini Dia 10 Skill yang Harus Kamu Dalami!

function canDrink(person) {
  if(person?.age != null) {
    if(person.age < 18) {
     console.log("Still too young")
    } else if(person.age < 21) {
      console.log("Not in the US")
    } else {
      console.log("Allowed to drink")
    }
  } else {
    console.log("You're not a person")
  }
}

const person = {
age: 22
}

canDrink(person)

Logikanya di sini sederhana. Pertama jika pernyataan memastikan bahwa orang objek memiliki usia properti (kalau tidak, dia bukan orang). Di dalam itu jika blokir, Anda telah menambahkan jika…selain itu…jika rantai yang pada dasarnya mengatakan:

Jika orang tersebut lebih muda dari 18 tahun, mereka terlalu muda untuk minum. Jika lebih muda dari 21 tahun, mereka masih di bawah usia minum legal di Amerika Serikat. Kalau tidak, mereka bisa mendapatkan minuman secara legal.

Meskipun kode di atas valid, penyatuan mempersulit Anda untuk memahami kode tersebut. Untungnya, Anda dapat memfaktorkan ulang kode agar ringkas dan lebih mudah dibaca dengan menggunakan a klausa penjaga.

Klausul Penjaga

Setiap kali Anda memiliki jika pernyataan yang membungkus semua kode Anda, Anda dapat menggunakan a klausa penjaga untuk menghapus semua sarang:

function canDrinkBetter() {
  if(person?.age == null) return console.log("You're not a person")

if(person.age < 18) {
console.log(“Still too young”)
} else if(person.age < 21) {
console.log(“Not in the US”)
} else {
console.log(“Allowed to drink”)
}
}

Di awal fungsi, Anda menentukan klausa penjaga yang menyatakan bahwa jika kondisi tertentu tidak terpenuhi, Anda ingin keluar dari canDrinkBetter() segera berfungsi (dan catat “Kamu bukan orang” di konsol).

Tetapi jika kondisi terpenuhi, Anda mengevaluasi jika… lain rantai untuk melihat blok mana yang berlaku. Menjalankan kode memberi Anda hasil yang sama seperti contoh pertama, tetapi kode ini lebih mudah dibaca.

Jangan Gunakan Pengembalian Tunggal

Anda mungkin berpendapat bahwa teknik di atas bukanlah prinsip pemrograman yang baik karena kami menggunakan banyak pengembalian dalam fungsi yang sama, dan Anda yakin lebih baik hanya memiliki satu pernyataan pengembalian (alias, kebijakan pengembalian tunggal).

Tapi ini adalah cara yang buruk untuk menulis kode karena memaksa Anda ke dalam situasi bersarang gila yang sama seperti yang kita lihat di contoh kode pertama.

Dengan itu, Anda dapat menggunakan banyak kembali pernyataan untuk lebih menyederhanakan kode Anda (dan menghilangkan sarang):

function canDrinkBetter() {
  if(person?.age == null) return console.log("You're not a person")

if(person.age < 18) {
console.log(“Still too young”)
return
}

if(person.age < 21) {
console.log(“Not in the US”)
return
}

console.log(“Allowed to drink”)
}

Kode ini berfungsi sama dengan dua contoh sebelumnya, dan juga sedikit lebih bersih.

Blok kode terakhir kami lebih bersih dari dua yang pertama, tetapi masih belum sebaik yang seharusnya.

Alih-alih berlama-lama jika… lain rantai di dalam satu fungsi, Anda dapat membuat fungsi terpisah canDrinkResult() yang melakukan pemeriksaan untuk Anda dan mengembalikan hasilnya:

function canDrinkResult(age) {
  if(age < 18) return "Still too young"
  if(age < 21) return "Not in the US"
  return "Allowed to drink"
}

Kemudian di dalam fungsi utama, yang perlu Anda lakukan adalah menerapkan klausa penjaga terlebih dahulu sebelum memanggil canDrinkResult() function (dengan umur sebagai parameternya) untuk mendapatkan hasil:

function canDrinkBetter() { 
  if(person?.age == null) return console.log("You're not a person")

let result = canDrinkResult(person.age)
console.log(result)
}

Jadi dalam hal ini, Anda mendelegasikan tugas memeriksa usia minum ke fungsi terpisah dan hanya memanggilnya saat diperlukan. Ini membuat kode Anda ringkas dan lebih mudah digunakan daripada semua contoh sebelumnya.

Jauhkan yang lain dari Pernyataan Bersyarat

Anda telah mempelajari cara memfaktorkan ulang rantai bersyarat yang kompleks dan bersarang menjadi yang lebih pendek dan lebih mudah dibaca menggunakan klausa pelindung dan teknik ekstraksi fungsi.

Cobalah untuk menjaga kalau tidak pernyataan jauh dari persyaratan Anda sebanyak mungkin dengan menggunakan klausa penjaga dan teknik ekstraksi fungsi.

Jika Anda masih baru menggunakan JavaScript jika… lain pernyataan, mulailah dengan dasar-dasarnya.