Bagaimana mempersingkat pernyataan bersyarat saya

Saya memiliki pernyataan kondisional yang sangat panjang seperti berikut:

if(test.type == 'itema' || test.type == 'itemb' || test.type == 'itemc' || test.type == 'itemd'){
    // do something.
}

Saya bertanya-tanya apakah saya bisa mengubah ekspresi / pernyataan ini menjadi bentuk yang lebih ringkas.

Adakah cara untuk mencapai ini?

Masukkan nilai Anda ke dalam array, dan periksa apakah item Anda ada di dalam array:

if ([1, 2, 3, 4].includes(test.type)) {
    // Do something
}

Jika browser yang Anda dukung tidak memiliki Array#includesmetode, Anda dapat menggunakan polyfill ini .

Penjelasan singkat tentang ~pintasan tilde:

Pembaruan: Karena kita sekarang memiliki includesmetode, tidak ada gunanya menggunakan ~peretasan lagi. Hanya menyimpannya di sini untuk orang-orang yang tertarik mengetahui cara kerjanya dan / atau menjumpainya dalam kode orang lain.

Alih-alih memeriksa jika hasilnya dari indexOfadalah >= 0, ada jalan pintas kecil yang menyenangkan:

if ( ~[1, 2, 3, 4].indexOf(test.type) ) {
    // Do something
}

Ini biola: http://jsfiddle.net/HYJvK/

Bagaimana cara kerjanya? Jika item ditemukan dalam array, indexOfkembalikan indeksnya. Jika item itu tidak ditemukan, itu akan kembali -1. Tanpa terlalu banyak detail, ~ini adalah operator BUKAN bitwise , yang 0hanya akan kembali untuk -1.

Saya suka menggunakan jalan ~pintas, karena lebih ringkas daripada melakukan perbandingan pada nilai kembali. Saya berharap JavaScript akan memiliki in_arrayfungsi yang mengembalikan Boolean secara langsung (mirip dengan PHP), tapi itu hanya angan-angan ( Pembaruan: sekarang. Ini disebut includes. Lihat di atas). Perhatikan bahwa jQuery's inArray, saat membagikan tanda tangan metode PHP, sebenarnya meniru indexOffungsionalitas asli (yang berguna dalam kasus yang berbeda, jika indeksnya benar-benar setelah Anda).

Catatan penting: Menggunakan pintasan tilde tampaknya dibalut kontroversi, karena beberapa orang sangat percaya bahwa kode tidak cukup jelas dan harus dihindari dengan cara apa pun (lihat komentar pada jawaban ini). Jika Anda berbagi sentimen mereka, Anda harus tetap berpegang pada .indexOf(...) >= 0solusinya.

Penjelasan lebih lama:

Integer dalam JavaScript ditandatangani, yang berarti bahwa bit paling kiri dicadangkan sebagai bit tanda; sebuah bendera untuk menunjukkan apakah angka itu positif atau negatif, dengan 1yang negatif.

Berikut adalah beberapa contoh angka positif dalam format biner 32-bit:

1 :    00000000000000000000000000000001
2 :    00000000000000000000000000000010
3 :    00000000000000000000000000000011
15:    00000000000000000000000000001111

Sekarang ini adalah angka-angka yang sama, tetapi negatif:

-1 :   11111111111111111111111111111111
-2 :   11111111111111111111111111111110
-3 :   11111111111111111111111111111101
-15:   11111111111111111111111111110001

Mengapa kombinasi aneh seperti itu untuk angka negatif? Sederhana. Angka negatif hanyalah kebalikan dari angka positif +1; menambahkan angka negatif ke angka positif harus selalu menghasilkan 0.

Untuk memahami ini, mari kita lakukan aritmatika biner sederhana.

Berikut adalah bagaimana kita akan menambahkan -1ke +1:

   00000000000000000000000000000001      +1
+  11111111111111111111111111111111      -1
-------------------------------------------
=  00000000000000000000000000000000       0

Dan di sini adalah bagaimana kita akan menambahkan -15ke +15:

   00000000000000000000000000001111      +15
+  11111111111111111111111111110001      -15
--------------------------------------------
=  00000000000000000000000000000000        0

Bagaimana kita mendapatkan hasil itu? Dengan melakukan penambahan reguler, cara kami diajarkan di sekolah: Anda mulai di kolom paling kanan, dan Anda menambahkan semua baris. Jika jumlahnya lebih besar dari angka satu digit terbesar (yang dalam desimal 9, tetapi dalam biner 1), kami membawa sisanya ke kolom berikutnya.

