Refactoring Legacy `if/else` blocks dengan keadaan singkat moden

Ganti jika/lain tugasan dengan ternaries atau pengendali logik seperti ||, ??, dan & & untuk ringkas, niat jelas. 2. Gunakan pemetaan objek dan bukannya jika/lain jika rantai untuk menyelesaikan secara bersih pemeriksaan nilai berganda. 3. Sapukan pulangan awal melalui klausa pengawal untuk mengurangkan sarang dan menyerlahkan aliran utama. 4. Gantikan gelung bersyarat dengan kaedah array seperti Cari dan Penapis untuk logik Deklaratif dan Boleh Dibaca. 5. Leverage Destructuring dengan lalai dan chaining pilihan untuk menghapuskan cek harta yang berlebihan. Matlamatnya adalah untuk menulis lebih banyak kod yang dapat dipelihara dan ekspresif dengan memihak kepada corak JavaScript moden ke atas keadaan yang sangat bersarang, menghasilkan logik yang lebih bersih dan lebih diramalkan.

Refactoring Legacy if/else blok dengan keadaan shorthand moden bukan sekadar menulis kod kurang - ia mengenai peningkatan kebolehbacaan, mengurangkan bersarang, dan membuat logik lebih mudah untuk dikekalkan. Terlalu bersarang atau sangat dirantai if/else adalah perkara biasa dalam kod yang lebih lama dan sering membawa kepada pepijat, kekeliruan, dan pertindihan. Nasib baik, JavaScript moden (dan corak yang serupa dalam bahasa lain) menawarkan alternatif yang lebih bersih.

Berikut adalah cara refactor keadaan tradisional ke dalam pembinaan yang lebih ekspresif, ringkas.

1. Gantikan ternari yang sederhana dengan tugasan logik

Apabila anda memberikan nilai berdasarkan keadaan, elakkan penuh if/else .

Sebelum:

 biarkan hasil;
jika (userLoggedIn) {
  hasil = 'selamat datang';
} else {
  hasil = 'login';
}

Selepas:

 Const Result = userLoggedIn? 'Selamat Datang': 'Login';

Lebih baik lagi, untuk pemeriksaan Truthy/Falsy yang mudah, gunakan pengendali logik:

 // nilai lalai
const name = nama pengguna || 'Tetamu';

// Coalescing Nullish (lebih selamat)
Const Name = Nama Pengguna ?? 'Tetamu';

// tugasan litar pintas
isLoggedIn && showdashboard ();

Ini shorthands mengurangkan boilerplate dan membuat niat lebih jelas.

2. Gunakan pemetaan objek dan bukannya lama if/else if rantai

Apabila anda menyemak pembolehubah yang sama terhadap pelbagai nilai, objek carian adalah lebih bersih daripada satu siri if/else if .

Sebelum:

 biarkan tindakan;
jika (status === 'memuat') {
  tindakan = 'spinner';
} else if (status === 'kejayaan') {
  tindakan = 'semak';
} else if (status === 'error') {
  tindakan = 'salib';
} else {
  tindakan = 'lalai';
}

Selepas:

 const statusmap = {
  Memuat: 'Spinner',
  Kejayaan: 'semak semak',
  Ralat: 'salib',
};

const action = statusmap [status] || 'lalai';

Atau dengan Map atau fungsi gaya switch :

 const getaction = (status) => ({
  Memuat: 'Spinner',
  Kejayaan: 'semak semak',
  Ralat: 'salib',
} [status] ?? 'lalai');

Skala corak ini lebih baik dan lebih mudah untuk menguji atau melampaui.

3. Gantikan klausa pengawal dengan pulangan awal

Lama if/else sering menyembunyikan keluar awal yang mudah. Gunakan klausa pengawal untuk meratakan logik.

Sebelum:

 fungsi ProcessUser (pengguna) {
  jika (pengguna) {
    jika (user.isaktif) {
      kembali SendWelComeMail (pengguna);
    } else {
      kembali null;
    }
  } else {
    kembali null;
  }
}

Selepas:

 fungsi ProcessUser (pengguna) {
  jika (! user ||! user.isactive) kembali null;
  kembali SendWelComeMail (pengguna);
}

Pulangan awal mengurangkan lekukan dan menjadikan jalan gembira lebih jelas.

4. Gunakan kaedah array dan bukannya gelung bersyarat

Kadang -kadang if/else logik dikebumikan di dalam gelung. Gantikan dengan kaedah array deklaratif.

Sebelum:

 biarkan hasil;
untuk (biarkan i = 0; i <users.length; i) {
  jika (pengguna [i] .id === targetId) {
    hasil = pengguna [i];
    rehat;
  }
}

Selepas:

 const result = users.find (user => user.id === TargetId) ?? null;

Atau untuk pelbagai syarat:

 const ditapis = users.filter (u => 
  u.active && (u.role === 'admin' || u.role === 'moderator')
);

Kaedah deklaratif menyatakan apa yang anda mahukan, bukan bagaimana untuk mendapatkannya.

5. Leverage Destructuring and Defaults Untuk mengelakkan cek

Elakkan if cek untuk sifat yang hilang dengan menggunakan lalai.

Sebelum:

 fungsi getName (pengguna) {
  jika (user && user.profile && user.profile.name) {
    kembali user.profile.name;
  }
  kembali 'tanpa nama';
}

Selepas:

 fungsi getName (pengguna) {
  const {name = 'anonymous'} = user? .profile || {};
  Nama kembali;
}

Atau lebih pendek:

 const getName = (user) => user? .Profile? .Name ?? 'Anonymous';

Pilihan Chaining ( ?. ) Dan Nullish Coalescing ( ?? ) Menghapuskan seluruh cabang kod pertahanan.

Matlamatnya bukan untuk menghapuskan if kenyataan sepenuhnya - mereka sah dan perlu. Tetapi dengan menggunakan ciri bahasa moden, anda boleh menggantikan logik yang kompleks dan bersarang dengan corak yang lebih mudah, lebih mudah dipelihara.

Pada asasnya: peta bukan rantai, kembali awal, gunakan lalai, dan lebih suka ungkapan ke atas pernyataan. Ia bukan sihir - hanya kod bersih.

Atas ialah kandungan terperinci Refactoring Legacy `if/else` blocks dengan keadaan singkat moden. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!