# TypeScript dengan Vue (Vue.js / Nuxt.js)

> Dukungan TypeScript Vue 3, defineComponent, PropType, type inference, generic components, strict mode

- 22 pertanyaan wawancara
- Senior
- [Pertanyaan Wawancara: Vue.js / Nuxt.js](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara.md)

## 1. Apa peran utama defineComponent di Vue 3 dengan TypeScript?

**Jawaban**

defineComponent mengaktifkan type inference TypeScript untuk opsi komponen. Tanpa fungsi ini, konteks this akan diperlakukan sebagai any di Options API. Ini memastikan props, data, computed, dan method ditipekan dengan benar secara otomatis.

## 2. Mengapa menggunakan PropType saat mendeklarasikan props kompleks dengan runtime declaration?

**Jawaban**

PropType adalah utility type Vue yang memungkinkan casting tipe prop selama deklarasi runtime. Object as PropType Book memastikan book ditipekan dengan benar sebagai Book alih-alih Object generik. Ini meningkatkan autocomplete dan keamanan tipe tanpa memerlukan script setup dengan tipe generik.

## 3. Apa perbedaan antara script setup dan script setup dengan lang='ts' untuk type inference?

**Jawaban**

script setup dengan lang='ts' mengaktifkan TypeScript dan memungkinkan type inference otomatis tanpa defineComponent. Props yang didefinisikan dengan defineProps ditipekan secara otomatis, refs memiliki inference penuh, dan error TypeScript terdeteksi saat compile time. Tanpa lang='ts', tidak ada pemeriksaan tipe yang dilakukan.

## 19 pertanyaan lagi tersedia

- Bagaimana cara menipekan ref dengan benar yang awalnya bisa null di TypeScript?
- Apa keuntungan utama dari komponen generik dengan script setup generic di Vue 3.3+?

Daftar gratis: https://sharpskill.dev/id/login

## Topik wawancara Vue.js / Nuxt.js lainnya

- [Dasar-Dasar JavaScript](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/javascript-fundamentals.md): 20 pertanyaan, Junior
- [JavaScript Modern (ES6+)](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/es6-modern-javascript.md): 20 pertanyaan, Junior
- [Dasar-Dasar Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-basics.md): 22 pertanyaan, Junior
- [Komponen Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-components.md): 20 pertanyaan, Junior
- [Vue Router](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-router.md): 18 pertanyaan, Junior
- [Pinia State Management](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/pinia-state-management.md): 20 pertanyaan, Junior
- [Vuex (Legacy)](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vuex-legacy.md): 15 pertanyaan, Mid-Level
- [Composition API](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/composition-api.md): 24 pertanyaan, Mid-Level
- [Reaktivitas Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-reactivity.md): 20 pertanyaan, Mid-Level
- [Dasar-Dasar Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-fundamentals.md): 22 pertanyaan, Mid-Level
- [Data Fetching Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-data-fetching.md): 20 pertanyaan, Mid-Level
- [SSR & SSG Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-ssr-ssg.md): 22 pertanyaan, Mid-Level
- [Server Routes Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-server-routes.md): 20 pertanyaan, Mid-Level
- [Modul Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-modules.md): 18 pertanyaan, Mid-Level
- [Composable Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-composables.md): 20 pertanyaan, Mid-Level
- [Form & Validasi Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-forms-validation.md): 20 pertanyaan, Mid-Level
- [Manajemen State Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-state-management.md): 18 pertanyaan, Mid-Level
- [Testing Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-testing.md): 20 pertanyaan, Mid-Level
- [Deployment Nuxt & CI/CD](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-deployment-cicd.md): 22 pertanyaan, Mid-Level
- [Performa Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-performance.md): 22 pertanyaan, Senior
- [Pola Lanjutan Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-advanced-patterns.md): 24 pertanyaan, Senior
- [Autentikasi Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-auth.md): 20 pertanyaan, Senior
- [SEO dengan Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-seo.md): 20 pertanyaan, Senior
- [Internasionalisasi Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-i18n.md): 18 pertanyaan, Senior
- [Arsitektur Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-architecture.md): 22 pertanyaan, Senior
- [Keamanan Nuxt](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/nuxt-security.md): 20 pertanyaan, Senior
- [Ekosistem Vue](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/vue-ecosystem.md): 18 pertanyaan, Senior
- [Migrasi Vue 2→3 & Nuxt 2→3](https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/migration-vue2-vue3-nuxt2-nuxt3.md): 22 pertanyaan, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/id/technologies/vue-nuxt/pertanyaan-wawancara/typescript-vue