Mengapakah `${\'h.className = h.className ? \' error\' : \'error\'}` tidak berfungsi seperti yang diharapkan dalam JavaScript?

Menyelesaikan Masalah Keutamaan Operator Ternary dalam JavaScript

Pengendali ternary JavaScript ialah alat yang berkuasa untuk tugasan bersyarat, tetapi memahami keutamaannya boleh menjadi rumit. Artikel ini memfokuskan pada senario tertentu di mana operator ternary digabungkan dengan =.

Memahami Masalah

Pertimbangkan coretan kod berikut:

h.className += h.className ? ' error' : 'error'

Pada pandangan pertama, kod tersebut kelihatan menggabungkan nilai semasa h.className dengan sama ada 'ralat' atau 'ralat' berdasarkan keadaan ternary. Walau bagaimanapun, tafsiran ini boleh membawa kepada ralat.

Tafsiran Betul

Isunya terletak pada keutamaan pengendali. Dalam JavaScript, pengendali mempunyai keutamaan yang lebih tinggi daripada pengendali ternary. Ini bermakna ungkapan di atas dinilai seperti berikut:

h.className = h.className + (h.className ? ' error' : 'error')

Penyelesaian

Untuk memastikan pengendali ternary digunakan dengan betul, kod tersebut hendaklah ditulis sebagai:

h.className = h.className + (h.className ? ' error' : 'error')

Ini memastikan pengendali ternary dinilai sebelum penyatuan dengan h.className.

Pertimbangan Tambahan

Adalah penting untuk ambil perhatian bahawa h.className = ' ralat' juga sah, tetapi ia tidak setepat kod yang dikemas kini. Operator = hanya digunakan pada h.className, manakala kod yang dikemas kini secara eksplisit menggabungkan hasil keadaan ternary dengan h.className.

Kesimpulan

Memahami keutamaan operator adalah penting untuk menulis kod JavaScript yang betul. Dengan menjelaskan peraturan keutamaan untuk pengendali ternary dan operator =, artikel ini menyediakan penyelesaian kepada cabaran biasa yang dihadapi apabila menggunakan tugasan bersyarat dalam JavaScript.

Atas ialah kandungan terperinci Mengapakah `${\'h.className = h.className ? \' error\' : \'error\'}` tidak berfungsi seperti yang diharapkan dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!