Türkiye'de ilk Mobil & PC Aynı Anda Metin2 Oyna. Triarchonline kalıcı ve uzun ömürlü yapısı ile 24 Temmuz'da açılıyor. | 1-99 Mobil Metin2 Triarch HEMEN TIKLA!
[NODE JS] ES Modules: import ve export
Merhaba arkadaşlar. Bir önceki konuda CommonJS modül sistemini gördük, şimdi modern JavaScript'in modül sistemi olan ES Modules'a bakacağız. ES Modules, ECMAScript standardının bir parçasıdır ve tarayıcılarda da desteklenir. Node.js'te ES Modules desteği versiyon 12 ile deneysel olarak geldi ve 14'ten itibaren stabil hale geldi. Ben yeni projelerimde artık ES Modules kullanıyorum ama eski projelerde hala CommonJS var.
ES Modules Nasıl Kullanılır?
ES Modules kullanmak için iki yol var: dosya uzantısını .mjs yapmak veya package.json'a "type": "module" eklemek. Ben ikinci yöntemi tercih ediyorum çünkü tüm .js dosyaları otomatik olarak ES module olarak işlenir. Ama dikkat, bu durumda CommonJS kullanmanız gereken dosyalar için .cjs uzantısı kullanmanız lazım.
import ve export ifadelerinin require'dan en büyük farkı statik olmasıdır. Yani import ifadeleri dosyanın en üstünde olmalıdır ve koşullu kullanılamazlar. Bu kısıtlama aslında iyi bir şey çünkü bundler'lar ve IDE'ler statik analiz yapabilir, tree shaking ile kullanılmayan kodları çıkarabilir.
JavaScript:
// === ES MODULES: EXPORT ===
// ---- utils.mjs (veya package.json'da "type": "module" varsa utils.js) ----
// Named export - isimli dışa aktarma
export const PI = 3.14159;
export const E = 2.71828;
export function topla(a, b) {
return a + b;
}
export function cikar(a, b) {
return a - b;
}
export function carp(a, b) {
return a * b;
}
// Fonksiyon tanımladıktan sonra da export edilebilir
function bol(a, b) {
if (b === 0) throw new Error('Sıfıra bölünemez');
return a / b;
}
function mod(a, b) {
return a % b;
}
export { bol, mod };
// Yeniden adlandırarak export
export { bol as bolme, mod as modulo };
// Default export - varsayılan dışa aktarma
// Her modülde sadece BİR tane default export olabilir
export default class Hesaplayici {
constructor() {
this.gecmis = [];
}
hesapla(islem, a, b) {
let sonuc;
switch (islem) {
case '+': sonuc = a + b; break;
case '-': sonuc = a - b; break;
case '*': sonuc = a * b; break;
case '/':
if (b === 0) throw new Error('Sıfıra bölünemez');
sonuc = a / b;
break;
default:
throw new Error(`Bilinmeyen işlem: ${islem}`);
}
this.gecmis.push({ islem, a, b, sonuc });
return sonuc;
}
gecmisiGoster() {
return this.gecmis.map(g =>
`${g.a} ${g.islem} ${g.b} = ${g.sonuc}`
);
}
}
// ---- Aynı dosyadan birden fazla şekilde export ----
// Bu pattern'i kütüphanelerde sık görürsünüz
const VERSIYON = '2.0.0';
const YAZAR = 'Geliştirici';
export { VERSIYON, YAZAR };
import Kullanımı
import ifadesi farklı şekillerde kullanılabilir: named import, default import, namespace import ve bunların kombinasyonları. Hangi durumda hangisini kullanacağınızı bilmek önemli.
Named import'ta süslü parantez kullanırsınız ve export edilen ismi tam olarak yazmanız gerekir. Default import'ta süslü parantez yok ve istediğiniz ismi verebilirsiniz. Bu esneklik güzel ama bazen kafa karıştırıcı olabiliyor, özellikle hem default hem named export kullanan modüllerde.
JavaScript:
// === ES MODULES: IMPORT ===
// Named import - belirli export'ları alma
// import { topla, cikar, PI } from './utils.mjs';
// Yeniden adlandırarak import (alias)
// import { topla as toplama, cikar as cikarma } from './utils.mjs';
// Default import
// import Hesaplayici from './utils.mjs';
// (Herhangi bir isim verilebilir)
// import HesapMakinesi from './utils.mjs'; // Aynı şey
// Named + Default birlikte
// import Hesaplayici, { topla, PI } from './utils.mjs';
// Namespace import - tüm export'ları obje olarak alma
// import * as matematik from './utils.mjs';
// matematik.topla(3, 5);
// matematik.PI;
// matematik.default; // default export'a bu şekilde erişilir
// Dinamik import (async) - koşullu yükleme için
// const modul = await import('./utils.mjs');
// modul.topla(3, 5);
// modul.default; // Hesaplayici class'ı
// Simülasyon (gerçek dosya olmadan gösterim)
console.log('=== ES Modules Import Örnekleri ===');
// Dinamik import örneği (gerçek kullanım)
async function modulYukle(modulAdi) {
try {
// const modul = await import(`./${modulAdi}.mjs`);
console.log(`${modulAdi} modülü başarıyla yüklendi`);
// return modul;
} catch (hata) {
console.error(`${modulAdi} yüklenemedi:`, hata.message);
}
}
// Koşullu dinamik import - gerçek dünya senaryosu
async function veritabaniKur(tip) {
let driver;
switch (tip) {
case 'postgres':
// driver = await import('pg');
console.log('PostgreSQL driver yüklendi');
break;
case 'mysql':
// driver = await import('mysql2/promise');
console.log('MySQL driver yüklendi');
break;
case 'sqlite':
// driver = await import('better-sqlite3');
console.log('SQLite driver yüklendi');
break;
}
return driver;
}
// Re-export pattern (barrel export)
// ---- index.mjs ----
// export { topla, cikar } from './matematik.mjs';
// export { kullaniciBul, kullaniciOlustur } from './kullanici.mjs';
// export { default as Veritabani } from './veritabani.mjs';
// CommonJS vs ES Modules karşılaştırma tablosu
const karsilastirma = [
{ ozellik: 'Syntax', cjs: 'require() / module.exports', esm: 'import / export' },
{ ozellik: 'Yükleme', cjs: 'Senkron', esm: 'Asenkron' },
{ ozellik: 'Analiz', cjs: 'Dinamik (runtime)', esm: 'Statik (parse time)' },
{ ozellik: 'Tree Shaking', cjs: 'Zor', esm: 'Kolay' },
{ ozellik: 'Top-level await', cjs: 'Desteklenmiyor', esm: 'Destekleniyor' },
{ ozellik: 'Tarayıcı desteği', cjs: 'Yok (bundler gerekir)', esm: 'Doğal destek' },
{ ozellik: 'Dosya uzantısı', cjs: '.js veya .cjs', esm: '.mjs veya .js (type:module)' }
];
console.log('\n--- CommonJS vs ES Modules ---');
console.table(karsilastirma);
// package.json ayarı
const packageJson = {
"name": "proje-adi",
"version": "1.0.0",
"type": "module", // Bu satır ES Modules'ı aktif eder
"main": "src/index.js",
"exports": {
".": "./src/index.js",
"./utils": "./src/utils.js"
}
};
console.log('\npackage.json:', JSON.stringify(packageJson, null, 2));
veritabaniKur('postgres');
Yeni projelerde ES Modules kullanmanızı tavsiye ederim çünkü geleceğin standardı bu. Ama eski projeleri zorla dönüştürmeye gerek yok, CommonJS hala gayet çalışıyor. Önemli olan ikisini de bilmek ve hangisini nerede kullanacağınızı anlamak. Kolay gelsin.
Şu an konuyu görüntüleyenler (Toplam : 0, Üye: 0, Misafir: 0)
Benzer konular
- Cevaplar
- 0
- Görüntüleme
- 52
- Kilitli
- Cevaplar
- 7
- Görüntüleme
- 2K
- Kilitli
- Cevaplar
- 1
- Görüntüleme
- 445
- Cevaplar
- 1
- Görüntüleme
- 36
- Cevaplar
- 76
- Görüntüleme
- 6K
