JS interop
- Dart kursu
- İleri seviye
- Ders 52/83
- 5 dk
dart:js_interop ile JavaScript interop öğrenirsin.
dart:js_interop
dart:js_interop, Dart ile JavaScript arasında tip güvenli köprü kuran kütüphanedir. Dart 3 ile gelen modern JS birlikte çalışma (interop) yoludur. @JS() ek açıklaması (annotation) ve external anahtarı ile JS fonksiyonlarını bildirirsin.
Örnek: @JS() external void alert(JSString msg);. Bu, tarayıcının alert fonksiyonunu Dart'ta çağrılabilir yapar. Eski dart:js ve package:js API'lerinin yerini alırr; dart2wasm ile uyumlu çalışır.
JS fonksiyonu çağırma
Bir JS fonksiyonunu Dart'tan çağırmak için önce external bildirim yaparsın: @JS() external void consoleLog(JSString msg);. Bu, tarayıcının console.log benzeri bir fonksiyonunu Dart'ta çağrılabilir yapar.
Çağırma: consoleLog('Merhaba'.toJS);. Burada .toJS Dart String'ini JS String'ine çevirir. Dönüşte .toDart kullanırsın. Bu çeviriler dart:js_interop'un tip güvenli köprüsünü oluşturur.
Uygulama dart:js_interop bilgisini yazdır
import 'dart:js_interop'; ekle. @JS() ek açıklaması ile external void consoleLog(JSString msg); bildirimi ekle. main içinde print('dart:js_interop: JS köprüsü') ve print('Açıklama: @JS()') çağrılarını ekle.
Başlangıç kodu
// dart:js_interop paketini içe aktar
// @ JS() external consoleLog bildirimi ekle
void main() {
// dart:js_interop bilgisini yazdır
}Örnek çözüm
import 'dart:js_interop';
@JS()
external void consoleLog(JSString msg);
void main() {
print('dart:js_interop: JS köprüsü');
print('Açıklama: @ JS()');
}Beklenen çıktı
dart:js_interop: JS köprüsü Açıklama: @ JS()
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 dart:js_interop ne sağlar?
- Dosya girdi/çıktısı
- Tarayıcı çerezleri
- Ağ isteği
- JS ile tip güvenli köprü Doğru cevap
Açıklama: dart:js_interop Dart ile JS arasında tip güvenli köprü kurar.
2 dart:js_interop parçalarını eşleştir
| Kavram | Anlamı |
|---|---|
dart:js_interop |
JS köprüsü |
@JS() |
Ek açıklama |
external |
Harici bildirim |
toJS |
Dart → JS |
3 toJS çevirisi
'Merhaba'.____;'Merhaba'.toJS;Açıklama: .toJS Dart String'ini JS String'ine çevirir.