Sekarang, seperti yang akan Anda perhatikan, ketika menambahkan angka negatif ke angka positifnya, kolom paling kanan yang tidak semua 0s akan selalu memiliki dua 1s, yang bila ditambahkan bersama akan menghasilkan 2. Representasi biner dari dua wujud 10, kita bawa 1ke kolom berikutnya, dan beri 0hasil pada kolom pertama. Semua kolom lain di sebelah kiri hanya memiliki satu baris dengan 1, sehingga yang 1terbawa dari kolom sebelumnya akan bertambah lagi 2, yang kemudian akan terbawa ... Proses ini berulang sampai kita sampai ke kolom paling kiri, di mana yang 1akan dibawa ke mana-mana, sehingga meluap dan hilang, dan kami pergi dengan 0s di seluruh.

Sistem ini disebut 2's Complement . Anda dapat membaca lebih lanjut tentang ini di sini:

Representasi Pelengkap 2 untuk Integer yang Ditandatangani .

Sekarang kursus kilat di komplemen 2 sudah berakhir, Anda akan melihat bahwa -1hanya nomor yang representasi binernya ada 1di seluruh.

Menggunakan ~operator bitwise NOT, semua bit dalam jumlah yang diberikan dibalik. Satu - satunya cara untuk 0kembali dari membalikkan semua bit adalah jika kita mulai dengan 1semua.

Jadi, semua ini adalah cara yang panjang lebar untuk mengatakan bahwa ~nhanya akan kembali 0jika nada -1.

Anda dapat menggunakan pernyataan beralih dengan jatuh melalui:

switch (test.type) {

  case "itema":
  case "itemb":
  case "itemc":
  case "itemd":
    // do something
}

Menggunakan Ilmu: Anda harus melakukan apa yang idfah katakan dan ini untuk kecepatan tercepat sambil menjaga kode pendek:

INI LEBIH CEPAT DARI ~METODE

var x = test.type;
if (x == 'itema' ||
    x == 'itemb' ||
    x == 'itemc' ||
    x == 'itemd') {
    //do something
}

http://jsperf.com/if-statements-test-techsin (Perangkat teratas: Chrome, perangkat bawah: Firefox)

Kesimpulan:

Jika kemungkinan yang beberapa dan Anda tahu bahwa orang-orang tertentu lebih mungkin terjadi daripada yang Anda dapatkan performa maksimal if ||, switch fall through, dan if(obj[keyval]).

Jika kemungkinannya banyak , dan siapa pun di antara mereka yang paling mungkin terjadi, dengan kata lain, Anda tidak bisa tahu mana yang paling mungkin terjadi daripada Anda mendapatkan kinerja terbanyak dari pencarian objek if(obj[keyval])dan regexjika itu cocok.

http://jsperf.com/if-statements-test-techsin/12

Saya akan memperbarui jika sesuatu yang baru muncul.

Jika Anda membandingkan dengan string dan ada pola, pertimbangkan untuk menggunakan ekspresi reguler.

Kalau tidak, saya curiga mencoba memperpendeknya hanya akan mengaburkan kode Anda. Pertimbangkan hanya membungkus garis untuk membuatnya cantik.

if (test.type == 'itema' ||
    test.type == 'itemb' ||
    test.type == 'itemc' ||
    test.type == 'itemd') {
    do something.
}

var possibilities = {
  "itema": 1,
  "itemb": 1,
  "itemc": 1,
…};
if (test.type in possibilities) { … }

Menggunakan objek sebagai array asosiatif adalah hal yang cukup umum, tetapi karena JavaScript tidak memiliki set asli, Anda dapat menggunakan objek sebagai set murah juga.

if( /^item[a-d]$/.test(test.type) ) { /* do something */ }

atau jika barangnya tidak seragam, maka:

if( /^(itema|itemb|itemc|itemd)$/.test(test.type) ) { /* do something */ }

Jawaban luar biasa, tetapi Anda dapat membuat kode jauh lebih mudah dibaca dengan membungkus salah satu dari mereka dalam suatu fungsi.

Ini rumit jika pernyataan, ketika Anda (atau orang lain) membaca kode dalam waktu bertahun-tahun, Anda akan memindai untuk menemukan bagian untuk memahami apa yang terjadi. Pernyataan dengan tingkat logika bisnis ini akan menyebabkan Anda tersandung selama beberapa detik saat Anda mengerjakan apa yang Anda uji. Sedangkan kode seperti ini, akan memungkinkan Anda untuk melanjutkan pemindaian.

if(CheckIfBusinessRuleIsTrue())
{
    //Do Something
}

function CheckIfBusinessRuleIsTrue() 
{
    return (the best solution from previous posts here);
}

Beri nama fungsi Anda secara eksplisit sehingga segera jelas apa yang Anda uji dan kode Anda akan lebih mudah dipindai dan dipahami.

Anda bisa memasukkan semua jawaban ke dalam Javascript Set dan kemudian panggil saja .contains()set tersebut.

Anda masih harus mendeklarasikan semua konten, tetapi panggilan inline akan lebih pendek.

Sesuatu seperti:

