0Pricing
TypeScript Academy · Pelajaran

Modul ES (bernama vs bawaan), ekspor ulang

Pahami ekspor/impor bernama vs bawaan dan cara mengekspor ulang untuk membangun batas modul yang rapi.

Modul ES (bernama vs bawaan), ekspor ulang adalah pelajaran TypeScript Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 3. 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 3 pelajaran total.

Pendahuluan

Tujuan: Gunakan Modul ES dengan percaya diri. Anda akan mengekspor/mengimpor simbol bernama dan default, lalu menyusunnya dengan ekspor ulang untuk API publik yang rapi.

Ekspor/impor bernama

Ekspor bernama menggunakan export sebelum deklarasi; impor dengan kurung kurawal: import { name }.

// file: math.ts
export function add(a: number, b: number): number { return a + b }
export const PI = 3.14159

// file: app.ts
import { add, PI } from "./math"
console.log(add(2, 3), PI) // 5 3.14159

Ekspor/impor bawaan

Ekspor bawaan adalah nilai utama sebuah modul. Impor tanpa kurung kurawal: import Foo from "./mod".

// file: greet.ts
export default function greet(name: string) { console.log(`Hello, ${name}`) }

// file: app.ts
import greet from "./greet"
greet("Ada")

Bawaan + bernama bersama-sama

Anda dapat menggabungkan satu ekspor bawaan dengan beberapa ekspor bernama dalam sebuah modul, lalu mengimpor keduanya bersama-sama.

// file: color.ts
export default "black"
export const palette = [ "red", "green", "blue" ]

// file: app.ts
import baseColor, { palette } from "./color"
console.log(baseColor, palette.length)

Ekspor ulang (barrel)

Ekspor ulang (export { x } from / export * from) membuat sebuah barrel, sehingga konsumen mengimpor dari satu titik masuk.

// file: math/add.ts
export const add = (a: number, b: number) => a + b

// file: math/index.ts (barrel)
export { add } from "./add"
export * from "./more"

// file: app.ts
import { add } from "./math"
console.log(add(1, 2))

Kiat & kendala

Kiat:

  • Utamakan ekspor bernama agar mudah ditemukan dan penggantian nama tetap konsisten.
  • Gunakan ekspor bawaan untuk satu hal “utama” dalam sebuah modul.
  • Buat barrel pada batas paket; hindari impor melingkar.

Pemeriksaan impor bawaan

Pemeriksaan singkat: Impor mana yang cocok dengan ekspor bawaan?

Ringkasan

Ringkasan: Gunakan ekspor bernama untuk beberapa ekspor, bawaan untuk satu nilai utama, dan ekspor ulang untuk menyajikan titik masuk yang rapi.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Modul ES (bernama vs bawaan), ekspor ulang” gratis?

Ya — teks lengkap “Modul ES (bernama vs bawaan), ekspor ulang” 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 3 pelajaran total.

Apa yang akan aku pelajari di “Modul ES (bernama vs bawaan), ekspor ulang”?

Pahami ekspor/impor bernama vs bawaan dan cara mengekspor ulang untuk membangun batas modul yang rapi. 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 1 dari 3.

Berapa lama pelajaran “Modul ES (bernama vs bawaan), ekspor ulang” 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. Modul ES (bernama vs bawaan), ekspor ulang
  2. Deklarasi ambient (.d.ts) & pengetikan pihak ketiga
  3. Pemetaan jalur & resolusi modul
← Kembali ke TypeScript Academy