0Pricing
TypeScript Academy · Pelajaran

Import dan Ekspor Khusus Tipe

Gunakan import type untuk menghindari beban saat runtime.

Import dan Ekspor Khusus Tipe adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 3 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar TypeScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus TypeScript Academy mencakup 4 pelajaran total.

Selamat Datang

Impor dan ekspor hanya tipe (import type / export type) diperkenalkan dalam TypeScript 3.8 untuk memberi pengembang kendali eksplisit atas hal yang merupakan dependensi waktu proses dan hal yang hanya berupa tipe.

Mengapa Hanya Tipe Itu Penting

Impor biasa dapat menyertakan kode waktu proses. Jika Anda hanya memerlukan tipenya, impor tersebut dapat dihapus sepenuhnya dari keluaran terkompilasi.
import { User } from './models'; // includes runtime binding
import type { User } from './models'; // compile-time only, erased

Sintaks untuk import type

Tempatkan `type` setelah kata kunci `import`. Anda tidak dapat menggunakan nama yang diimpor sebagai nilai.
import type { ApiResponse } from './api-types';

function handleResponse(res: ApiResponse<User>): void {
  // ApiResponse used as type annotation only
}

Sintaks untuk export type

Gunakan `export type` untuk menandai ekspor secara eksplisit sebagai ekspor hanya tipe.
// user.types.ts
export type UserId = string;
export type { User, UserRole };

Impor Tipe Sebaris

TypeScript 4.5 dan yang lebih baru memungkinkan Anda menandai impor individual sebagai hanya tipe di dalam pernyataan impor biasa.
import { type User, createUser } from './user';
// User is type-only, createUser is a runtime value

Mengatasi Dependensi Sirkular

Impor hanya tipe dapat mengatasi masalah dependensi sirkular karena tidak membuat pengikatan waktu proses.

verbatimModuleSyntax

TypeScript 5.0 memperkenalkan `verbatimModuleSyntax`. Jika diaktifkan, Anda MUST menggunakan `import type` untuk impor hanya tipe agar tidak membingungkan pengemas.
// tsconfig.json
{ "compilerOptions": { "verbatimModuleSyntax": true } }

importsNotUsedAsValues

Opsi compiler `importsNotUsedAsValues` (yang telah digantikan oleh verbatimModuleSyntax) mengatur cara TypeScript menangani impor nilai yang tidak digunakan.

Manfaat dalam Pengemas

Pengemas seperti Vite dan esbuild menggunakan penanda `import type` untuk melewati pemrosesan impor tipe sehingga meningkatkan kecepatan pembuatan.

Ekspor Ulang Hanya Tipe

Ekspor ulang tipe tanpa menyertakan modul waktu prosesnya.
// public-api.ts
export type { User, UserRole } from './internal-user';
export { createUser } from './internal-user'; // runtime

Kesalahan: Tidak Dapat Menggunakan import type sebagai Nilai

Menggunakan impor hanya tipe sebagai nilai waktu proses merupakan kesalahan kompilasi.
import type { User } from './user';
// const u = new User(); // Error — User was imported as type-only

Pemeriksaan Singkat

Kapan Anda harus menggunakan `import type` alih-alih `import` biasa?

Rangkuman

Gunakan `import type` dan `export type` untuk impor dan ekspor hanya tipe. Keduanya dihapus saat kompilasi, mencegah dependensi waktu proses pada berkas tipe, dan diperlukan saat verbatimModuleSyntax diaktifkan.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Import dan Ekspor Khusus Tipe” gratis?

Ya — teks lengkap “Import dan Ekspor Khusus Tipe” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus TypeScript Academy, upgrade ke CoddyKit PRO. Kursus TypeScript Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Import dan Ekspor Khusus Tipe”?

Gunakan import type untuk menghindari beban saat runtime. Kamu berlatih TypeScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai TypeScript Academy?

Tidak diperlukan pengalaman sebelumnya. TypeScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 3 dari 4.

Berapa lama pelajaran “Import dan Ekspor Khusus Tipe” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran TypeScript Academy ini?

Ya. Setiap pelajaran TypeScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

  1. Sintaks Modul ES: import dan export
  2. Ekspor Ulang dan File Barrel
  3. Import dan Ekspor Khusus Tipe
  4. Namespace vs Modul: Penggunaan Modern
← Kembali ke TypeScript Academy