JavaScript - Operator Precedence

Halo di sini, para pemula pemrograman! Hari ini, kita akan memantulkan sebuah topik yang mungkin terdengar menakutkan pada awalnya, tapi saya janji, itu tidak sekeras yang tampak. Kita akan membahas Operator Precedence di JavaScript. Pergunakanlah fikirannya sebagai "urutan pecking" bagi matematika dalam pemrograman. Mari kitauraikan bersama-sama!

JavaScript - Operator Precedence

Apa Itu Operator Precedence?

Sebelum kita melompat ke lubuk dalam, mari kita mulai dari dasar. Operator precedence mirip dengan urutan operasi yang Anda pelajari di kelas matematika. Ingat PEMDAS (Parentheses, Exponents, Multiplication, Division, Addition, Subtraction)? Baiklah, JavaScript memiliki versi sendiri dari hal ini!

Operator precedence menentukan bagaimana operator diparsingkan terhadap satu sama lain. Operator dengan tingkat prioritas yang lebih tinggi menjadi operan dari operator dengan tingkat prioritas yang lebih rendah.

mari kita lihat contoh sederhana:

let result = 5 + 3 * 2;
console.log(result); // Output: 11

Anda mungkin berpikir jawabannya seharusnya 16 (5 + 3 = 8, kemudian 8 2 = 16), tapi sebenarnya 11. Mengapa? Karena perkalian memiliki tingkat prioritas yang lebih tinggi daripada penambahan. Jadi, 3 2 dihitung terlebih dahulu (menghasilkan 6), dan kemudian 5 ditambahkan kepadanya.

Asosiasi

Sekarang, mari kita bicarakan kata yang indah: asosiasi. Jangan khawatir, itu lebih mudah daripada yang tampak!

Asosiasi menentukan urutan dalam mana operator yang memiliki prioritas yang sama diproses. Itu bisa either kiri-ke-kanan atau kanan-ke-kiri.

Asosiasi Kiri-ke-Kanan

Sebagian besar operator mengikuti asosiasi kiri-ke-kanan. Ini berarti mereka dievaluasi dari kiri ke kanan. mari kita lihat contoh:

let a = 10 - 5 - 2;
console.log(a); // Output: 3

Ini adalah bagaimana JavaScript memproses ini:

  1. 10 - 5 = 5
  2. 5 - 2 = 3

Asosiasi Kanan-ke-Kiri

Beberapa operator, seperti operator penugasan (=), memiliki asosiasi kanan-ke-kiri. mari kita lihat bagaimana ini bekerja:

let a, b, c;
a = b = c = 5;
console.log(a, b, c); // Output: 5 5 5

JavaScript memproses ini dari kanan ke kiri:

  1. c = 5
  2. b = c (yang adalah 5)
  3. a = b (yang adalah 5)

Tabel Prioritas Operator

Sekarang, mari kita lihat "menu" prioritas operator dalam JavaScript. Jangan khawatir jika Anda belum mengerti semuanya - kita akan melalui beberapa contoh!

Prioritas Tipe Operator Asosiasi Operator
19 Pengelompokan n/a ( ... )
18 Akses Anggota kiri-ke-kanan . []
17 Panggilan Fungsi kiri-ke-kanan ... ( )
16 New (dengan daftar argumen) n/a new ... ( )
15 Inkremen/Decremen Postfix n/a ... ++ ... --
14 Logika Tidak, Bitwise Tidak, Unary Plus/Minus, Inkremen/Decremen Prefix, typeof, void, delete, await kanan-ke-kiri ! ~ + - ++ -- typeof void delete await
13 Eksponen kanan-ke-kiri **
12 Perkalian, Pembagian, Sisa kiri-ke-kanan * / %
11 Penambahan, Pengurangan kiri-ke-kanan + -
10 geser Bitwise kiri-ke-kanan << >> >>>
9 Relasional kiri-ke-kanan < <= > >= in instanceof
8 Kesamaan kiri-ke-kanan == != === !==
7 AND Bitwise kiri-ke-kanan &
6 XOR Bitwise kiri-ke-kanan ^
5 OR Bitwise kiri-ke-kanan |
4 AND Logika kiri-ke-kanan &&
3 OR Logika kiri-ke-kanan ||
2 Conditional kanan-ke-kiri ?:
1 Penugasan kanan-ke-kiri = += -= *= /= %= <<= >>= >>>= &= ^= |= **=
0 Koma kiri-ke-kanan ,

Contoh

Sekarang, mari kita praktikkan pengetahuan ini dengan beberapa contoh!

Contoh 1: Operasi Aritmetik

let result = 2 + 3 * 4 - 1;
console.log(result); // Output: 13

Ini adalah bagaimana JavaScript mengevaluasi ini:

  1. 3 * 4 = 12 (perkalian memiliki prioritas yang lebih tinggi)
  2. 2 + 12 = 14
  3. 14 - 1 = 13

Contoh 2: Operasi Logika

let x = 5;
let y = 10;
let z = 15;

let result = x < y && y < z || x > z;
console.log(result); // Output: true

mari kitauraikan ini:

  1. x < y adalah benar
  2. y < z adalah benar
  3. true && true adalah benar
  4. x > z adalah salah
  5. true || false adalah benar

Ingat, && (AND) memiliki prioritas yang lebih tinggi daripada || (OR).

Contoh 3: Operasi Campuran

let a = 3;
let b = 4;
let c = 5;

let result = a + b * c > c * (a + b) && a < b;
console.log(result); // Output: false

Ini terlihat rumit, tapi mari kitaambil langkah demi langkah:

  1. b * c = 20
  2. a + 20 = 23
  3. c (a + b) = 5 7 = 35
  4. 23 > 35 adalah salah
  5. a < b adalah benar
  6. false && true adalah false

Contoh 4: Penugasan dan Perbandingan

let x, y, z;
x = y = z = 5;
console.log(x, y, z); // Output: 5 5 5

let result = x == y === z;
console.log(result); // Output: true

Ingat, penugasan (=) memiliki asosiasi kanan-ke-kiri, sedangkan perbandingan (==, ===) memiliki asosiasi kiri-ke-kanan.

  1. z = 5
  2. y = z (yang adalah 5)
  3. x = y (yang adalah 5)
  4. x == y adalah benar
  5. true === z adalah benar (karena z adalah 5, yang adalah truthy)

Kesimpulan

Selamat! Anda telah mengambil langkah pertama dalam memahami prioritas operator di JavaScript. Ingat, latihan membuat sempurna. Jangan takut untuk mencoba kombinasi operator yang berbeda - itu adalah cara Anda benar-benar menginternalisasikan konsep ini.

Dan saran profesional: jika ragu, gunakan tanda kurung! Mereka memiliki prioritas tertinggi dan bisa membuat kode Anda lebih mudah dibaca. Sebagai contoh:

let result = (2 + 3) * 4 - 1;
console.log(result); // Output: 19

Dengan cara ini, Anda secara eksplisit memberitahu JavaScript bagaimana Anda ingin ekspresi dievaluasi.

Terus coding, terus belajar, dan terutama, bersenang-senang! JavaScript adalah bahasa yang kuat, dan memahami dasar-dasar ini akan membantu Anda mencapai kesuksesan dalam perjalanan pemrograman Anda.

Credits: Image by storyset