Kami mengenal banyak operator dari sekolah. Yaitu penjumlahan + , perkalian * , pengurangan - , dan seterusnya.
Dalam bab ini, kita akan mulai dengan operator sederhana, kemudian berkonsentrasi pada aspek spesifik JavaScript, yang tidak tercakup dalam aritmatika sekolah.
Sebelum kita melanjutkan, mari kita pahami beberapa terminologi umum.
Operan – adalah operator yang diterapkan. Misalnya, pada perkalian 5 * 2 terdapat dua operan: operan kiri adalah 5 dan operan kanan adalah 2 . Terkadang, orang menyebut ini “argumen” dan bukan “operan”.
Suatu operator disebut unary jika ia mempunyai satu operan. Misalnya, negasi unary - membalikkan tanda suatu bilangan:
misalkan x = 1; x = -x; peringatan(x); // -1, negasi unary diterapkan
Suatu operator bersifat biner jika ia mempunyai dua operan. Minus yang sama juga ada dalam bentuk biner:
misalkan x = 1, y = 3; waspada( y - x ); // 2, nilai pengurangan biner dikurangi
Secara formal, dalam contoh di atas kita memiliki dua operator berbeda yang menggunakan simbol yang sama: operator negasi, operator unary yang membalik tanda, dan operator pengurangan, operator biner yang mengurangkan suatu bilangan dari bilangan lainnya.
Operasi matematika berikut ini didukung:
Tambahan + ,
Pengurangan - ,
Perkalian * ,
Divisi / ,
Sisa % ,
Eksponen ** .
Empat yang pertama cukup jelas, sementara % dan ** memerlukan sedikit penjelasan tentangnya.
Operator sisanya % , meskipun muncul, tidak terkait dengan persen.
Hasil dari a % b adalah sisa pembagian bilangan bulat a dengan b .
Misalnya:
peringatan( 5 % 2 ); // 1, sisa 5 dibagi 2 peringatan( 8 % 3 ); // 2, sisa 8 dibagi 3 peringatan( 8 % 4 ); // 0, sisa 8 dibagi 4
Operator eksponensial a ** b menaikkan a pangkat b .
Dalam matematika sekolah, kami menuliskannya sebagai a b .
Misalnya:
peringatan( 2**2 ); // 2² = 4 peringatan( 2**3 ); // 2³ = 8 peringatan( 2**4 ); // 2⁴ = 16
Sama seperti dalam matematika, operator eksponensial juga didefinisikan untuk bilangan non-integer.
Misalnya, akar kuadrat adalah eksponen dengan ½:
peringatan( 4**(1/2) ); // 2 (pangkat 1/2 sama dengan akar kuadrat) peringatan( 8**(1/3) ); // 2 (pangkat 1/3 sama dengan akar pangkat tiga)
Mari kita kenali fitur-fitur operator JavaScript yang melampaui aritmatika sekolah.
Biasanya, operator plus + menjumlahkan angka.
Namun, jika biner + diterapkan pada string, ia akan menggabungkan (menggabungkannya):
misalkan s = "saya" + "string"; peringatan; // string saya
Perhatikan bahwa jika salah satu operan adalah string, maka operan lainnya juga diubah menjadi string.
Misalnya:
peringatan('1'+2); // "12"
peringatan( 2 + '1' ); // "21"Lihat, tidak masalah apakah operan pertama berupa string atau operan kedua.
Berikut contoh yang lebih kompleks:
peringatan(2 + 2 + '1' ); // "41" dan bukan "221"
Di sini, operator bekerja satu demi satu. + pertama menjumlahkan dua angka, sehingga menghasilkan 4 , lalu + berikutnya menambahkan string 1 ke dalamnya, jadi seperti 4 + '1' = '41' .
peringatan('1' + 2 + 2); // "122" dan bukan "14" Di sini, operan pertama adalah string, kompiler memperlakukan dua operan lainnya sebagai string juga. Angka 2 digabungkan menjadi '1' , jadi seperti '1' + 2 = "12" dan "12" + 2 = "122" .
Biner + adalah satu-satunya operator yang mendukung string sedemikian rupa. Operator aritmatika lainnya hanya bekerja dengan angka dan selalu mengubah operannya menjadi angka.
Berikut demo pengurangan dan pembagian:
peringatan( 6 - '2' ); // 4, mengubah '2' menjadi angka
peringatan('6' / '2' ); // 3, mengubah kedua operan menjadi angka Tanda plus + ada dalam dua bentuk: bentuk biner yang kita gunakan di atas dan bentuk unary.
Unary plus atau, dengan kata lain, operator plus + yang diterapkan pada satu nilai, tidak berpengaruh apa pun pada angka. Namun jika operannya bukan angka, unary plus akan mengubahnya menjadi angka.
Misalnya:
// Tidak berpengaruh pada angka misalkan x = 1; peringatan(+x); // 1 misalkan y = -2; peringatan( +kamu ); // -2 // Mengonversi non-angka peringatan( +benar ); // 1 peringatan(+"" ); // 0
Ini sebenarnya melakukan hal yang sama seperti Number(...) , tetapi lebih pendek.
Kebutuhan untuk mengubah string menjadi angka sering kali muncul. Misalnya, jika kita mendapatkan nilai dari kolom formulir HTML, biasanya berupa string. Bagaimana jika kita ingin menjumlahkannya?
Biner plus akan menambahkannya sebagai string:
biarkan apel = "2"; biarkan jeruk = "3"; waspada( apel + jeruk ); // "23", biner plus menggabungkan string
Jika kita ingin memperlakukannya sebagai angka, kita perlu mengonversinya lalu menjumlahkannya:
biarkan apel = "2"; biarkan jeruk = "3"; // kedua nilai diubah menjadi angka sebelum biner plus alert( +apel + +jeruk ); // 5 // varian yang lebih panjang // alert( Angka(apel) + Angka(jeruk) ); // 5
Dari sudut pandang ahli matematika, banyaknya nilai plus mungkin tampak aneh. Namun dari sudut pandang pemrogram, tidak ada yang istimewa: nilai tambah unary diterapkan terlebih dahulu, string diubah menjadi angka, lalu nilai plus biner menjumlahkannya.
Mengapa nilai tambah unary diterapkan pada nilai sebelum nilai biner? Seperti yang akan kita lihat, itu karena prioritasnya lebih tinggi .
Jika suatu ekspresi memiliki lebih dari satu operator, urutan eksekusi ditentukan oleh prioritasnya , atau, dengan kata lain, urutan prioritas default operator.
Kita semua tahu dari sekolah bahwa perkalian dalam ekspresi 1 + 2 * 2 harus dihitung sebelum penjumlahan. Itulah hal yang diutamakan. Perkalian dikatakan mempunyai keutamaan yang lebih tinggi dibandingkan penjumlahan.
Tanda kurung mengesampingkan prioritas apa pun, jadi jika kita tidak puas dengan urutan default, kita dapat menggunakannya untuk mengubahnya. Misalnya, tulis (1 + 2) * 2 .
Ada banyak operator di JavaScript. Setiap operator memiliki nomor prioritas yang sesuai. Yang memiliki angka lebih besar akan dieksekusi terlebih dahulu. Jika prioritasnya sama, maka perintah pelaksanaannya dari kiri ke kanan.
Berikut ekstrak dari tabel prioritas (Anda tidak perlu mengingatnya, namun perhatikan bahwa operator unary lebih tinggi daripada operator biner yang sesuai):
| Hak lebih tinggi | Nama | Tanda |
|---|---|---|
| … | … | … |
| 14 | plus unary | + |
| 14 | negasi unary | - |
| 13 | eksponen | ** |
| 12 | perkalian | * |
| 12 | divisi | / |
| 11 | tambahan | + |
| 11 | pengurangan | - |
| … | … | … |
| 2 | penugasan | = |
| … | … | … |
Seperti yang bisa kita lihat, “unary plus” memiliki prioritas 14 yang lebih tinggi dari 11 “tambahan” (biner plus). Itu sebabnya, dalam ekspresi "+apples + +oranges" , tanda plus unary berfungsi sebelum penjumlahan.
Perhatikan bahwa penugasan = juga merupakan operator. Itu tercantum dalam tabel prioritas dengan prioritas sangat rendah 2 .
Itu sebabnya, saat kita menetapkan variabel, seperti x = 2 * 2 + 1 , perhitungannya dilakukan terlebih dahulu lalu = dievaluasi, dan menyimpan hasilnya dalam x .
misalkan x = 2 * 2 + 1; peringatan(x); // 5
Fakta = menjadi operator, bukan konstruksi bahasa “ajaib” memiliki implikasi yang menarik.
Semua operator di JavaScript mengembalikan nilai. Hal ini jelas untuk + dan - , tetapi juga berlaku untuk = .
Panggilan x = value menulis value ke dalam x dan kemudian mengembalikannya .
Berikut demo yang menggunakan tugas sebagai bagian dari ekspresi yang lebih kompleks:
misalkan a = 1; misalkan b = 2; misalkan c = 3 - (a = b + 1); peringatan(sebuah ); // 3 peringatan(c); // 0
Pada contoh di atas, hasil ekspresi (a = b + 1) adalah nilai yang diberikan kepada a (yaitu 3 ). Kemudian digunakan untuk evaluasi lebih lanjut.
Kode yang lucu bukan? Kita harus memahami cara kerjanya, karena terkadang kita melihatnya di perpustakaan JavaScript.
Meskipun demikian, mohon jangan menulis kode seperti itu. Trik seperti itu pasti tidak membuat kode menjadi lebih jelas atau mudah dibaca.
Fitur menarik lainnya adalah kemampuan untuk merangkai tugas:
misalkan a, b, c; a = b = c = 2 + 2; peringatan(sebuah ); // 4 peringatan(b); // 4 peringatan(c); // 4
Tugas berantai dievaluasi dari kanan ke kiri. Pertama, ekspresi paling kanan 2 + 2 dievaluasi dan kemudian ditetapkan ke variabel di sebelah kiri: c , b dan a . Pada akhirnya, semua variabel berbagi satu nilai.
Sekali lagi, agar mudah dibaca, lebih baik bagi kode tersebut menjadi beberapa baris:
c = 2 + 2; b = c; sebuah = c;
Itu lebih mudah dibaca, terutama saat memindai kode dengan cepat.
Kita sering kali perlu menerapkan operator ke suatu variabel dan menyimpan hasil baru dalam variabel yang sama.
Misalnya:
misalkan n = 2; n = n + 5; n = n * 2;
Notasi ini dapat dipersingkat menggunakan operator += dan *= :
misalkan n = 2; n += 5; // sekarang n = 7 (sama seperti n = n + 5) n *= 2; // sekarang n = 14 (sama dengan n = n * 2) peringatan(n); // 14
Operator pendek “modifikasi dan tetapkan” ada untuk semua operator aritmatika dan bitwise: /= , -= , dll.
Operator tersebut memiliki prioritas yang sama dengan penugasan normal, sehingga operator tersebut dijalankan setelah sebagian besar penghitungan lainnya:
misalkan n = 2; n *= 3 + 5; // bagian kanan dievaluasi terlebih dahulu, sama seperti n *= 8 peringatan(n); // 16
Menambah atau mengurangi suatu angka per satu adalah salah satu operasi numerik yang paling umum.
Jadi, ada operator khusus untuk itu:
Kenaikan ++ menambah variabel sebesar 1:
misalkan penghitung = 2; penghitung++; // cara kerjanya sama seperti counter = counter + 1, namun lebih pendek peringatan(penghitung); // 3
Penurunan -- mengurangi variabel sebesar 1:
misalkan penghitung = 2; menangkal--; // cara kerjanya sama seperti counter = counter - 1, namun lebih pendek peringatan(penghitung); // 1
Penting:
Kenaikan/penurunan hanya dapat diterapkan pada variabel. Mencoba menggunakannya pada nilai seperti 5++ akan menghasilkan kesalahan.
Operator ++ dan -- dapat ditempatkan sebelum atau sesudah variabel.
Ketika operator mencari variabel, ia berada dalam “bentuk postfix”: counter++ .
“Bentuk awalan” adalah ketika operator berada sebelum variabel: ++counter .
Kedua pernyataan ini melakukan hal yang sama: menambah counter sebanyak 1 .
Apakah ada perbedaan? Ya, tapi kita hanya bisa melihatnya jika kita menggunakan nilai yang dikembalikan ++/-- .
Mari kita perjelas. Seperti yang kita ketahui, semua operator mengembalikan suatu nilai. Kenaikan/penurunan tidak terkecuali. Bentuk awalan mengembalikan nilai baru sedangkan bentuk postfix mengembalikan nilai lama (sebelum kenaikan/penurunan).
Untuk melihat perbedaannya, berikut contohnya:
misalkan penghitung = 1; misalkan a = ++penghitung; // (*) peringatan(a); // 2
Di baris (*) , bentuk awalan ++counter menambah counter dan mengembalikan nilai baru, 2 . Jadi, alert menunjukkan 2 .
Sekarang, mari kita gunakan formulir postfix:
misalkan penghitung = 1; misalkan a = penghitung++; // (*) mengubah ++counter menjadi counter++ peringatan(a); // 1
Pada baris (*) , bentuk postfix counter++ juga menambah counter tetapi mengembalikan nilai lama (sebelum kenaikan). Jadi, alert menunjukkan 1 .
Untuk meringkas:
Apabila hasil kenaikan/penurunan tidak digunakan maka tidak ada bedanya bentuk yang digunakan:
biarkan penghitung = 0; penghitung++; ++penghitung; peringatan(penghitung); // 2, baris di atas melakukan hal yang sama
Jika kita ingin menambah nilai dan segera menggunakan hasil dari operator, kita memerlukan bentuk awalan:
biarkan penghitung = 0; peringatan( ++penghitung ); // 1
Jika kita ingin menambah nilai tetapi menggunakan nilai sebelumnya, kita memerlukan formulir postfix:
biarkan penghitung = 0; peringatan( penghitung++ ); // 0
Kenaikan/penurunan antar operator lain
Operator ++/-- juga dapat digunakan di dalam ekspresi. Prioritasnya lebih tinggi daripada kebanyakan operasi aritmatika lainnya.
Misalnya:
misalkan penghitung = 1; peringatan( 2 * ++penghitung ); // 4
Bandingkan dengan:
misalkan penghitung = 1; peringatan( 2 * penghitung++ ); // 2, karena counter++ mengembalikan nilai "lama".
Meskipun secara teknis baik-baik saja, notasi seperti itu biasanya membuat kode menjadi kurang mudah dibaca. Satu baris melakukan banyak hal – tidak baik.
Saat membaca kode, pemindaian mata “vertikal” yang cepat dapat dengan mudah melewatkan sesuatu seperti counter++ dan tidak akan terlihat jelas bahwa variabelnya meningkat.
Kami menyarankan gaya “satu baris – satu tindakan”:
misalkan penghitung = 1; peringatan( 2 * penghitung ); penghitung++;
Operator bitwise memperlakukan argumen sebagai bilangan bulat 32-bit dan bekerja pada tingkat representasi binernya.
Operator ini tidak spesifik untuk JavaScript. Mereka didukung di sebagian besar bahasa pemrograman.
Daftar operator:
DAN ( & )
ATAU ( | )
XOR ( ^ )
BUKAN ( ~ )
SHIFT KIRI ( << )
SHIFT KANAN ( >> )
SHIFT KANAN ISI NOL ( >>> )
Operator ini sangat jarang digunakan ketika kita perlu mengutak-atik angka pada level paling rendah (bitwise). Kami tidak akan membutuhkan operator ini dalam waktu dekat, karena pengembangan web jarang menggunakannya, namun di beberapa bidang khusus, seperti kriptografi, mereka berguna. Anda dapat membaca bab Operator Bitwise di MDN ketika diperlukan.
Operator koma , adalah salah satu operator yang paling langka dan paling tidak biasa. Terkadang, ini digunakan untuk menulis kode yang lebih pendek, jadi kita perlu mengetahuinya agar dapat memahami apa yang terjadi.
Operator koma memungkinkan kita mengevaluasi beberapa ekspresi, membaginya dengan koma , . Masing-masing dievaluasi tetapi hanya hasil terakhir yang dikembalikan.
Misalnya:
misalkan a = (1 + 2, 3 + 4); peringatan(sebuah ); // 7 (hasil 3 + 4)
Di sini, ekspresi pertama 1 + 2 dievaluasi dan hasilnya dibuang. Kemudian, 3 + 4 dievaluasi dan dikembalikan sebagai hasilnya.
Koma memiliki prioritas yang sangat rendah
Perlu diingat bahwa operator koma memiliki prioritas yang sangat rendah, lebih rendah dari = , sehingga tanda kurung penting dalam contoh di atas.
Tanpanya: a = 1 + 2, 3 + 4 mengevaluasi + terlebih dahulu, menjumlahkan angka-angkanya menjadi a = 3, 7 , kemudian operator penugasan = menetapkan a = 3 , dan sisanya diabaikan. Ini seperti (a = 1 + 2), 3 + 4 .
Mengapa kita memerlukan operator yang membuang semuanya kecuali ekspresi terakhir?
Terkadang, orang menggunakannya dalam konstruksi yang lebih kompleks untuk menempatkan beberapa tindakan dalam satu baris.
Misalnya:
// tiga operasi dalam satu baris
untuk (a = 1, b = 3, c = a * b; a < 10; a++) {
...
}Trik seperti ini digunakan di banyak kerangka JavaScript. Itu sebabnya kami menyebutkannya. Namun biasanya mereka tidak meningkatkan keterbacaan kode jadi kita harus berpikir matang sebelum menggunakannya.
pentingnya: 5
Berapa nilai akhir semua variabel a , b , c dan d setelah kode di bawah ini?
misalkan a = 1, b = 1; misalkan c = ++a; // ? misalkan d = b++; // ?
Jawabannya adalah:
a = 2
b = 2
c = 2
d = 1
misalkan a = 1, b = 1; peringatan( ++a ); // 2, bentuk awalan mengembalikan nilai baru peringatan( b++ ); // 1, formulir postfix mengembalikan nilai lama peringatan(sebuah ); // 2, bertambah satu kali peringatan(b); // 2, bertambah satu kali
pentingnya: 3
Berapakah nilai a dan x setelah kode di bawah ini?
misalkan a = 2; misalkan x = 1 + (a *= 2);
Jawabannya adalah:
a = 4 (dikalikan 2)
x = 5 (dihitung sebagai 1 + 4)
pentingnya: 5
Apa hasil dari ekspresi ini?
""+1+0 "" - 1 + 0 benar + salah 6 / "3" "2" * "3" 4 + 5 + "piksel" "$" + 4 + 5 "4" - 2 "4 piksel" - 2 " -9 " + 5 " -9 " - 5 nol + 1 tidak terdefinisi + 1 " t n" - 2
Pikirkan baik-baik, tuliskan lalu bandingkan dengan jawabannya.
"" + 1 + 0 = "10" // (1) "" - 1 + 0 = -1 // (2) benar + salah = 1 6 / "3" = 2 "2" * "3" = 6 4 + 5 + "piksel" = "9 piksel" "$" + 4 + 5 = "$45" "4" - 2 = 2 "4 piksel" - 2 = Tidak " -9 " + 5 = " -9 5" // (3) " -9 " - 5 = -14 // (4) batal + 1 = 1 // (5) tidak terdefinisi + 1 = NaN // (6) " t n" - 2 = -2 // (7)
Penambahan dengan string "" + 1 mengubah 1 menjadi string: "" + 1 = "1" , dan kemudian kita memiliki "1" + 0 , aturan yang sama diterapkan.
Pengurangan - (seperti kebanyakan operasi matematika) hanya berfungsi dengan angka, ini mengubah string kosong "" menjadi 0 .
Penjumlahan dengan string menambahkan angka 5 pada string tersebut.
Pengurangan selalu diubah menjadi angka, sehingga menjadikan " -9 " menjadi angka -9 (abaikan spasi di sekitarnya).
null menjadi 0 setelah konversi numerik.
undefined menjadi NaN setelah konversi numerik.
Karakter spasi dipangkas dari awal dan akhir string ketika string diubah menjadi angka. Di sini seluruh string terdiri dari karakter spasi, seperti t , n dan spasi "biasa" di antara karakter tersebut. Jadi, mirip dengan string kosong, menjadi 0 .
pentingnya: 5
Berikut adalah kode yang menanyakan dua angka kepada pengguna dan menunjukkan jumlahnya.
Ini tidak berfungsi dengan benar. Output pada contoh di bawah ini adalah 12 (untuk nilai prompt default).
Mengapa? Perbaiki. Hasilnya seharusnya 3 .
let a = prompt("Bilangan pertama?", 1);
misalkan b = prompt("Bilangan kedua?", 2);
peringatan(a + b); // 12
Alasannya adalah prompt mengembalikan input pengguna sebagai string.
Jadi variabel memiliki nilai "1" dan "2" masing-masing.
misalkan a = "1"; // prompt("Bilangan pertama?", 1);
misalkan b = "2"; // prompt("Nomor kedua?", 2);
peringatan(a + b); // 12 Yang harus kita lakukan adalah mengubah string menjadi angka sebelum + . Misalnya, menggunakan Number() atau mengawalinya dengan + .
Misalnya, tepat sebelum prompt :
let a = +prompt("Bilangan pertama?", 1);
misalkan b = +prompt("Bilangan kedua?", 2);
peringatan(a + b); // 3 Atau dalam alert :
let a = prompt("Bilangan pertama?", 1);
misalkan b = prompt("Bilangan kedua?", 2);
peringatan(+a + +b); // 3 Menggunakan unary dan biner + dalam kode terbaru. Terlihat lucu, bukan?