javascript: menggunakan kondisi dalam kasus sakelar

Maaf untuk pertanyaan bodoh itu. Bagaimana saya bisa menggunakan kondisi untuk kasus di elemen bahasa switch-case javascript? Seperti pada contoh di bawah ini, kasus harus cocok jika variabelnya liCount<= 5 dan> 0; namun, kode saya tidak berfungsi:

switch (liCount) {
    case 0:
        setLayoutState('start');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount<=5 && liCount>0):
        setLayoutState('upload1Row');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount<=10 && liCount>5):
        setLayoutState('upload2Rows');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount>10):
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;                  
}

Terima kasih atas sarannya!

Ini bekerja:

switch (true) {
    case liCount == 0:
        setLayoutState('start');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount<=5 && liCount>0:
        setLayoutState('upload1Row');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount<=10 && liCount>5:
        setLayoutState('upload2Rows');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount>10:
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;                  
}

Versi sebelumnya dari jawaban ini menganggap tanda kurung sebagai pelakunya. Sebenarnya, tanda kurung tidak relevan di sini - satu-satunya hal yang diperlukan adalah switch(true){...}dan agar ekspresi kasus Anda dievaluasi menjadi boolean.

Ini berfungsi karena, nilai yang kami berikan ke sakelar digunakan sebagai dasar untuk membandingkan. Akibatnya, ekspresi kasus, juga mengevaluasi ke boolean akan menentukan kasus mana yang dijalankan. Bisa juga membalikkan ini, dan lulus switch(false){..}dan memiliki ekspresi yang diinginkan mengevaluasi salah daripada benar .. tetapi secara pribadi lebih suka berurusan dengan kondisi yang mengevaluasi kebenaran. Namun, itu berhasil juga, jadi perlu diingat untuk memahami apa yang dilakukannya.

Misalnya: jika liCount adalah 3, perbandingan pertama adalah true === (liCount == 0) , artinya kasus pertama salah. Sakelar kemudian beralih ke kasus berikutnya true === (liCount<=5 && liCount>0). Ekspresi ini mengevaluasi true, yang berarti kasus ini dijalankan, dan diakhiri di break. Saya telah menambahkan tanda kurung di sini untuk membuatnya lebih jelas, tetapi itu opsional, tergantung pada kompleksitas ekspresi Anda.

Ini cukup sederhana, dan cara yang rapi (jika sesuai dengan apa yang Anda coba lakukan) untuk menangani serangkaian kondisi yang panjang, di mana mungkin rangkaian panjang ìf() ... else if() ... else if () ... dapat menimbulkan banyak gangguan visual atau kerapuhan.

Gunakan dengan hati-hati, karena ini adalah pola non-standar, meskipun merupakan kode yang valid.

Anda cara overcomplicated itu. Tuliskan dengan pernyataan if seperti ini:

if(liCount == 0)
    setLayoutState('start');
else if(liCount<=5)
    setLayoutState('upload1Row');
else if(liCount<=10)
    setLayoutState('upload2Rows');

$('#UploadList').data('jsp').reinitialise();

Atau, jika ChaosPandion mencoba mengoptimalkan sebanyak mungkin:

setLayoutState(liCount == 0 ? 'start' :
               liCount <= 5 ? 'upload1Row' :
               liCount <= 10 ? 'upload2Rows' :
               null);

$('#UploadList').data('jsp').reinitialise();

Anda ingin menggunakan pernyataan if:

if (liCount === 0) {
    setLayoutState('start');
} else if (liCount <= 5) {
    setLayoutState('upload1Row');
} else if (liCount <= 10) {
    setLayoutState('upload2Rows');
}
$('#UploadList').data('jsp').reinitialise();  

Lihat jawaban dmp di bawah ini. Saya akan menghapus jawaban ini jika saya bisa, tetapi jawaban itu diterima jadi ini adalah hal terbaik berikutnya :)

Tidak boleh. Penerjemah JS mengharuskan Anda untuk membandingkan dengan pernyataan switch (misalnya, tidak ada pernyataan "case when"). Jika Anda benar-benar ingin melakukan ini, Anda tinggal membuat if(){ .. } else if(){ .. }balok.

