JavaScript
Özet - Modüller
Named ve default export/import kullanarak iki dosyalı basit bir hesap modülü oluşturursun.
Özet - Hesap modülü
Bu özette iki dosyalık bir hesap modülü oluşturacaksın: calc.js işlemleri dışa aktarır, main.js onları içe aktarır ve kullanır.
calc.js içinde add ve subtract named export, calculate default export olacak. main.js bunları tek bir import satırıyla alıp console.log ile sonucu gösterecek.
Bu, gerçek projelerde dosyaları nasıl birbirine bağladığını özetler.
Uygulama calc.js modülünü yaz
calc.js modülü yaz: add ve subtract işlevlerini named export olarak, calculate işlevini default export olarak dışa aktar. calculate bir op ve iki sayı alsın.
Örnek çözümü göster
İki named export function, bir default export function yaz. calculate bir op ve iki sayı alsın.
Örnek çözüm:
export function add(a, b) {
return a + b;
}
export function subtract(a, b) {
return a - b;
}
export default function calculate(op, a, b) {
if (op === "+") return add(a, b);
if (op === "-") return subtract(a, b);
return 0;
}
main.js içe aktarımı
main.js dosyası calc.js'ten değerleri içe aktarır. Named ve default import'u tek satırda birleştirebilirsin; bu gerçek projelerde dosyaları birbirine bağlamanın temel yoludur.
import calculate, { add, subtract } from './calc.js';
Sonra calculate'i çağırıp sonucu yazdırırsın:
console.log(calculate("+", 5, 3));
Bu, modüllerin nasıl birbirini bulup kullandığını gösterir.
Uygulama main.js içe aktarımı yaz
main.js dosyasında ./calc.js modülünden add ve subtract'ı named, calculate'i default import ile içe aktar. Sonra calculate("+", 5, 3) sonucunu console.log ile yazdır.
Örnek çözümü göster
Default ismi ve süslü parantezli named listesini virgülle ayır. Sonra calculate'i çağır.
Örnek çözüm:
import calculate, { add, subtract } from './calc.js';
console.log(calculate("+", 5, 3));
Kendini test et
-
Bir modülde hem named hem default export olabilir mi?
- Hayır, sadece bir tür
- Evet, ikisi birden
- Sadece named
- Sadece default
Cevabı göster
Evet, ikisi birden — Doğru! Bir modülde hem named hem default export bulunabilir.
-
Dışa/içe aktarım türlerini eşleştir
- named export
- isme göre
- default export
- modül başına bir
- named import
- { } ile
- default import
- isme gerek yok
Sıradaki ders: Meydan okuma - DOM uygulaması
