Reaktivitas Vue
Reactivity system, reactive vs ref, toRef, toRefs, unref, shallow reactivity, readonly
1Apa itu sistem reaktivitas Vue?
Apa itu sistem reaktivitas Vue?
Jawaban
Sistem reaktivitas Vue secara otomatis mendeteksi perubahan pada data dan memperbarui DOM sesuai dengan perubahan tersebut. Sistem ini mengandalkan Proxy JavaScript yang mencegat akses dan modifikasi properti. Sistem ini memastikan antarmuka pengguna tetap tersinkronisasi dengan state aplikasi tanpa intervensi manual.
2Apa perbedaan utama antara ref() dan reactive()?
Apa perbedaan utama antara ref() dan reactive()?
Jawaban
ref() membuat referensi reaktif untuk nilai primitif atau objek, yang diakses melalui .value, sedangkan reactive() membuat proxy reaktif dari sebuah objek tanpa memerlukan .value untuk mengakses propertinya. ref() bersifat universal (primitif + objek) dan ideal untuk nilai sederhana, sedangkan reactive() dioptimalkan untuk objek tetapi tidak bekerja dengan nilai primitif. Dalam praktiknya, ref() sering lebih disukai karena bekerja dengan semua tipe.
3Bagaimana cara mengakses nilai sebuah ref di template dibandingkan di script?
Bagaimana cara mengakses nilai sebuah ref di template dibandingkan di script?
Jawaban
Di template, Vue secara otomatis melakukan unwrap pada refs, sehingga memungkinkan akses langsung tanpa .value (mis: {{ count }}). Di script, Anda harus menggunakan .value untuk membaca atau memodifikasi nilai ref (mis: count.value++). Perilaku otomatis di template ini menyederhanakan penulisan kode sekaligus mempertahankan kontrol eksplisit dalam logika JavaScript.
Apa yang terjadi jika Anda mendestrukturisasi objek reactive()?
Apa tujuan dari toRefs() di Vue?
+17 pertanyaan wawancara
Topik wawancara Vue.js / Nuxt.js lainnya
Dasar-Dasar JavaScript
JavaScript Modern (ES6+)
Dasar-Dasar Vue
Komponen Vue
Vue Router
Pinia State Management
Vuex (Legacy)
Composition API
Dasar-Dasar Nuxt
Data Fetching Nuxt
SSR & SSG Nuxt
Server Routes Nuxt
Modul Nuxt
Composable Vue
Form & Validasi Vue
Manajemen State Nuxt
Testing Vue
Deployment Nuxt & CI/CD
Performa Vue
Pola Lanjutan Vue
TypeScript dengan Vue
Autentikasi Nuxt
SEO dengan Nuxt
Internasionalisasi Nuxt
Arsitektur Vue
Keamanan Nuxt
Ekosistem Vue
Migrasi Vue 2→3 & Nuxt 2→3
Kuasai Vue.js / Nuxt.js untuk wawancara berikutnya
Akses semua pertanyaan, flashcards, tes teknis, latihan code review dan simulator wawancara.
Mulai gratis