switch (true) {
  case condition0:
    ...
    break;
  case condition1:
    ...
    break;
}

akan berfungsi di JavaScript selama kondisi Anda mengembalikan booleannilai yang sesuai , tetapi tidak memiliki banyak keunggulan dibandingkan else ifpernyataan.

Itu adalah kasus di mana Anda harus menggunakan ifklausa.

Jika itu yang ingin Anda lakukan, akan lebih baik menggunakan ifpernyataan. Sebagai contoh:

if(liCount == 0){
    setLayoutState('start');
}
if(liCount<=5 && liCount>0){
    setLayoutState('upload1Row');
}
if(liCount<=10 && liCount>5){
    setLayoutState('upload2Rows');
}             
var api = $('#UploadList').data('jsp');
    api.reinitialise();

Kode Anda tidak berfungsi karena tidak melakukan apa yang Anda harapkan. Blok saklar mengambil nilai, dan membandingkan setiap kasus dengan nilai yang diberikan, mencari persamaan. Nilai perbandingan Anda adalah bilangan bulat, tetapi sebagian besar ekspresi kasus Anda menghasilkan nilai boolean.

Jadi, misalnya, katakanlah liCount = 2. Kasus pertama Anda tidak akan cocok, karena 2 != 0. Kasus kedua Anda, (liCount<=5 && liCount>0)mengevaluasi ke true, tapi 2 != true, jadi kasus ini juga tidak akan cocok.

Untuk alasan ini, seperti yang dikatakan banyak orang, Anda harus menggunakan serangkaian if...then...else ifblok untuk melakukan ini.

jika nilai yang mungkin adalah bilangan bulat, Anda dapat mengumpulkan kasus. Jika tidak, gunakan ifs.

var api, tem;

switch(liCount){
    case 0:
    tem= 'start';
    break;
    case 1: case 2: case 3: case 4: case 5:
    tem= 'upload1Row';
    break;
    case 6: case 7: case 8: case 9: case 10:
    tem= 'upload2Rows';
    break;
    default:
    break;
}
if(tem) setLayoutState((tem);
api= $('#UploadList').data('jsp');
api.reinitialise();

Perhatikan bahwa kami tidak memberikan skor ke sakelar tetapi benar. Nilai yang kami berikan ke sakelar digunakan sebagai dasar untuk membandingkan.

Contoh di bawah ini menunjukkan bagaimana kita dapat menambahkan kondisi dalam case: tanpa pernyataan if.

function getGrade(score) {
    let grade;
    // Write your code here
    switch(true) {
        case score >= 0 && score <= 5:
        grade = 'F';
        break;
        case score > 5 && score <= 10:
        grade = 'E';
        break;
        case score > 10 && score <= 15:
        grade = 'D';
        break;
        case score > 15 && score <= 20:
        grade = 'C';
        break;
        case score > 20 && score <= 25:
        grade = 'B';
        break;
        case score > 25 && score <= 30:
        grade = 'A';
        break;
    }

    return grade;
}

Walaupun pada contoh khusus soal OP switchtidak sesuai, ada contoh switch masih sesuai / menguntungkan, namun ekspresi evaluasi lain juga dibutuhkan. Ini dapat dicapai dengan menggunakan klausa default untuk ekspresi:

switch (foo) {
  case 'bar':
    // do something
    break;
  case 'foo':
    // do something
    break;
  ... // other plain comparison cases
  default:
    if (foo.length > 16) {
      // something specific
    } else if (foo.length < 2) {
      // maybe error
    } else {
      // default action for everything else
    }
}

Anda dapat menggunakan metode fall-through dalam kasus sakelar.

const x = 'Welcome';

switch (x) {
  case 'Come':
    console.log(1)
    break;

  case 'Welcome':
  case 'Wel':
  case 'come':
    console.log(2)
    break;

  case 'Wel':
    console.log(3)
    break;

  default:
    break;
}

    
> Result => 2