var itemSet = new Set(["itema","itemb","itemc","itemd"]);
if( itemSet.contains( test.type ){}

Salah satu cara favorit saya untuk menyelesaikan ini adalah dengan perpustakaan seperti underscore.js ...

var isItem = _.some(['itema','itemb','itemc','itemd'], function(item) {
    return test.type === item;
});

if(isItem) {
    // One of them was true
}

http://underscorejs.org/#some

cara lain atau cara luar biasa lain yang saya temukan adalah ini ...

if ('a' in oc(['a','b','c'])) { //dosomething }

function oc(a)
{
  var o = {};
  for(var i=0;i<a.length;i++)  o[a[i]]='';
  return o;
}

tentu saja seperti yang Anda lihat ini membutuhkan beberapa langkah lebih maju dan membuatnya mudah mengikuti logika.

http://snook.ca/archives/javascript/testing_for_a_v

menggunakan operator seperti ~ && || ((), ()) ~~ tidak apa-apa hanya jika kode Anda rusak nanti. Anda tidak akan tahu harus mulai dari mana. Jadi keterbacaan itu BESAR.

jika harus, Anda bisa membuatnya lebih pendek.

('a' in oc(['a','b','c'])) && statement;
('a' in oc(['a','b','c'])) && (statements,statements);
('a' in oc(['a','b','c']))?statement:elseStatement;
('a' in oc(['a','b','c']))?(statements,statements):(elseStatements,elseStatements);

dan jika Anda ingin melakukan invers

('a' in oc(['a','b','c'])) || statement;

Cukup gunakan switchpernyataan alih-alih ifpernyataan:

switch (test.type) {

  case "itema":case "itemb":case "itemc":case "itemd":
    // do your process
  case "other cases":...:
    // do other processes
  default:
    // do processes when test.type does not meet your predictions.
}

Switch juga bekerja lebih cepat daripada membandingkan banyak persyaratan dalam sebuah if

Untuk daftar string yang sangat panjang, ide ini akan menghemat beberapa karakter (tidak mengatakan saya akan merekomendasikannya dalam kehidupan nyata, tetapi seharusnya berhasil).

Pilih karakter yang Anda tahu tidak akan muncul di test.type Anda, gunakan sebagai pembatas, tempel semuanya menjadi satu string panjang dan cari yang:

if ("/itema/itemb/itemc/itemd/".indexOf("/"+test.type+"/")>=0) {
  // doSomething
}

Jika string Anda semakin dibatasi, Anda bahkan dapat menghilangkan pembatas ...

if ("itemaitembitemcitemd".indexOf(test.type)>=0) {
  // doSomething
}

... tetapi Anda harus berhati-hati terhadap kesalahan positif dalam kasus itu (mis. "embite" akan cocok dengan versi itu)

Agar mudah dibaca, buat fungsi untuk ujian (ya, fungsi satu baris):

function isTypeDefined(test) {
    return test.type == 'itema' ||
           test.type == 'itemb' ||
           test.type == 'itemc' ||
           test.type == 'itemd';
}

lalu sebut itu:

…
    if (isTypeDefined(test)) {
…
}
...

Saya pikir ada 2 tujuan ketika menulis kondisi if ini.

1. keringkasan
2. keterbacaan

Terkadang # 1 mungkin yang tercepat, tetapi saya akan mengambil # 2 untuk perawatan yang mudah nanti. Bergantung pada skenario, saya akan sering memilih variasi jawaban Walter.

Untuk memulai, saya memiliki fungsi yang tersedia secara global sebagai bagian dari perpustakaan saya yang ada.

function isDefined(obj){
  return (typeof(obj) != 'undefined');
}

dan kemudian ketika saya benar-benar ingin menjalankan jika kondisi mirip dengan Anda, saya akan membuat objek dengan daftar nilai yang valid:

var validOptions = {
  "itema":1,
  "itemb":1,
  "itemc":1,
  "itemd":1
};
if(isDefined(validOptions[test.type])){
  //do something...
}

Ini tidak secepat pernyataan switch / case dan sedikit lebih bertele-tele daripada beberapa contoh lainnya, tetapi saya sering mendapatkan kembali penggunaan objek di tempat lain dalam kode yang bisa sangat berguna.

Membonceng pada salah satu sampel jsperf yang dibuat di atas saya menambahkan tes ini dan variasi untuk membandingkan kecepatan. http://jsperf.com/if-statements-test-techsin/6 Hal paling menarik yang saya catat adalah bahwa kombo pengujian tertentu di Firefox jauh lebih cepat daripada Chrome.

Ini dapat diselesaikan dengan simpel untuk loop:

test = {};
test.type = 'itema';

for(var i=['itema','itemb','itemc']; i[0]==test.type && [
    (function() {
        // do something
        console.log('matched!');
    })()
]; i.shift());

Kami menggunakan bagian pertama loop for untuk menginisialisasi argumen yang ingin Anda cocokkan, bagian kedua untuk menghentikan loop for dari berjalan, dan bagian ketiga menyebabkan loop akhirnya keluar.